テーブルに既存のレコードを追加できないようにする

Question

ドロップダウンから項目を選択すると、その項目が既に追加されている場合にエラーが表示されるはずです。

<select id="dropdownUsers"></select> 
<table border="1" id="tableshow"> 
     <thead> 
      <tr> 
       <td>ID</td> 
       <td>Name</td> 
       <td>unit Price</td> 
       <td>qunatity</td> 
       <td>total</td> 
       <td>Actions</td> 
      </tr> 
     </thead> 
    <tbody id="tabledata"></tbody> 
    </table> 

AJAX呼び出しドロップダウンを結合する

   $.ajax({ 
        url: "/home/fillDropdown", 
        type: "Get", 
        success: function (data) { 

         for (var i = 0; i < data.listUsers.length; i++) { 
          var opt = new Option(data.listUsers[i].strFirstName, data.listUsers[i].iUserInfoId); 
          $('#dropdownUsers').append(opt); 

         } 

        } 

       }); 

AJAX呼び出しテーブルを結合する

  $('#buttonAllocateRoom1').on('click', function (e) { 

        $("#tableshow").show(); 

このテーブルからTDの行をフェッチすることの配列のリストが返されid

---

     $('#tableshow > tbody > tr ').each(function (index, td) { 
         arr = $(this).find('td'); 
         arrlist[index] = arr[0].innerHTML; 
         index++; 
        }); 

0初めて

---

     if (arrlist.length > 0) { 

         for (var k = 0; k <= arrlist.length - 1; k++) { 

       //Then the i had compared the array with dropdownlist 

          if (arrlist[k] !== $("#dropdownUsers").val()) { 
           var val = $("#dropdownUsers").val(); 
           $.ajax({ 
            dataType: 'json', 
            type: 'POST', 
            contentType: "application/Json; charset=utf-8", 
            url: '/Home/fillDropdownbyids', 
            data: JSON.stringify({ id: val }), 
            success: function (response) { 
             $("#id").append(response.user.iUserInfoId + " ") 
             var tr = ''; 


             tr += '<tr class="row"><td class="rowid' + val + '">' + response.user.iUserInfoId + '</td><td>' + response.user.strFirstName + '</td><td><input type="text" id="unittextbox' + val + '"></td><td><input type="text" id="quantextbox' + val + '" onfocusout="get(' + val + ')"></td><td><input type="text" id="totaltextbox' + val + '" ></td><td><input type="button" value="Delete" onclick="deleteRow(this)"></td></tr>'; 


             $('#tabledata').append(tr); 
            }, 
           }); 
          } 
          else { 
           alert("already exists") 
           return; 
          } 
         } 
        } 

***テーブルに項目を追加する****

     else if (arrlist.length == 0) 
        { 
         var val = $("#dropdownUsers").val(); 
         $.ajax({ 
          dataType: 'json', 
          type: 'POST', 
          contentType: "application/Json; charset=utf-8", 
          url: '/Home/fillDropdownbyids', 
          data: JSON.stringify({ id: val }), 
          success: function (response) { 
           $("#id").append(response.user.iUserInfoId + " ") 
           var tr = ''; 


           tr += '<tr class="row"><td class="rowid' + val + '">' + response.user.iUserInfoId + '</td><td>' + response.user.strFirstName + '</td><td><input type="text" id="unittextbox' + val + '"></td><td><input type="text" id="quantextbox' + val + '" onfocusout="get(' + val + ')"></td><td><input type="text" id="totaltextbox' + val + '" ></td><td><input type="button" value="Delete" onclick="deleteRow(this)"></td></tr>'; 


           $('#tabledata').append(tr); 
          }, 
         }); 

        } 
        }); 

Answer 1

$('#buttonAllocateRoom1').on('click', function (e) { 
     $("#tableshow").show(); 
     var val = $("#dropdownUsers").val(); 
     $.ajax({ 
      dataType: 'json', 
      type: 'POST', 
      contentType: "application/Json; charset=utf-8", 
      url: '/Home/fillDropdownbyids', 
      data: JSON.stringify({ id: val }), 
      success: function (response) { 

       var arr = []; 
       var arrlist = []; 
       var index = 0; 
       $('#tableshow > tbody > tr ').each(function (index, td) { 
        arr = $(this).find('td'); 
        arrlist[index] = arr[0].innerHTML; 

       }); 
       index++; 
       alert(arrlist) 

       if (arrlist.length == 0) { 
        var tr = ''; 
        tr += '<tr class="row"><td class="rowid' + val + '">' + response.user.iUserInfoId + '</td><td>' + response.user.strFirstName + '</td><td><input type="text" id="unittextbox' + val + '"></td><td><input type="text" id="quantextbox' + val + '" onfocusout="get(' + val + ')"></td><td><input type="text" id="totaltextbox' + val + '" ></td><td><input type="button" value="Delete" onclick="deleteRow(this)"></td></tr>'; 
        $('#tabledata').append(tr); 
       } 
       else { 
        if ($.inArray(val, arrlist) == -1) { 
         $("#id").append(response.user.iUserInfoId + " ") 
         var tr = ''; 
         tr += '<tr class="row"><td class="rowid' + val + '">' + response.user.iUserInfoId + '</td><td>' + response.user.strFirstName + '</td><td><input type="text" id="unittextbox' + val + '"></td><td><input type="text" id="quantextbox' + val + '" onfocusout="get(' + val + ')"></td><td><input type="text" id="totaltextbox' + val + '" ></td><td><input type="button" value="Delete" onclick="deleteRow(this)"></td></tr>'; 
         $('#tabledata').append(tr); 
        } 
        else { 
         alert("Alreadt Exits"); 
        } 
       } 
      } 


     }) 





     });