URL太长-如何在jquery中为锚标记执行POST

Question

在我的应用程序中，我正在使用JQuery数据表来显示我的产品详细信息。 我有很多购买过滤器（价格，产品类型等），最后在数据表中，用户具有查看所选产品详细信息的链接。 表的示意图如下：

在进行表格填充时，我将过滤器参数附加到了锚元素的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

Answer 1

这是一个开始：

使用XMLHttpRequest对象：

getXHR函数的源代码： XMLHttpRequest浏览器支持

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");

Answer 2

您可以尝试以下方法，在表格中创建表单，然后在单击过滤器链接时将过滤器值分配给表单中的隐藏元素，然后提交表单。

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();
}