重複したIDを防ぐためのユーザー入力の検証

Question

ユーザーがユーザーID、名、姓を入力してボタンをクリックするたびに、新しい「学生」オブジェクトを作成しようとしています。 これまでのところ、私はそれを作ったと思いますが、同じIDを持つ複数の生徒を追加できないようにしようとしています。私は2つの異なる変数を使ってループすることが潜在的重複を分離する最良の方法かもしれないと思ったが、実際に重複がないときに私の警告メッセージが表示される唯一の時間です。誰もがこれで正しい方向に私をプッシュできますか？

HERESに私のコード：

<form> 
ID Number:<br> 
<input type="text" id="idNumber"> 
<br> 
First name:<br> 
<input type="text" name="firstName" id="fName"> 
<br> 
Last name:<br> 
<input type="text" name="lastName" id="lName"> 
</form> 
<br> 
<button type ="submit" onclick="myFunction(list)">Submit</button> 
<div id = "container"> 
<ul id="list"></ul> 
</div> 

<script> 
function myFunction(list){ 

    var ids =[]; 
    var student = new Object(); 
    student.idNo = document.getElementById("idNumber").value; 

    student.firstName = document.getElementById("fName").value; 
    student.lastName = document.getElementById("lName").value; 

    for(var i = 0; i < 10; i++){ 
     for(var j = 1; j < 10 ; i++){ 
     ids.push(student.idNo); 
     if(ids[i] == ids[j]){ 
     alert("Id already exists"); 
     } 
     } 
    } 

    var text = " "+student.idNo+" "+student.firstName+" "+student.lastName; 

    var li = document.createElement("li"); 
    li.addEventListener("mouseover", mouseOver, false); 
    //li.addEventListener("click", mouseClick, false); 
    var node = document.createTextNode(text); 
    li.appendChild(node); 
    document.getElementById("list").appendChild(li); 
} 


</script> 

Answer 1

ここでは、作業のスニペットです。それはあなたの関数内

var ids = []; 
 

 
    function myFunction(list) { 
 
    var student = new Object(); 
 
    student.idNo = document.getElementById("idNumber").value; 
 
    student.firstName = document.getElementById("fName").value; 
 
    student.lastName = document.getElementById("lName").value; 
 

 
    if (ids.indexOf(student.idNo) == -1) { 
 
     
 
     ids.push(student.idNo); 
 
     var text = " " + student.idNo + " " + student.firstName + " " + student.lastName; 
 
     var li = document.createElement("li"); 
 
     var node = document.createTextNode(text); 
 
     li.appendChild(node); 
 
     document.getElementById("list").appendChild(li); 
 
     
 
    } else { 
 
     
 
     alert("Duplicated ID"); 
 
     
 
    } 
 

 

 
    }

<form> 
 
    ID Number: 
 
    <br> 
 
    <input type="text" id="idNumber"> 
 
    <br>First name: 
 
    <br> 
 
    <input type="text" name="firstName" id="fName"> 
 
    <br>Last name: 
 
    <br> 
 
    <input type="text" name="lastName" id="lName"> 
 
</form> 
 
<br> 
 
<button type="submit" onclick="myFunction(list)">Submit</button> 
 
<div id="container"> 
 
    <ul id="list"></ul> 
 
</div>