将表单发布转换为查询字符串答案

【问题标题】：Convert Form Post to Querystring将表单发布转换为查询字符串
【发布时间】：2012-02-27 17:47:21
【问题描述】：

我正在 ASPDotNetStorefront 中处理 XML 包（基本上无关紧要）。基本上我有一个包含一堆字段的表单和一个“提交”表单的按钮。我实际上想让按钮将字段的值转换为查询字符串，然后执行 GET 而不是 POST。

我想我可以用 JavaScript 做这样的事情，也许是 jQuery，但我不确定我会怎么做。理想情况下，我想要一个可以调用的简单函数。

我应该注意我正在使用 ASP.Net，我只想将字段的实际值转换为查询字符串，而不是任何状态信息。这是一个搜索表单。

【问题讨论】：

你能不能只用method="GET"属性改变表单来使用GET，或者你为什么要这样做？
没有一个解决方案说只是将表单转换为GET 方法，因为此页面托管在 ASP.Net 解决方案中，因此在刚刚赢得的 POST 中有 VIEWSTATE 和其他内容不适合 URL，我也不需要它。不过我不知道这是一个选择，所以我会把它放在我的后口袋里，以备后用。

标签： javascript jquery forms query-string aspdotnetstorefront

【解决方案1】：

使用 jQuery：

$.ajax({
    url: 'url/Action',
    type: 'GET',
    data: $('#formId').serialize()
})

使用：

jQuery ajax

jQuery serialize

【讨论】：

【解决方案2】：

Response.Redirect("Webform2.aspx?Name=" +
this.txtName.Text + "&LastName=" +
this.txtLastName.Text);

在 WebForm2.aspx 中你可以这样做

for (int i =0;i < Request.QueryString.Count;i++)
{
Response.Write(Request.QueryString[i]);
}

对于 jquery，您可以使用 AJAX 在页面之间发送数据。这是示例代码这是我找到的最好的文章Using jQuery for AJAX in ASP.NET : codeproject 使用 AJAX 的例子

<div style="width:350px">
    <div style="background:#CCC"> <a href="#" id="editName">Edit</a></div>
    <div id="divView"><asp:literal id="litName" runat="server"/></div>
    <div id="divEdit" style="display:none"></div>
</div>    
var options = {
                method: 'POST',
                url: 'ChangeName.aspx',
                after: function(response) {
                    $("div#divView").html(response).show();
                    $("div#divEdit").empty().hide();
            $("a#editName").show(); 
                }
            };
            //bind to form's onsubmit event
            $("form#ChangeName").ajaxForm(options);

没有 AJAX 的示例。带有查询字符串的简单 Javascript

<script lang=”javascript” type=”text/javascript”>
function testQueryStrings()
{
window.location = “search.aspx?q=abc&type=advanced”;
}
</script>

<input type=”button” id=”btn” value=”Test Query Strings” onclick=”testQueryStrings()” />

对于 search.aspx

<script lang=”javascript” type=”text/javascript”>
var qrStr = window.location.search;
var spQrStr = qrStr.substring(1);
var arrQrStr = new Array();
// splits each of pair
var arr = spQrStr.split(‘&’);
for (var i=0;i<arr.length;i++){
// splits each of field-value pair
var index = arr[i].indexOf(‘=’);
var key = arr[i].substring(0,index);
var val = arr[i].substring(index+1);

// saves each of field-value pair in an array variable
arrQrStr[key] = val;
}

document.write(“<h1>Search parameter: “+arrQrStr["q"]+”. Extra parameter: “+arrQrStr["type"]+”</h1>”);

【讨论】：

除了更高效的东西，我将使用与您在此处类似的模式最终手动编码。你的建议对我不起作用。 onclick="window.location.href = 'searchadv.aspx?SearchTerm=' + SearchTerm.value; return(false);"
太棒了。我最终几乎完全使用了没有 AJAX 的示例。带有查询字符串的简单 Javascript。我实际上创建了一个例程，在包含它之前检查每个参数值是否与默认值不同，但是您在这里演示的正是我所需要的。我也喜欢你建立的例程。

【解决方案3】：

你可以这样做：

<input type="submit" value="get">

使用（因为你标记了这个 jQuery）：

jQuery('input[type=submit]').click(function () { this.form.method = 'GET'; });

...但是可能进入可书签数据或可能进行重大更改的表单听起来会让用户感到困惑（我想不出任何其他从帖子切换到在最终用户控件中运行的其他原因）。

如果你总是想 GET 数据，那么你应该修改发送到浏览器的源，而不是用 JS 动态地玩弄 DOM。

【讨论】：

我在尝试此操作时收到了 Url Too Long 消息。 URL 中包含各种 __EVENTTARGET 信息。
为了您解释这将如何影响书签和其他导航元素并显示一个简单的 jQuery...+1。
@cjbarth — 然后您需要找到一种方法来压缩数据（查找表、较短的键名、以 16 为基数而不是 10 基数表示数字等）和/或删除您不使用的数据不需要。
这就是重点，我不知道如何让 jQuery 或任何其他自动化过程仅使用查询字符串中我需要的字段。因此，我只需要编写自己的 JavaScript 函数来手动构建查询字符串。如果您对此事有见解，我会对此非常感兴趣。

【解决方案4】：

真的，您只需要更改 HTML 中 <form> 标记的 method 属性即可。

如果您无法直接控制 .NET 组件生成的标记，则始终可以操作 <form> 标记并在页面加载时使用 JavaScript 设置属性。

或者，您可以将点击事件绑定到表单的提交按钮，并取消该事件（例如通过返回false），然后自己执行GET。

【讨论】：

【解决方案5】：

您可以只使用<form method="GET"> 而不是<form method="POST">。不需要 Javascript（除非您不想刷新页面）。

【讨论】：