Convert Form Post to Querystring

Question

I am working in ASPDotNetStorefront on an XML package (largely irrelivant). Basically I have a form with a bunch of fields and a button that 'submits' the form. I would actually like to have the button convert the values of the fields into a querystring and then perform a GET instead of a POST.

I would imagine that I could do something like this with JavaScript, perhaps jQuery, but I'm not sure how I would do that. Ideally, I would like a simple function I could call.

I should note that I'm using ASP.Net and I only want to convert the actual values of the fields to a query string, not any state information. This is for a search form.

Answer 1

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

in WebForm2.aspx you can do like this

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

for jquery you can use AJAX to send data between pages. Here is the sample code This is the best article i have found Using jQuery for AJAX in ASP.NET : codeproject example of using 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);

Example without AJAX.Simple Javascript with Query String

<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()” />

for 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>”);

Answer 2

With jQuery:

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

using:

jQuery ajax

jQuery serialize

Answer 3

You could do this:

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

With (since you tagged this jQuery):

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

… but forms that might go to bookmark-able data or might make significant changes sound like they would be confusing to the user (and I can't think of any other reason to switch from post to get on the fly in end user controls).

If you always want to GET data, then you should modify the source sent to the browser instead of twiddling the DOM on the fly with JS.

Answer 4

Really, you just need to change the method attribute of your <form> tag in your HTML.

If you don't have direct control over the markup that your .NET component generates, you can always manipulate the <form> tag and set the attribute with JavaScript when the page loads.

Or, you can bind a click event to the form's submit button, and cancel the event (by returning false for example), and do a GET yourself.

Answer 5

You could just se <form method="GET"> instead of <form method="POST">. No Javascript needed (unless you do not want to refresh the page).