Meine Codepens ,My Codepens ,Array in Form und Inputs und Array auslesen

array_in_form_and_array_auslesen.php

Quell Code

<html>
<style>

</style>
  <head>
  <meta charset=utf-8 />
    <title></title>
    <meta charset="Windows-1252" />
    <meta http-equiv="x-ua-compatible" content="IE=10" />
    <HTA:APPLICATION ID="htaelem"
                     applicationName="myApp"
                     border="thick"
                     borderStyle="complex"
                     caption="yes"
                     contextMenu="yes"
                     icon=""
                     innerBorder="yes"
                     maximizeButton="yes"
                     minimizeButton="yes"
                     scroll="yes"
                     scrollFlat="no"
                     selection="yes"
                     showInTaskBar="yes"
                     singleInstance="no"
                     sysMenu="yes"
                     version="1.0"
                     windowState="normal"
                     >
                    <SCRIPT LANGUAGE="javascript">

                        function Window_onLoad(){ 
                        window.resizeTo(1366,768);
                    }
                    window.onload=Window_onLoad;
                    
                    
                    
                    
                    </SCRIPT>
                    

                    
    </head>
<body>
    <select id="test" Name="egal" onchange="myFunction()">
        
        <option value="db1.json">Speicher1</option>
        <option value="db2.json">Speicher2</option>
        
        
    </select>
    


<button type="button" onclick="buttonShow()">Eingabe/Edit</button>
<button type="button" oclick="buttonHide()">Schließen</button>
<button type="button" onclick="reset()"   >Reset</button>
<center>


<h3>Eingabe:</h3>
 
<div id="infoBox">
<form onsubmit="return Hinzufuegen1()">
<table border="1" cellspacing=0 cellpadding="50" style="border-color: grey; background-color: lightgrey;">
<tbody>
<tr>
<td>
<table>
<tbody>
   <tr>
<td></td>
<td></td>
</tr>
<tr>
<td>&nbsp;Wert1:</td>
<td><input id="w1" type="text" /></td>
</tr>
<tr>
<td>&nbsp;Wert2:</td>
<td><input id="w2" type="text" /></td>
</tr>
<tr>
<td>&nbsp;Wert3:</td>
<td><input id="w3" type="text" /></td>
</tr>
<tr>
<td>&nbsp;Wert4:</td>
<td><input id="w4" type="text" /></td>
</tr>
<tr>
<td>&nbsp;Wert5:</td>
<td><input id="w5" type="text" /></td>
</tr>
<tr>
<td>&nbsp;Wert6:</td>
<td><input id="w6" type="text" /></td>
</tr>
  <tr>
<td></td>
<td><input type="button" value="Speichern" onclick="Hinzufuegen1()"></td>
</tr>
</form>


<form onsubmit="return Hinzufuegen2()">
</tbody>
</table>
</td>
<td>
<table>
<tbody>
<tr>
<td>&nbsp;Wert1:</td>
<td><select id="e1">
<option>Bitte ausw&auml;hlen</option>
</select></td>
</tr>
<tr>
<td>&nbsp;Wert1:</td>
<td><input id="e0" type="text" value="" /></td>
</tr>
<tr>
<td>&nbsp;Wert2:</td>
<td><input id="e2" type="text" value="" /></td>
</tr>
<tr>
<td>&nbsp;Wert3:</td>
<td><input id="e3" type="text" value="" /></td>
</tr>
<tr>
<td>&nbsp;Wert4:</td>
<td><input id="e4" type="text" value="" /></td>
</tr>
<tr>
<td>&nbsp;Wert5:</td>
<td><input id="e5" type="text" value="" /></td>
</tr>
<tr>
<td>&nbsp;Wert6:</td>
<td><input id="e6" type="text" value="" /></td>
</tr>
   <tr>
<td></td>
<td> <input style="height: 25px; width: 85px;" type="button" value="Edit" onclick="Hinzufuegen2()" >
    <input type="hidden" size="20" value="" id="editid" disabled></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
   </form>

</br>


Wert2:<input type="radio" id="gender0" Name="gender" value="1" checked>
Wert3:<input type="radio" id="gender1" Name="gender" value="2">
Wert4:<input type="radio" id="gender1" Name="gender" value="3">
Wert5:<input type="radio" id="gender1" Name="gender" value="4">
Wert6:<input type="radio" id="gender1" Name="gender" value="5">
</div>
</br>
    
    <form>
<TABLE id="thetable" border=1 cellspacing=0 cellpadding=50>

    </form>
    
<script type="text/javascript">









var info = document.getElementById("infoBox");
info.style.display = "none"; // Box ausblenden
info.style.position = " ";
info.style.zIndex = 999;
info.style.marginTop = "10px";
 
function buttonShow() {
  // Infobox anzeigen
  info.style.display = "";
}
function buttonHide() {
  // Infobox wieder ausblenden
  info.style.display = "none";
 
  location.reload();
 
}

function myFunction() {

 var fileName= document.getElementById("test").value;


    var ad = document.getElementById("e1");
    var sel1Obj = document.getElementById("e1");
    sel1Obj.addEventListener("change", function () {
        var ar1r = this.value.split("#");
        
        
        document.getElementById("e0").value = document.getElementById("e1").options[document.getElementById("e1").selectedIndex].text;
        document.getElementById("e2").value = ar1r[0];
        document.getElementById("e3").value = ar1r[1];
        document.getElementById("e4").value = ar1r[2];
        document.getElementById("e5").value = ar1r[3];
        document.getElementById("e6").value = ar1r[4];
        document.getElementById("editid").value = (document.getElementById("e1").selectedIndex) - 1;
    });
        
        var file = (new ActiveXObject("Scripting.FileSystemObject")).OpenTextFile(fileName);
        while (!file.AtEndOfStream) {
            var txtAr1r = file.ReadLine().split("#"), assy1Arr = txtAr1r.splice(0,1);
            assy1Arr.push(txtAr1r.join("#"));
            sel1Obj[sel1Obj.options.length] = new Option(assy1Arr[0], assy1Arr[1]);
        }
      
    file.Close();
    file = null;



    function Hinzufuegen1() {
        //hier brauch ich dir nix erzählen, hast du ja selbst gemacht; ich habe es nur etwas eingereiht und die leerzeichen vor und hinter dem - Trennzeichen entfernt; grundlegend ist sowas immer mist ja du das schlecht zusammensetzen kannst
        //um es besser zu sehen stelle ich das leerzeichen anders da zb. als #
        //Beispiel: W1#-#W2#-#W3#-#W4
        //wenn es aber fürs array aneinander gereiht wird dann: W1#-#W2#-#W3#-#W4#-##-#W1#-#W2#-#W3#-#W4 du siehst den fehler in der mitte?
        var fso1 = new ActiveXObject("Scripting.FileSystemObject");

        if(document.getElementById('w1').value == ""){
            window.alert("Bitte geben Sie den Text an" + ", der gespeichert werden soll.");
            return false;
        }else{

            var s1 = fso1.OpenTextFile(fileName, 8, true, 0);

            s1.Write(document.getElementById('w1').value+"#"+document.getElementById('w2').value+"#"+document.getElementById('w3').value+"#"+document.getElementById('w4').value+"#"+document.getElementById('w5').value+"#"+document.getElementById('w6').value+"\n");

            document.getElementById('w1').value = "";
            document.getElementById('w2').value = "";
            document.getElementById('w3').value = "";
            document.getElementById('w4').value = "";
            document.getElementById('w5').value = "";
            document.getElementById('w6').value = "";
            location.reload();
            s1.Close();
        }
    }
function reset(){
        
        document.getElementById('w1').value = "";
        document.getElementById('w2').value = "";
        document.getElementById('w3').value = "";
        document.getElementById('w4').value = "";
        document.getElementById('w5').value = "";
        document.getElementById('w6').value = "";
        
            document.getElementById('e1').value = "";
            document.getElementById('e2').value = "";
            document.getElementById('e3').value = "";
            document.getElementById('e4').value = "";
            document.getElementById('e5').value = "";
            document.getElementById('e6').value = "";
   location.reload();
    }
    function Hinzufuegen2() {
        //initialisiere Objekt
        var fso1 = new ActiveXObject("Scripting.FileSystemObject");

        //prüfe ob etwas im selectfeld ausgewählt wurde
        if(document.getElementById('e1').value == "Bitte auswählen"){
            //nein, gebe Fehlermeldung
            window.alert("Zum Editieren bitte einen Wert auswählen");
            return false;
        }else{
            //ja, dann weiter

            //setze file in eine Variable
            var file = (new ActiveXObject("Scripting.FileSystemObject")).OpenTextFile(fileName);
            //erstelle Array für vorhandene Daten
            var data = new Array();
                
            //.json Durchlauf
            while (!file.AtEndOfStream) {
                //splitte je zeile
                var eineline = file.ReadLine().split("\n");
                //wandle diese in ein String (das muss weil ich sonst nur ein Array habe das ich nichts erneut splitten kann)
                var eineline = eineline.toString();
                //splitte dann das erstellte array
                var splitline = eineline.split("#");
                //fülle die daten zurück ins array
                
                data.push([splitline[0], splitline[1], splitline[2], splitline[3], splitline[4],splitline[5]]);
                
            }
            //erstelle neues Array wo die änderung vorgenommen wird
            var datanew = new Array();

            //durchlauf des Arrays mit den Daten
            for(i=0; i<data.length; i++){

                //prüfe: wurde die array index id geändert? bzw ist das die geänderte
                if(document.getElementById("editid").value == i){

                    //ja, dann hole die daten aus dem selectfeld und schreibe es in e
                    var e = document.getElementById("e1");
                    //hole den text aus der var e und daraus den text (deshalb weil es kein value im select definiert ist)
                    var selauswahl = e.options[e.selectedIndex].text;
                    
                    //schreibe die geänderten daten in das neue Array
                    
                    datanew.push([document.getElementById("e0").value, document.getElementById("e2").value, document.getElementById("e3").value, document.getElementById("e4").value, document.getElementById("e5").value,document.getElementById("e6").value]);
                }else{

                    //nein, dann schreibe die daten unverändert in das neue array
                    datanew.push([data[i][0], data[i][1], data[i][2], data[i][3], data[i][4],data[i][5]]);
                    
                }

            }

 // neues Array sortieren

 

            datanew.sort(function(a, b) {
              var idx = document.querySelector('input[Name = "gender"]:checked').value;; 
                return parseInt(b[idx]) - parseInt(a[idx]);
                
            });





            //nun öffne das dokument ( die 2 das ist der iomode der gibt an ob das file vorher geleert werden soll oder die zeilen angehangen usw.)
            //hier eine auflistung der iomode:
            //1=ForReading - Open a file for reading. You cannot write to this file.
            //2=ForWriting - Open a file for writing.
            //8=ForAppending - Open a file and write to the end of the file.

            //Du siehst die function OpenTextFile() bietet schon einen parameter der die datei leert vorm neubeschreiben, ist also für solche fälle gedacht.
            var s1 = fso1.OpenTextFile(fileName, 2, true, 0);

            //durchlaufe das neue array mit den geänderten daten und schreibe es zurück in die bereits geleerte .jsonfile
            for(i=0; i<datanew.length; i++) {
            if (datanew[i][0] == "" && datanew[i][1] == "" && datanew[i][2] == "" && datanew[i][3] == "" && datanew[i][4] == "" && datanew[i][5] == ""){}else{
                s1.Write(datanew[i][0] +"#"+ datanew[i][1] +"#"+ datanew[i][2] +"#"+ datanew[i][3] +"#"+ datanew[i][4] +"#"+ datanew[i][5] +"\n");
                
                
                 }
            }

            //felder leeren
            document.getElementById('e1').value = "";
            document.getElementById('e2').value = "";
            document.getElementById('e3').value = "";
            document.getElementById('e4').value = "";
            document.getElementById('e5').value = "";
            document.getElementById('e6').value = "";

            //reload und file schließen
            location.reload();
            s1.Close();
        }
    }
    
    

    
    

        //setze file in eine Variable
        var file = (new ActiveXObject("Scripting.FileSystemObject")).OpenTextFile(fileName);
        //erstelle Array für vorhandene Daten
        
    
        
         var data2 = new Array ();
        
                document.getElementById("thetable").innerHTML = "<th>Wert1</th><th>Werte2</th><th>Wert3</th><th>Wert4</th><th>Wert5</th><th>Wert6</th>";
        
        //Textfile Durchlauf
        while (!file.AtEndOfStream) {
            //splitte je zeile
            var eineline2 = file.ReadLine().split("\n");
            //wandle diese in ein String (das muss weil ich sonst nur ein Array habe das ich nichts erneut splitten kann)
            var eineline2 = eineline2.toString();
            //splitte dann das erstellte array
            var splitline2 = eineline2.split("#");
            //fülle die daten zurück ins array
            data2.push([splitline2[0], splitline2[1], splitline2[2], splitline2[3], splitline2[4], splitline2[5]]);
            if (splitline2[0] == "" && splitline2[1] == "" && splitline2[2] == "" && splitline2[3] == "" && splitline2[4] == ""&& splitline2[5] == ""){}else{
            document.getElementById("thetable").innerHTML += "<TR><TD>" + splitline2[0] + "</TD><TD>" + splitline2[1] + "</TD><TD>" + splitline2[2] + "</TD><TD>" + splitline2[3] + "</TD><TD>" + splitline2[4] + "</TD><TD>"+ splitline2[5] + "</TD></TR>";
            
            }
            
        }
    
}
        
</script>


      
      

  </body>
 
</html>