How to get parameter value after submit the form in asp.net c# using jQuery

Question

I have created two aspx pages{page1.aspx and page2.aspx} with master page {main.master} and I redirected to page2 from page1 with `` tag button click (in page1) my logic is executing fine but while I'm calling that parameter in page2.aspx using jQuery logic I'm getting null value or Error on console log.

Note :- I have created two aspx pages with master page because in my real time scenario I should work like that.

This is my entire logic

Master page:-


<%@ Master Language="C#" AutoEventWireup="true" CodeFile="main.master.cs" Inherits="main" %>





    
    





    


    
        

            
            

        
    




And page1.aspx page :-



<%@ Page Title="" Language="C#" MasterPageFile="~/main.master" AutoEventWireup="true" CodeFile="page1.aspx.cs" Inherits="page1" %>






RedirectToPage2


 



And page2.aspx page :-



<%@ Page Title="" Language="C#" MasterPageFile="~/main.master" AutoEventWireup="true" CodeFile="page2.cs" Inherits="page2" %>





    



jQuery logic :-


function FinalSB(){

$(".redirectclick").on("click", function (e) {
        e.preventDefault();
        //alert('click');
       redirectopage2();
});

}

function FinalOC(){
//alert('click');


    var p = document.querySelector('message').value;
    alert(p); //null value is coming or value is not defined error coming in console log

    //var searchParams = new URLSearchParams(window.location.search);
    //alert(searchParams);
    //var p = searchParams.get('message'); //null value is coming or value is not defined error coming in console log

}

function redirectopage2() {

    post_to_url('http://localhost:51609/page2.aspx',
    {
        message:"Calling"
        
    }, 'post','_blank');
}

//Form Submit
function post_to_url(path, params, method, targetOpt) {
    method = method || "post";
    targetOpt = targetOpt || "_blank";

    var form = document.createElement("form");
    form.setAttribute("method", method);
    form.setAttribute("target", targetOpt);
    form.setAttribute("action", path);

    for (var key in params) {
        if (params.hasOwnProperty(key)) {
            var hiddenField = document.createElement("input");
            hiddenField.setAttribute("disabled", 'true');
            //hiddenField.setAttribute("type", "hidden");
            hiddenField.setAttribute("name", key);
            hiddenField.setAttribute("value", params[key]);
            form.appendChild(hiddenField);
        }
    }

    document.body.appendChild(form);
    form.submit();

}



The entire logic is above and logic is working fine but the parameter value is not coming when I click on the `` tag button please suggest me how to achieve this and where I did the mistake.

I have did this logic as per my experience and next I'm unable to moving to solve this issue.
Please suggest me how to solve this issue.

Sorry for my bad English.

Answer

Hi @Ashok Kumar,

According to your needs, I created simple examples to achieve such requirement. Here is the code sample:

Page1:


    
        RedirectToPage2

Page 2:

Page2.aspx.cs

public static string message { get; set; }
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                if (Request.RequestType == "POST")
                {
                    message = Request.Form["Message"];
                    MessageLabel.Text = message;
                }
            }
        }

        [WebMethod]
        public static string getMessage() {
            return message;
        }

custom.js

function FinalOC() {
    $.ajax({
        url: "page2.aspx/getMessage",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            alert(msg.d);
        }
    });
}

function FinalSB() {

    $(".redirectclick").on("click", function (e) {
        e.preventDefault();
        //alert('click');
        redirectopage2();
    });

}

function redirectopage2() {

    post_to_url('page2.aspx',
        {
            message: "Calling"

        }, 'post', '_blank');

}

//Form Submit
function post_to_url(path, params, method, targetOpt) {
    method = method || "post";
    targetOpt = targetOpt || "_blank";

    var form = document.createElement("form");
    form.setAttribute("method", method);
    form.setAttribute("target", targetOpt);
    form.setAttribute("action", path);

    for (var key in params) {
        if (params.hasOwnProperty(key)) {
            var input = document.createElement("input");
            input.setAttribute("name", key);
            input.setAttribute("value", params[key]);
            form.appendChild(input);
        }
    }

    document.body.appendChild(form);
    form.submit();
}

Result:

result

The form submission is on the server side, so you can't get the data from the server side from the browser DOM, in this case, you can get it through server controls (e.g. ASP:Label in prevoius example) or Ajax request. On the other hand, as Bruce mentioned, the submitted form does not contain the disaled element.

Best regards,

Xudong Peng

If the answer is the right solution, please click "Accept Answer" and kindly upvote. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer

The browser does not post disabled fields. Not sure why you would disable a hidden field.

How to get parameter value after submit the form in asp.net c# using jQuery

3 answers