jQuery的岗位 - 更新DB - 多行 [英] jquery post - update db - multiple rows
问题描述
我不知道,如果我想要做的是简单的或没有,但在这里它是:
I'm not sure if what I'm trying to do is simple or not but here it is:
我有一个表中的行数据。最后3场是文本字段需要用户输入。每一行都有自己的更新按钮。
I have rows of data in a table. The last 3 fields are text fields that take user input. Each row has it's own UPDATE button.
我用下面的code尝试做一个jQuery 阿贾克斯
的文章,但我看到了我的问题 - 我分配的ID给我输入字段,你只能每页有一个ID声明,所以我敢肯定,这是一个问题。
I'm using the following code to try and do a jQuery .ajax
post but I'm seeing my issue - I'm assigning IDs to my input fields and you can only have one ID declared per page so I'm sure that's one issue.
我试图让这个当你点击更新按钮,它通过在输入框和对于ROWID的隐藏的输入字段从该行的变量,并调用 .PHP
文件更新数据库。
I'm trying to make it so that when you click the UPDATE button, it passes the variables from that row in the INPUT boxes and the hidden INPUT field for the rowID, and calls a .php
file that updates the DB.
$(function() {
$(".submit").click(function() {
var status = $("#status").val();
var ly = $("#ly").val();
var rt = $("#rt").val();
var offerout = $("#offerout").val();
var lineid = $("#lineid").val();
var dataString = 'status='+ status + '&ly=' + ly + '&rt=' + rt + '&offerout=' + offerout + '&lineid=' + lineid;
$.ajax({
type: "POST",
url: "post/updatedata.php",
data: dataString,
success: function(){
$('.success').fadeIn(200).show();
$('.error').fadeOut(200).hide();
}
});
return false;
});
});
和对我的表格行(每行是相同的,但使用不同的隐藏标识变量):
and on line of my form (each line is the same but with a different hidden ID variable):
<form method="POST" name="form">
<td>This one</td><td>Los Angeles</td>
<td>CA</td><td>94591</td>
<td>220000</td>
<td>20000</td><td>24500</td>
<td>-5500</td><td>12</td>
<td>0</td><td>0.167</td><td>4</td>
<td>1</td><td>1898</td>
<td></td><td>1</td><td>211335190</td>
<td><input size="6" type="text" id="status" name="status"></td>
<td><input size="6" type="text" id="ly" name="ly"></td>
<td><input size="6" type="text" id="rt" name="rt"></td>
<td><select id="offerout" name="offerout"><option value="No">No</option><option value="Yes">Yes</option></select></td>
<input type="hidden" name="lineid" id="lineid" value="97">
<td><input type="submit" class="submit" value="Update"></td>
</form>
在此先感谢,已经工作了几天就这个!
Thanks in advance, been working for days on this!
推荐答案
我删除隐藏字段,并分配数据库ID更新按钮,按钮点击获取ID和corespondent数据。
I remove hidden field and assign database id to update button as button will click get that id and corespondent data.
<table width="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<form method="POST" name="form">
<td>CA</td><td>94591</td>
<td>220000</td>
<td>20000</td><td>24500</td>
<td>-5500</td><td>12</td>
<td>0</td><td>0.167</td><td>4</td>
<td>1</td><td>1898</td>
<td></td><td>1</td><td>211335190</td>
<td><input size="6" type="text" id="status_97" name="status"></td>
<td><input size="6" type="text" id="ly_97" name="ly"></td>
<td><input size="6" type="text" id="rt_97" name="rt"></td>
<td><select name="offerout" id="offerout_97"><option value="No">No</option><option value="Yes">Yes</option></select></td>
<td><input type="submit" class="submit" value="Update" name="97"></td>
</form>
</tr>
<tr>
<form method="POST" name="form">
<td>CA</td><td>94591</td>
<td>220000</td>
<td>20000</td><td>24500</td>
<td>-5500</td><td>12</td>
<td>0</td><td>0.167</td><td>4</td>
<td>1</td><td>1898</td>
<td></td><td>1</td><td>211335190</td>
<td><input size="6" type="text" id="status_96" name="status"></td>
<td><input size="6" type="text" id="ly_96" name="ly"></td>
<td><input size="6" type="text" id="rt_96" name="rt"></td>
<td><select name="offerout" id="offerout_96"><option value="No">No</option><option value="Yes">Yes</option></select></td>
<input type="hidden" name="lineid" id="lineid_96" value="96">
<td><input type="submit" class="submit" value="Update" name="96"></td>
</form>
</tr>
</table>
Java脚本code
java script code
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
$(function() {
$(".submit").click(function() {
var rowToUpdate = $(this).attr('name');
var status = $("#status_"+rowToUpdate).val();
var ly = $("#ly_"+rowToUpdate).val();
var rt = $("#rt_"+rowToUpdate).val();
var offerout = $("#offerout_"+rowToUpdate).val();
var dataString = 'status='+ status + '&ly=' + ly + '&rt=' + rt + '&offerout=' + offerout + '&rowToUpdate='+ rowToUpdate;
$.ajax({
type: "POST",
url: "post/updatedata.php",
data: dataString,
success: function(){
$('.success').fadeIn(200).show();
$('.error').fadeOut(200).hide();
}
});
return false;
});
});
</script>
我希望这会帮助你。
I hope this will help you..
这篇关于jQuery的岗位 - 更新DB - 多行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!