• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Eingabeüberprüfung einbauen

easy65

Neues Mitglied
Hallo, wiedermal.
Also ich habe meine vorherige Frage gelöst, aber dadurch sind neue Probleme entstanden.
Ich habe 4 Eingabefelder und einen Button "ADD"
Wenn ich auf ADD klicke, wird eine JavaScript Funktion ausgeführt, die alle EIngaben liest und in meine Tabelle einträgt. Ich will aber, dass z.B eine korrekte Email Adresse eingetragen wird, bevor alles in die Tabelle eingetragen wird. Hab da schon einiges probiert aber es ging nichts, ich glaube mein Code ist "komisch" aufgebaut. Könnt ihr mal reinschauen?


Code:
<button onclick="addRow()">Add</button>

To-Do:   
<button onclick="addRow()">Add</button>

<input type="text" name="To-Do" id="To-Do" /><br />
Email
<input type="email" name="email" id="email" /><br />


<table id="myTable">
  <tr>
    <th>To-Do</th>
    <th>Priorität</th>
   <th>Anzahl</th>
    <th>Erstellt am</th>
    <th>Gültig bis</th>
    <th>Email Adresse</th>

  </tr>
<tr>
    <td>Milch kaufen</td>
    <td>Mittel</td>
    <td>5</td>
    <td>18.11.2019</td>
    <td>18.11.2020</td>
    <td>[email protected]</td>
    <td><input type="button" value="Delete" onclick="deleteRow(this)"/></td>


<script>
function addRow() {


    var table = document.getElementById("myTable");
  
    var row= document.createElement("tr");
    console.log(row);
    var td1 = document.createElement("td");
    var td2 = document.createElement("td");
    var td3 = document.createElement("td");   
    var td4 = document.createElement("td");   
    var td5= document.createElement("td");
    var td6= document.createElement("td");
  
  


    td1.innerHTML = document.getElementById("To-Do").value;
    td2.innerHTML = document.getElementById("Priorität").value;
    td3.innerHTML  = document.getElementById("Anzahl").value;
    td4.innerHTML  = document.getElementById("bis").value;
    td5.innerHTML  = document.getElementById("bis").value;
    td6.innerHTML  = document.getElementById("email").value;
  

    row.appendChild(td1);
    row.appendChild(td2);
    row.appendChild(td3);
    row.appendChild(td4);
    row.appendChild(td5);
    row.appendChild(td6);

    table.children[0].appendChild(row);   
}
</script>
 
Werbung:
@easy65 Wenn Du ein Problem mit Deinem JavaScript-Code hast, richte Deine Frage bitte an das Fachforum.

Oder gehst Du etwa auch zum Bäcker, wenn's wieder an der Zeit ist, die Haare schneiden zu lassen? o_O

Das ist heute schon der zweite Thread, den ich Dir vom HTML-Forum hinterher tragen durfte, und wäre Dir dankbar, wenn's der Letze war - nicht nur für heute! :)
 
Werbung:
PS: Ich sehe gerade, dass es bei HTML5 auch einen input vom Typ "email" gibt.
Wäre aber in seinem Fall nicht zu empfehlen, da die Korrektheit des Input bei Absenden des dazugehörigen Formulars geschieht.
In diesem Fall wird aber Clientseitig eine Funktion aufgerufen, die auch funktioniert, wenn keine Email eingegeben wurde.
 
Siehe z.B. sowas: https://jsfiddle.net/Lecub/gc8khfun/ (ist ziemlich vereinfacht). Du kannst auch eine nicht gültige Email eintragen und trotzdem die Funktion starten, wobei der Hinweis auf das falsche Format des eingegebenen erst danach gezeigt wird, da dann das Formular abgeschickt wird.
 
Werbung:
Zurück
Oben