防止添加重复值html表

时间:2013-02-19 11:00:27

标签: javascript jquery

我有一个HTML表格,我不希望第二列的值在网格中重复。

这是我的jQuery:

$('#tb_cartTable tr td:nth-child(2)').each(function() {
    $ele=$(this).text();
if($ele==$productCode)
    {
        flag="x";
        return false;
    }
});

if($rowCounter>0 && flag=="x")
{
    alert("Duplicate");
}
else
{
    //...
}

1 个答案:

答案 0 :(得分:0)

一种方法是将单元格的文本“映射”为以文本为键的JavaScript复杂数组,然后将键的数量与单元格数量进行比较。如果单元格多于键,则表示存在具有相同文本的单元格。

此代码:

var allCells = $('#tb_cartTable tr td:nth-child(2)');
var textMapping = {};
allCells.each(function() {
    textMapping[$(this).text()] = true;
});

var count = 0;
for (var text in textMapping)
    count++;

if (count !== allCells.length) {
    alert("found duplicate values");
} else {
    alert("no duplicates found");
}

Live test case

注意以上是区分大小写的:如果有一个单元格带有“hello”而单元格带有“Hello”,那么这些将被认为是不同的,它会认为没有重复。如果情况无关紧要修改是将线路更改为:

的简单情况
textMapping[$(this).text().toLowerCase()] = true;

Updated test case忽略大小写。

在您的特定情况下,您可以将所有添加的值存储在plain数组中,然后使用jQuery inArray()方法检查数组:

var $addedProductCodes = [];
$("#button_addItem").click(function(event)
{
    $("span.errorText").remove();
    $(".errorField").addClass("notErrorField");

       //Change background color of textbox to normal
       $("#frmRegisterForm :input[type='text']").attr('class','notErrorField');
    $hasError = false;
    $ele = $(event.target);
    if($ele.is("input[type=button]"))
    {    
        $td_productCode1=$("#td_productCode1").val();
        var index = $.inArray($td_productCode1, $addedProductCodes);
        if (index >= 0) {
            alert("You already added this product code in line #" + (index + 1));
        } else {
            $text_productDescription= $("#text_productDescription").val();
            $text_basicDealerPrice = $("#text_basicDealerPrice").val();
            $('#table_viewContent').append("<tr><td>"+$text_productDescription+"</td><td>"+$td_productCode1+"</td><td><td>"+$text_basicDealerPrice+"</td><td><input type='button'  name='deleteRow' id='btn_deleteRow' value='Delete' id='deleteItem' class='deleteItem button-red'></td></tr>");        
            $addedProductCodes.push($td_productCode1);
        }
    }
});

Updated fiddle添加相同的产品代码会发出警报但不会插入。