Ergebnis 1 bis 5 von 5
  1. #1
    SFlepp ist offline Grünschnabel
    registriert
    26-05-2017
    Beiträge
    3

    Formular Fernsteuerung

    Hallo zusammen

    Ich habe mich zwahr etwas umgesehen aber nichts gefunden was mir helfen könnte... Wir benutzen im Geschäft für unsere Medienaufzeichnungen sogenannte AJA Recorder, diese lassen sich durch aufrufen der IP konfigurieren wie man es auch von diversen Switchs kennt. Da sich immer mehrere dieser Geräte im Einsatz befinden ist es umständlich, immer alle einzeln aufzurufen und zb zu formatieren... Daher hat mich mein Arbeitgeber gebeten, meine geringen Programmierkünste einzusetzen und ein simples HTML file zu schreiben wo dies möglich sein sollte alles auf einer Seite zu verbinden. Ich habe auch soweit alles geschafft, nur weiss ich nicht wie ich den Webbefehl des Gerätes absenden kann... Optik spielt keine Rolle, Funktionalität ist wichtig Langer Rede kurzer Sinn, ich lade Euch den Code mal hoch... Wenn ihr das Ganze testet werdet ihr schnell merken was die Idee dahinter war...
    HTML-Code:
    <!DOCTYPE html>
    
    <html>
        <head>
            <title>Aja Recorder</title>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <style>
                body{
                    max-width: 70%;
                    margin: 0 auto;
                    margin-top: 5rem;
                    background-color: lightblue;
                }
                .wrapper{
                    display: flex;
                    flex-direction: row;
                    flex-wrap: wrap;
                }
                .container{
                    margin-top: 1rem;
                } 
                form{
                    padding: 0.5rem;
                    width: 11rem;
                }
                input, select, textarea, checkbox {
                    margin-bottom: 10px;
                }
                button{
                    height: 3rem;
                }
                .ausgabe{
                    width: 25rem;
                    min-height: 3rem;
                    background-color: #fff;
                    margin: 2rem;
                    margin-left: 0;
                }
                #notiz{
                    padding: 10px;    
                }
    
            </style>
        </head>
        <body>
            <div class="wrapper">
                <div class="container">
                    <fieldset>
                        <legend>Recorder-Auflistung</legend>
                        <form>
                            <input id="checkbox1" type="checkbox" value="192.167.1.2"><label for="checkbox1">192.167.1.2</label><br/>
                            <input id="checkbox2" type="checkbox" value="192.167.1.171"><label for="checkbox2">192.167.1.171</label><br/>
                            <input id="checkbox3" type="checkbox" value="192.167.1.172"><label for="checkbox3">192.167.1.172</label><br/>
                            <input id="checkbox4" type="checkbox" value="192.167.1.173"><label for="checkbox4">192.167.1.173</label><br/>
                            <input id="checkbox5" type="checkbox" value="192.167.1.174"><label for="checkbox5">192.167.1.174</label><br/>
                            <input id="checkbox6" type="checkbox" value="192.167.1.175"><label for="checkbox6">192.167.1.175</label><br/>
                            <input id="checkbox7" type="checkbox" value="192.167.1.176"><label for="checkbox7">192.167.1.176</label><br/>
                        </form>
                        <button onclick="allCheck()" id="all">Anwählen</button>
                        <button onclick="allUncheck()" id="all">Abwählen</button>
                    </fieldset>
                    <div class="container">
                        <button onclick="formatieren()">Formatieren</button> 
                    </div>
                </div>
                <div class="container">
                    <fieldset>
                        <legend>Inputs</legend>
                        <form>
                            <label for="IPinput">IP Eingabe</label>
                            <input id="IPinput" type="text" placeholder="XXX.XXX.X.XXX" value="0" >
                            <label for="TakeNr">Take Nummer</label><br>
                            <input id="TakeNr" type="text" placeholder="Nummer"><br>
    
                            <label for="TakeName">Take Name</label><br>
                            <input id="TakeName" type="text" placeholder="Name"><br>
    
                        </form>
                        <button onclick="takeNr()">Take Nr</button>
                        <button onclick="takeName()">Take Name</button>
                    </fieldset>   
    
                </div>
                <div class="container">
                    <div class="ausgabe">
                        <div id="notiz"></div>
                    </div>
                </div>
            </div>
    
    
            <script>
    
                function formatieren() {
                    var count = 0;
                    var ip = document.forms[0];
                    var notizelement = document.getElementById("notiz");
                    notizelement.innerHTML = "";
                    var IPinput = document.getElementById("IPinput");
                    for (var i = 0; i < ip.length; i++) {
                        if (ip[i].type === 'checkbox' && ip[i].checked) {
                            console.log(ip[i].value);
                            var notiz = notizelement.innerHTML;
                            notiz = notiz + ip[i].value + " wird formatiert...<br>";
                            notizelement.innerHTML = notiz;
                            count++;
                                              }
                    }
    
                    if (count === 0 && IPinput.value == 0) {
                        alert("Es muss mindestens eine Checkbox aktiviert worden sein oder eine IP manuell eingetragen werden");
                    }
                    if (IPinput.value != 0) {
                        var notiz = notizelement.innerHTML;
                        notiz = notiz + IPinput.value + " wird formatiert...<br>";
                        notizelement.innerHTML = notiz;
                    }
                    count = 0;
                }
                function takeNr() {
                    var count = 0;
                    var nummer = document.getElementById('TakeNr').value;
                    var notizelement = document.getElementById("notiz");
                    var IPinput = document.getElementById("IPinput");
                    notizelement.innerHTML = "";
                    if (nummer != null && nummer >= 1) {
                        var ip = document.forms[0];
                        for (var i = 0; i < ip.length; i++) {
                            if (ip[i].type === 'checkbox' && ip[i].checked) {
                                count++;
                                var notiz = notizelement.innerHTML;
                                notiz = notiz + ip[i].value + " erhält die Take Nummer " + nummer + " <br>";
                                notizelement.innerHTML = notiz;
                                console.log(ip[i].value + " Take Nummer " + nummer);
                                //  ip[i].checked = false;
                            }
                        }
                    }
                    if (IPinput.value != 0) {
                        var notiz = notizelement.innerHTML;
                        notiz = notiz + IPinput.value + " erhält die Take Nummer " + nummer + " <br>";
                        notizelement.innerHTML = notiz;
                    }
                    if (count === 0 && IPinput.value == 0) {
                        alert("Es muss mindestens eine Checkbox aktiviert oder eine IP manuell eingegeben worden sein");
                    }
                    if (nummer <= 0) {
                        alert("Es muss eine Nummer eingegeben werden!");
                    }
                    //document.getElementById('TakeNr').value = null;
                    count = 0;
                }
    
    
                function takeName() {
                    var count = 0;
                    var name = document.getElementById('TakeName').value;
                    var notizelement = document.getElementById("notiz");
                    var IPinput = document.getElementById("IPinput");
                    notizelement.innerHTML = "";
                    if (count === 0 && IPinput.value == 0) {
                        alert("Es muss mindestens eine Checkbox aktiviert oder eine IP manuell eingegeben worden sein");
                    }
                    if (name.length >= 1) {
                        var ip = document.forms[0];
                        for (var i = 0; i < ip.length; i++) {
                            if (ip[i].type === 'checkbox' && ip[i].checked) {
                                count++;
                                var notiz = notizelement.innerHTML;
                                notiz = notiz + ip[i].value + " erhält die Take Bezeichung " + name + " <br>";
                                notizelement.innerHTML = notiz;
                                console.log(ip[i].value + " Take Name " + name);
                                //  ip[i].checked = false;
                            }
                        }
                    } else {
                        alert("Es muss eine Bezeichnung eingegeben werden!");
                    }
                    if (IPinput.value != 0) {
                        var notiz = notizelement.innerHTML;
                        notiz = notiz + IPinput.value + " erhält die Take Bezeichnung " + name + " <br>";
                        notizelement.innerHTML = notiz;
                    }
                    // document.getElementById('TakeName').value = null;
                    count = 0;
                }
    
                function allCheck() {
                    var ip = document.forms[0];
                    for (var i = 0; i < ip.length; i++) {
                        ip[i].checked = true;
    
                    }
                }
    
                function allUncheck() {
                    var ip = document.forms[0];
                    for (var i = 0; i < ip.length; i++) {
                        ip[i].checked = false;
    
                    }
                }
            </script>
        </body>
    </html>
    Der Webbefehl um die Recorder zu formatieren wäre -> http://192.168.1.xxx/config?action=s...=1495798877169
    Die IP müsste dynamisch in den Webbefehl eingefügt werden können und es soll kein Fenster geöffnet werden durch den Link

    Ich hoffe Ihr habt ungefähr verstanden was ich brauche und könnt mir dabei helfen..
    Ach ja und der Code wird wohl nicht Perfekt sein.... Aber bin noch Anfänger

    Freundliche Grüsse
    Sandro
    Geändert von mikdoe (02-06-2017 um 09:43 Uhr) Grund: Titel geändert, gelöst

  2. #2
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.650

    AW: Bisschen überfordert

    Ich würde die URL einfach in einem verstecken iFrame aufrufen. AJAX ist wegen der SOP hier nicht zu empfehlen.

  3. #3
    SFlepp ist offline Grünschnabel
    registriert
    26-05-2017
    Beiträge
    3

    AW: Bisschen überfordert

    ok, ich werde mir das bei gelegenheit mal ansehen... hast du evtl codebeispiele wie ich die url aufrufe und die ip dynamisch anpassen kann?

    vielen dank für die mühen

  4. #4
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.650

    AW: Bisschen überfordert

    Zitat Zitat von SFlepp Beitrag anzeigen
    hast du evtl codebeispiele wie ich die url aufrufe
    IFRAME_REFERENZ.src = url;
    Zitat Zitat von SFlepp Beitrag anzeigen
    die ip dynamisch anpassen kann?
    var url = "http://" + ip + "/path/to/file.html";

  5. #5
    SFlepp ist offline Grünschnabel
    registriert
    26-05-2017
    Beiträge
    3

    AW: Bisschen überfordert

    Vielen Dank für die prompten Antworten stets

    Ich habe es in der Klasse besprochen, und habe es trotz deiner Empfehlung mit AJAX geschrieben... Funktioniert soweit auch alles ganz gut

    Nun habe ich ein neues Problem, welches ich nicht verstehe.... Ich habe eine for Schlaufe mit einer Variablen i, die mir die IPs und ein Textfeld auslesen soll damit ich diese kombinieren kann. Die IPs werden korrekt ausgelesen, aber bei den Textfeldern wird irgendwie nur jedes zweite ausgegeben... Irgendwas stimmt mit der Iteration von i nicht ganz, aber ich krieg einfach nicht raus was es ist!

    HTML-Code:
      function takeName() {
                    var count = 0;
                    var name = document.getElementById('TakeName').value;
                    var notizelement = document.getElementById("notiz");
                    var IPinput = document.getElementById("IPinput");
                    notizelement.innerHTML = "";
                    var ip = document.forms[0];
                    var lokal = document.getElementsByName('lokal');
                    
                    if (name.length >= 1) {
                        for (var i = 0; i < lokal.length; i++) {
                             if (ip[i].type === 'checkbox' && ip[i].checked && lokal[i].value !== "") { 
    
                                    console.log("Variable i ist " + i);
                                        var request = new XMLHttpRequest();
                                          request.addEventListener('load', function(event) {
                                          if (request.status >= 200 && request.status < 300) {
                                          console.log(request.responseText);
                                          } else {
                                          console.warn(request.statusText, request.responseText);
                                          }
                                          });
                                
                                            
                                            var notiz = notizelement.innerHTML;
                                            notiz = notiz + ip[i].value + " erhält die Take Bezeichnung " + lokal[i].value + "_" + name + " <br>";
                                            notizelement.innerHTML = notiz;
    
                                            request.open("GET","http://"+ ip[i].value + "/config?action=set&paramid=eParamID_CustomClipName&value="+ lokal[i].value + "_" + name + "&configid=0&_=1496218056512");
                                            request.send();
                                            count++;
                                          }
                             if(ip[i].type === 'checkbox' && ip[i].checked && lokal[i].value === "") {
                        alert("Es fehlt eine Bezeichnung!");
                            }
                        }
                    } 
                    else{
                        alert("Es muss ein Take Name eingegeben werden!");
                    }
                    if (IPinput.value !== "") {
                        var notiz = notizelement.innerHTML;
                        notiz = notiz + IPinput.value + " erhält die Take Bezeichnung " + name + " <br>";
                        notizelement.innerHTML = notiz;
                        
                        request.open("GET","http://"+ IPinput.value + "/config?action=set&paramid=eParamID_CustomClipName&value=" + name + "&configid=0&_=1496218056512");
                        request.send();
                        
                    }
                    if (count === 0 && IPinput.value === "") {
                        alert("Es muss mindestens eine Checkbox aktiviert oder eine IP manuell eingegeben worden sein");
                    }
                    count = 0;
                }
    Vielen Dank für Deine/Eure Hilfe und Geduld

    - - - Aktualisiert - - -

    das Problem hat sich gelöst... hab den fehler gefunden in der if abfrage...

    Vielen dank für die Hilfe

Ähnliche Themen

  1. Eingabefeld bisschen anders
    Von Arcsinh im Forum CSS und (X)HTML
    Antworten: 4
    Letzter Beitrag: 08-01-2011, 15:47
  2. Fensteuerung per JS nur ein bisschen anders :)
    Von the_weird im Forum JavaScript
    Antworten: 10
    Letzter Beitrag: 05-11-2005, 21:35
  3. mit 9 Kindern völlig überfordert
    Von bine im Forum Smalltalk
    Antworten: 13
    Letzter Beitrag: 08-10-2005, 16:54
  4. ::ein bisschen leer hier...
    Von ::tim_toxxic im Forum Site-Check
    Antworten: 7
    Letzter Beitrag: 14-06-2000, 21:38

Stichworte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •