消息在数组jquery的文本框旁边

Question

我正在验证在数据库中输入的文本框中的值，并且想要显示正确或错误的图标正确的文本框。

这里我的html代码都

<tr> 
<td><input type="textbox" class="process-order serial" name="serialNumber" id="serialNumber"/> <span name="validsn" id="validsn"> 
</td> 
</tr> 
<tr> 
<td><input type="textbox" class="process-order serial" name="serialNumber" id="serialNumber"/> <span name="validsn" id="validsn"> 
</td> 
</tr> 
<tr> 
<td><input type="textbox" class="process-order serial" name="serialNumber" id="serialNumber"/> <span name="validsn" id="validsn"> 
</td> 
</tr> 

我验证的onblur当SERIALNUMBER字段中输入值，我会得到真或假，jQuery中我做的这样。

$.post("validateSN", {value:$(this).val()},function(data){ 
    $("#validsn").text(data); 
}); 

当我每次显示数据时，错误消息或成功消息只出现在第一个旁边。

更新： SerialNumber文本框是动态的，并且与文本框大小相同。

有人可以帮助我正确的方法来正确显示每个文本框旁边的错误/成功消息。

Answer 1

我按照Jigar Joshi建议和修改点点

的onblur

$(".serial").live("blur", function(){ 
//got the index of textbox where serial number is entered 
var index = $(".serial").index(this); 

$.ajax({ 
url:"validateSN", 
data: "value="+sn, 
success : function(data){ 
$("#validsn"+index).show(); 
    if(data=="true"){ 
    $("#validsn"+index).attr('src',"images/icons/valid_icon.png"); 
    } else if(data=="false"){ 
     $("#validsn"+index).attr("src", "images/icons/invalid_icon.png"); 
    } 
}); 

然后，它工作得很好。谢谢Jigar Joshi帮助我前进。

Answer 2

这是因为你添加的

<span name="validsn" id="validsn"> 

接近第一个输入文本（然后用相同的ID重复）

你应该做这样

<span name="validsn" id="validsn1"> 
<span name="validsn" id="validsn2"> 
<span name="validsn" id="validsn3"> 

，然后在Java脚本

var index = 1; 
    for (index = 1 ; index <= 3;index++){ $("#validsn"+index).text(data);}