我有一个字段表,该表使用jQuery的可排序插件进行拖动排序,然后通过AJAX启动PHP脚本,以在单击提交按钮后保存更改。然而,它实际上只是平均每隔一段时间才起作用。每隔一段时间,我就会背靠背成功跑两次,但这是非常罕见的。
这是我的HTML,动态生成:
<div class="foldertable">
<table class="data" id="sortable">
<tr class="odd" id="field_21">
<td class="handle"><a href="/admin/database/customfields/edit?cfid=21">Occupant Name</a></td>
</tr>
<tr class="even" id="field_22">
<td class="handle"><a href="/admin/database/customfields/edit?cfid=22">DBA</a></td>
</tr>
<tr class="odd" id="field_23">
<td class="handle"><a href="/admin/database/customfields/edit?cfid=23">Tenant Contact</a></td>
</tr>
</table>
<a href="" id="button" class="textbutton">Update Order</a>
</div>
还有我的jQuery:
<script type="text/javascript">
var fixHelper = function(e, ui) {
ui.children().each(function() {
$(this).width($(this).width());
});
return ui;
};
$(document).ready(function(){
$("#sortable tbody").sortable({
helper: fixHelper,
opacity: 0.6,
update: function(){
$('#savemessage').html('<p>Click <em>update order</em> to save</p>');
$('#button').show();
}
});
$('#button').click(function(event){
var order = $("#sortable tbody").sortable("serialize");
order += "&crudtype=order";
$('#savemessage').html('<p>Saving changes...</p>');
$.post("/admin/database/customfields/crud",order,function(theResponse){
$('#savemessage').html(theResponse);
});
});
});
</script>
以及由此产生的PHP页面/admin/database/customfields/crud
$fields = $_POST['field'];
$counter = 1;
foreach ($fields as $field) {
$params = array(array('value' => $counter, 'type' => 'i'), array('value' => $field, 'type' => 'i'));
db_query('UPDATE customfields SET sortorder = ? WHERE cfid = ?', $params, false);
$counter++;
}
print '<p>Changes saved</p>';
exit(); // Exit necessary for AJAX call
break; // End reorder
我基于这个网站,http://www.simonbattersby.com/blog/drag-and-drop-with-jquery-ui/,而且它确实有效——只是不是每次都有效。有人能告诉我我做错了什么吗?提前感谢!
我接受了您的代码并重新创建了您的模块,它每次都运行良好。基于此,我唯一可以得出的结论是,PHP页面可能是从缓存中提供的?你能检查一下"生成的PHP页面"的标题吗?最简单的方法是使用Firefox的Firebug或Chrome的Developer Tools来监控网络流量并检查ajax调用和PHP响应。
编辑:我意识到你的问题是UPDATE ORDER文本是一个A HREF链接,所以当用户点击它时,它会指示浏览器重新加载页面——所以有时它会在发出AJAX调用之前重新加载它。只需将A HREF更改为DIV或SPAN即可。
所以不是
<a href="" id="button" class="textbutton">Update Order</a>
有
<div id="button" class="textbutton">Update Order</div>
或
<span id="button" class="textbutton">Update Order</span>