不允许用户在表

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++;
                     });

                     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");
                    }
                }
            }


        })





        });