如何通过按钮从表中传递行id

时间:2013-05-02 23:46:37

标签: javascript jquery json

我有一个表我想在每行中添加一个按钮并在表单中编辑行。我需要将LineNumber传递给我的getjson请求。我怎样才能做到这一点?这是我的桌子和我的getjson。 (编辑)我刚注意到我要求LineNumber,但我真正想要的是推送按钮的ID'+ value.linenumber +'。

//table goes though a loop.
table_obj.append($('<tr><td>'+value.SLN+'</td><td  >'+value.Type+'</td><td     >
'+value.StopNumber+'</td><td>'+value.LoName+'</td><td >'+value.ReferenceNo+'</td>
<td class="hide" >'+value.TypeId+'</td><td class="hide" >'+value.LocationId+'</td>
<td class="hide" >'+value.lineNumber+'</td><td><button id='+value.lineNumber+'
onclick=edit()>Edit</button></td></tr>'));

//getjson
<script> function edit()
$.getJSON("editstops.php",{ LineNumber:$('#LineNumber').val() },stophandler)
var stophandler = function(data){
$("#SLNS").val(data[0].value.LoadNumber);
$("#Type").val(data[0].value.Type);
    $("#StopNumber").val(data[0].value.StopNumber);
$("#LoName").val(data[0].value.LoName);
$("#ReferenceNo").val(data[0].value.ReferenceNo);   
$("#TypeId").val(data[0].value.TypeId);
$("#LocationId").val(data[0].value.LocationId);
    $("#LineNumber").val(data[0].value.Linenumber);
};

</script>

1 个答案:

答案 0 :(得分:1)

在您的按钮标记中,您已将行号指定为ID属性。您可以轻松地将其作为参数传递给edit()函数:

<button id='+value.lineNumber+' onclick="edit('+value.lineNumber+')">Edit</button></td></tr>

然后你的编辑功能可以接受这个参数并使用它:

function edit(lineNumber) {
    $.getJSON("editstops.php",{ LineNumber: lineNumber }, stophandler);
}

请注意,如果您的按钮位于form标记内,则可能还需要在调用return false;后添加edit(),以防止其提交表单并刷新页面。

简单的工作示例:http://jsbin.com/okesom/2/edit

或者,您可以完全取消按钮标记中的onclick事件。完成循环并构建表后,将事件附加到所有按钮,如下所示:

$("button").click(function() {
    var lineNumber = $(this).attr('id');
    $.getJSON("editstops.php",{ LineNumber: lineNumber }, stophandler);
});

以下是第二个选项的快速示例:http://jsbin.com/ibokon/2/edit