php - 如何使用 Jquery 从特定行获取输入文本值

Question

大家好，这是我当前构建的页面:

当点击提交时，我获取当前行中的文本值并通过 jquery ajax 提交。对我来说没有问题，但是当我在网络中的另一台电脑上测试时，会出现错误消息(通过 json)。年假和病假等未定义。

我测试的其他电脑中的错误示例:

这是我使用的代码:

function popUpReasonApplyLeave(){
$('a.submit').bind('click', function(e) {
    e.preventDefault();
    //get the tr row id you have clicked
    var trid =  $(this).closest('tr').attr('id');       
    $('#pop_up_apply_leaveReason').show();
    submitReason(trid);
    //when submit call the ajax function here
});

}

ajax函数中的数据

data : {
    idstaff : trid,
    annualleave : $('#'+trid+' input#annualleave').val(),
    sickleave : $('#'+trid+' input#sickleave').val(),
    reason : $('#reason').val(),
}

html表格代码

<?php foreach($list as $value) {?>

    <tr id='staffID_<?php echo $value['IDSTAFFTABLE']; ?>'>
        <td><?php echo $value['FIRSTNAME']; ?> <?php echo $value['LASTNAME']; ?></td>
        <td><?php echo $value['POSITIONNAME']; ?><input type="hidden" id="idstaff" name="idstaff" value="<?php echo $value['IDSTAFFTABLE']; ?>" /></td>
        <td><input type="text" name="annualleave" class="annualleave" value="<?php echo $value['ANNUALLEAVEBALANCE']; ?>" id="annualleave"/></td>
        <td><input type="text" name="sickleave" class="sickleave" value="<?php echo $value['SICKLEAVEBALANCE']; ?>" id="sickleave"/></td>
        <td><a href="#"class="submit">Submit</a></td>            
    </tr>

    <?php } ?>

ajax代码

$.ajax({
beforeSend : function(){ 
$("#submitreason").unbind('click');
},
type: "POST",
async : false,
url: "http://192.168.1.5:83/staging/eleave/application/controller/controller.php?action=doupdateleavecontroller",
dataType: 'json',
data : {
    idstaff : trid,
    annualleave : $('#'+trid+' input#annualleave').val(),
    sickleave : $('#'+trid+' input#sickleave').val(),
    reason : $('#reason').val(),
},
success : function(data) {
    var encoded = $.toJSON(data);             
    var result = $.evalJSON(encoded).msg;
    $('#pop_up_apply_leaveReason').hide();
    alert(result);
    location.reload();

},
error : function(XMLHttpRequest, textStatus, errorThrown) {
    alert(XMLHttpRequest + " : " + textStatus + " : " + errorThrown);
}
}); 

Answer 1

检查 ID 的“annualleave”或“sickleave”是否确实唯一。 IE 无法像 Firefox/Chrome 一样处理重复的 ID。

编辑:这行代码意味着它不是唯一的:

$('#'+trid+' input#annualleave').val()

表的每个行上都有一个 id anualleave 的输入。即使 jQuery 可以很好地处理它并选择正确的输入，您也只能使用 id 一次。 IE 在这种情况下要严格得多，并且会忽略重复的 ID。

我建议改用类，结果是:

$('#'+trid+' input.annualleave').val()