2014-03-01 26 views
1

在我的应用程序中,我使用JQuery数据表来显示我的产品详细信息。我有很多购买过滤器(价格,产品类型等),最后在数据表中,用户有链接查看选定的产品详细信息。表格示意图如下;URL太长 - 如何在jQuery中为锚标记执行POST

table

而表人口,我已经附加过滤PARAMS到锚元素的href。代码片段如下所示;

"mRender" : function(page, type, full) { 
     return '<a href="' + CXT_PATH 
       + '/page?filters=' 
       + getFilters() 
       + '">' + "LINK" + '</a>' 
       }          
       } 

这里getFilters()有时返回的过滤器100的,由此造成的网址太长。我认为,虽然默认锚点链接点击它们作为GET请求传递。所以可能会有一个大小限制。

所以,我不希望我的用户会有奇怪的结果,当他们选择多个过滤器..

我打算如下事情:

每当用户点击链接,它会调用在JavaScript中的方法和表单发布(因为页面重新加载是必需的)。请指导我,如何实现在JavaScript或jQuery或任何其他更好的方式来实现相同。

我在使用Spring MVC + JSP +的Javascript & JQuery的

+0

为什么下降投票?我想,我清楚地说明了我的问题陈述。 – appu

回答

1

这里是一个开始:

使用XMLHttpRequest对象:

来源为getXHR功能:XMLHttpRequest Browser Support

function getXHR() { 
    if (window.XMLHttpRequest) { 
    // Chrome, Firefox, IE7+, Opera, Safari 
    return new XMLHttpRequest(); 
    } 
    // IE6 
    try { 
    // The latest stable version. It has the best security, performance, 
    // reliability, and W3C conformance. Ships with Vista, and available 
    // with other OS's via downloads and updates. 
    return new ActiveXObject('MSXML2.XMLHTTP.6.0'); 
    } catch (e) { 
    try { 
     // The fallback. 
     return new ActiveXObject('MSXML2.XMLHTTP.3.0'); 
    } catch (e) { 
     alert('This browser is not AJAX enabled.'); 
     return null; 
    } 
    } 
} 


var xhr = getXHR(); 
xhr.open("POST", url, true); 
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); 
xhr.send("your-querystring"); 
+0

该解决方案是否具有交叉浏览器兼容性? – appu

+0

是的,(更新的答案),但旧的IE(6岁及以上)需要'ActiveXObject('MSXML2.XMLHTTP.6.0');'对象,但方法是相同的 – LGSon

+0

行。我会尝试并让你知道状态 – appu

0

你可以尝试下面的方法,在表格中创建一个表单,并在点击过滤器链接时指定过滤器值在表单中隐藏隐藏的元素并提交表单。

HML

<form action="<server_path>" method="post" id="filterform"> 
<input type="hidden" name="filters" id="filters" /> 
<input type="submit/> 
</form> 

使用Javascript/jQuery的

"mRender" : function(page, type, full) { 
     return '<a onclick="' submitFilter() '">' + "LINK" + '</a>' 
}  

submitFilter: function (CXT_PATH){ 
     $("#filters").val(getFilters()); 
     $("#filterform").submit(); 
} 
+0

我试过这个解决方案,下面是结果。它不显示LINK作为超链接,我添加了**返回'' + "LINK" + ''**。在页面加载时,也会调用** submitFilter()**。我错过了什么吗? – appu

+0

删除submitFilter()的代码并更新为返回'' + "LINK" + ''。它现在应该工作 – gnanz