我有一个数据表,我希望用户能够单击列标题并发送一个非AJAX请求,以重新加载包含按该列排序的数据的页面。
我可以只将列标题设置为链接,但是我希望他们能够单击列标题中的任何位置因此我添加了隐藏表单,并尝试使用jQuery在单击列标题时提交表单。
我遇到的问题是,尽管它对第二个列标题完全按预期工作--单击提交隐藏的表单并重新加载页面--但对第一个列标题根本不起作用--表单没有被提交。
1.是什么阻止了第一列表单的提交?
1.有没有比使用隐藏表单更好的方法来实现这一点?
超文本:
<th class='sortable'>
<form action='/procurements' class='sort_form' method='get'>
<input name='sort' type='hidden' value='title' />
</form>
Title
<img class='sort_indicator' src='/images/sort_unsorted.jpg' />
</th>
<th class='sortable'>
<form action='/procurements' class='sort_form' method='get'>
<input name='sort' type='hidden' value='nature' />
</form>
Procurement type
<img class='sort_indicator' src='/images/sort_unsorted.jpg' />
</th>
联森:
$(document).ready(function(){
$('table.tgr_datagrid th.sortable').click(
function() {
$(this).children( 'form' ).submit();
}
);
});
2条答案
按热度按时间vjrehmav1#
如果你只是在做一个
GET
请求,那么就不要使用form
了:演示:http://jsfiddle.net/marcuswhybrow/NL3km/
因此,在您的代码上下文中,您可以具有以下内容(注意自定义
data-sort-name
属性):jQuery:
型
ua4mk5z42#
您可能需要在
.click()
周围使用.each()
,否则您将只在返回的数组/对象的最后一个元素上发出单击(正如您所注意到的)。其他想法: