我正在验证在文本框中输入的数据库对数据库,并希望显示正确或错误的图标正确文本框。
这里我的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>
我在在serialNumber字段中输入值时验证onblur,我将得到true或false,在jquery中我这样做。
$.post("validateSN", {value:$(this).val()},function(data){
$("#validsn").text(data);
});
每当错误信息或成功消息仅出现在第一个旁边时,我显示数据。
更新:SerialNumber文本框是动态的,与文本框大小的跨度相同。
有人可以帮我正确地在每个文本框旁边显示错误/成功消息。
答案 0 :(得分:0)
这是因为你添加了
<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);}
答案 1 :(得分:0)
我已遵循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帮助我前进。