当我从下拉列表中选择项目时,如果用户再次添加该项目,它将添加到表格中,它应显示已添加项目的错误。
<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);
},
});
}
});
答案 0 :(得分:0)
$('#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");
}
}
}
})
});