我有一个字段表,其中包含使用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/,它确实有用 - 只是不是每次都有。谁能告诉我我做错了什么?提前谢谢!
答案 0 :(得分:1)
我拿了你的代码并重新创建了你的模块,它每次运行都很好。 基于此,我可以得出结论,可能从缓存中提供PHP页面?你能检查一下“生成的PHP页面”的标题吗? 最简单的方法是使用Firefox的Firebug或Chrome的开发人员工具来监控网络流量并检查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>