通过单元格的值序用ajax后更新表 [英] passing cell value inorder to update table using ajax post
问题描述
工作与jQuery在最近两天IAM试图让这是需要通过调用通过ajax.i一个servlet来执行更新单元格值已经使用了双击事件，以取代文本框编辑值单元格，文本框失去焦点值被传递给servlet.i需要通过编辑的值连同一个ID号码用于更新table.now我需要得到的值的行的编号，用户的编辑。
我试图让该值，但只有第一行得到更新，因为我能拿到第一row.how只有ID值，以获得其他行的值，因此用户可以更新所有行。
＆LT;脚本＆GT;
$（函数（）{
$（'。表小区'）。双击自动（功能（）{
//如果（$（本）.attr（'编辑'）== 0）
// {
//只触发此当电池是不是在编辑模式
$（本）.attr（'编辑'，1）;
//显示输入
变种输入= $（'＆LT;输入类型=文字值=+ $（本）。html的（）+'＆GT;'）;
$（本）。html的（''）;
$（本）.append（输入）;
//绑定模糊事件输入
input.blur（函数（）{
从输入//更新值表单元格
VAR值= $（本）.VAL（）;
//警报（值）;
$（本）.parent（）文本（值）;
$（本）.parent（）ATTR（'编辑'，0）。
//这将只得到第一个值的ID，不管我编辑的列
VAR FID =的document.getElementById（文件名）的textContent。
//警报（FID）;
//这个会遍历
$（'＃表）。就绪（函数（）{
$（本）.find（'文件名'）。每个（函数（）{
警报（$（本）。html的（））;
}）
}）
//将数据发送到服务器进行更新
$阿贾克斯（{
网址：'更新'，
数据：{文本1：值，文件名1：FID}，
键入：POST，
数据类型：JSON，
错误：功能（数据）{
//警报（'错误'）
}，
成功：功能（数据）{
//警报（更新！）
}
}）;
}）;
//}
}）;
}）;
＆LT; / SCRIPT＆GT;
＆LT;表格边框=1ID =表＆GT;
百分位＆GT; S.NO＆LT; /第i个
百分位＆GT;简介＆LT; /第i个
＆LT;第i个文件名＆LT; /第i个
百分位＆GT;分类和LT; /第i个
＆LT;第i个部门和LT; /第i个
百分位＆GT;删除＆LT; /第i个
百分位＆gt;编辑＆LT; /第i个
c为C：的forEach项目=$ {fileDetails}VAR =项varStatus =计数器＆GT;
＆其中; TR＆GT;
＆LT; TD＆GT; $ {counter.count}＆LT; / TD＆GT;
＆LT; TD onfocus此=JavaScript的：双击（本）; ＆GT; $ {item.filedesc}＆LT; / TD＆GT; //编辑的行
＆LT; TD＆GT;＆LT; A HREF =？下载名称= $ {item.filepath}ID =变化与GT; $ {item.filenaame}＆LT; / A＆GT;＆LT; / TD＆GT;
＆LT; TD＆GT; $ {item.category}＆LT; / TD＆GT;
＆LT; TD＆GT; $ {item.sector}＆LT; / TD＆GT;
＆LT; TD隐藏=真ID =文件名级=文件名指数=1＆GT; $ {item.id}＆LT; / TD＆GT;从数据库表// ID值
＆LT; TD＆GT; ＆LT;输入类型=提交的onclick =filedelete（'$ {item.id}，$ {item.sector}'）值=删除＆GT; ＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆LT; / C：的forEach＆GT;
＆LT;输入类型=隐藏名称=删除ID =删除＆GT;
＆LT;输入类型=隐藏名称=NUMID =NUM＆GT;
＆LT;输入类型=隐藏名称=教派ID =教派＆GT;
＆LT; /表＆gt;
您可以连接code的行例如像数量：
＆LT; TR指数=counter.index＆GT;
...并在适当的地方，比弄个它的jQuery
行= $（本）.parent（）。ATTR（指数）
working with jquery for the past 2 days iam trying to get a cell value which is needed to perform an update by calling a servlet through ajax.i have used a double click event to replace the cell with textbox for editing values,when the textbox loses focus the values are passed to the servlet.i need to pass the edited value along with a ID number for updating the table.now i need to get the id value of the row which the user edits.
i tried to get the values but only the first row is getting updated because i can get only the id values of the first row.how to get the values of the other rows so the user can update all the rows.
<script>
$(function(){
$('.table-cell').dblclick(function(){
// if ($(this).attr('editing') == '0')
// {
// only trigger this when the cell is not in edit mode
$(this).attr('editing',1);
// show the input
var input = $('<input type="text" value="'+$(this).html()+'">');
$(this).html('');
$(this).append(input);
// bind blur event to input
input.blur(function(){
// update value from input to the table cell
var value = $(this).val();
// alert(value);
$(this).parent().text(value);
$(this).parent().attr('editing',0);
//this will get only the first id value,no matter which column i edit
var fid= document.getElementById("filename").textContent;
// alert(fid);
//this will iterate
$('#table').ready(function() {
$(this).find('.filename').each( function() {
alert($(this).html());
})
})
// send the data to the server for update
$.ajax({
url: 'update',
data: {text1:value,filename1:fid},
type:"POST",
dataType:"json",
error:function(data){
// alert('error')
},
success: function(data) {
//alert('updated!')
}
});
});
// }
});
});
</script>
<table border="1" id="table">
<th>S.NO</th>
<th>Description</th>
<th>File Name</th>
<th>Category</th>
<th>Sector</th>
<th>Delete</th>
<th>Edit</th>
<c:forEach items="${fileDetails}" var="item" varStatus="counter">
<tr>
<td>${counter.count}</td>
<td onDblclick="javascript:doubleclick(this);" >${item.filedesc}</td> //editable row
<td><a href="download?name=${item.filepath}" id="changes">${item.filenaame}</a></td>
<td>${item.category}</td>
<td>${item.sector}</td>
<td hidden="true" id="filename" class="filename" index="1" >${item.id}</td> //id values from db table
<td> <input type="submit" onclick="filedelete('${item.id}','${item.sector}')" value="Delete"> </td>
</tr>
</c:forEach>
<input type="hidden" name="delete" id="delete" >
<input type="hidden" name="num" id="num">
<input type="hidden" name="sect" id="sect">
</table>
You can encode the number of the row for example like that:
<tr index="counter.index">
... and than get hold of it by jQuery in the appropriate place
row=$(this).parent().attr("index")
这篇关于通过单元格的值序用ajax后更新表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
