Want a free Ebook & latest Update Subscribe Now
  [email protected]      beta
Donate

Generic Handler ashx file : Post send JSON data in Asp.net c#, jQuery

Jquery ajax, post data t generic handler :  Here in this tutorial will explain how easily we can post or send  JSON string ( data ) using jQuery to the generic handler ( ashx file) in Asp.net, C#. In another word How we can send parameters, data to Generic handler (ashx) file using jquery ajax (client side). You can also check my previous article on Asp.net, C#, jQuery, JSON  and  jQuery Ajax JSON Example in Asp.net with sql database

Firstly, you will need to include latest jQuery .js file from the Google-hosted site. You can also host the jQuery file on your server, it’s all your choice. Now add a button tag, which trigger click event and send / post data to the generic handler.


# HTML Markup:

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
First Name<input type="text" id="txtFirstName" /><br />
            Last Name 
            <input type="text" id="txtLastName" /><br />
            Qualification
            <input type="text" id="txtQualication" /><br />
            Age 
            <input type="text" id="txtAge" />
            <button id="bntSubmit">Submit</button>
</body>

# Client-Side: Jquery- calling ajax on button click to send JSON data.

On button click, we calling ajax method, and send user data. i.e. First name, Last name, Qualification, and Age. You may notice in below client-side code under ajax method we have used `data: jsonData,` this is important here bcoz we are going to send / post JSON object on

You may notice in below client-side code under ajax method we have used `data: jsonData,` this is important here bcoz we are going to send / post JSON object on server. This is how our client side looks like.

$("#bntSubmit").on('click', function (e) {

    // Initialize the object, before adding data to it.
    //  { } is declarative shorthand for new Object()
    var obj = {};
    obj.first_name = $("#txtFirstName").val();
    obj.last_name = $("#txtLastName").val();
    obj.qualification = $("#txtQualication").val();
    obj.age = $("#txtAge").val();

    //In order to proper pass a json string, you have to use function JSON.stringfy
    var jsonData = JSON.stringify(obj);

    $.ajax({
        url: 'myGenericHandler.ashx',
        type: 'POST',
        data: jsonData,
        success: function (data) {
            console.log(data);
            alert("Success :" + data);
        },
        error: function (errorText) {
            alert("Wwoops something went wrong !");
        }
    });

    e.preventDefault();
});

# Add Generic Handler ( ashx file) in your Asp.net Application.

First, import those two namespaces as shown in below code.

//*
using System.Web.Script.Serialization;
using System.IO;
//*

Now we add a userInfo class into our generic handler ( ashx file ), which matches with our client side JSON object.

 // we create a userinfo class to hold the JSON value
  public class userInfo
  {
     public string first_name { get; set; }
     public string last_name { get; set; }
     public string qualification { get; set; }
     public string age { get; set; }
  }

This is our ProcessRequest method, where we retrieve parameter, data from client side ajax call.

public void ProcessRequest(HttpContext context)
{
    context.Response.ContentType = "text/plain";
    try
    {
        string strJson = new StreamReader(context.Request.InputStream).ReadToEnd();

        //deserialize the object
        userInfo objUsr = Deserialize<userInfo>(strJson);
        if (objUsr != null)
        {
            string fullName = objUsr.first_name + " " + objUsr.last_name;
            string age = objUsr.age;
            string qua = objUsr.qualification;
            context.Response.Write(string.Format("Name :{0} , Age={1}, Qualification={2}", fullName, age, qua));
        }
        else
        {
            context.Response.Write("No Data");
        }
    }
    catch (Exception ex)
    {
        context.Response.Write("Error :" + ex.Message);
    }
}

Yeah, we are done now. Hit F5 and enjoy 🙂

Full Code of Generic Handler ( ashx file ).

<%@ WebHandler Language="C#" Class="myGenericHandler" %>

using System;
using System.Web;
using System.Web.Script.Serialization;
using System.IO;

public class myGenericHandler : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";
        try
        {
            string strJson = new StreamReader(context.Request.InputStream).ReadToEnd();

            //deserialize the object
            userInfo objUsr = Deserialize<userInfo>(strJson);
            if (objUsr != null)
            {
                string fullName = objUsr.first_name + " " + objUsr.last_name;
                string age = objUsr.age;
                string qua = objUsr.qualification;
                context.Response.Write(string.Format("Name :{0} , Age={1}, Qualification={2}", fullName, age, qua));
            }
            else
            {
                context.Response.Write("No Data");
            }
        }
        catch (Exception ex)
        {
            context.Response.Write("Error :" + ex.Message);
        }
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

    // we create a userinfo class to hold the JSON value
    public class userInfo
    {
        public string first_name { get; set; }
        public string last_name { get; set; }
        public string qualification { get; set; }
        public string age { get; set; }
    }


    // Converts the specified JSON string to an object of type T
    public T Deserialize<T>(string context)
    {
        string jsonData = context;

        //cast to specified objectType
        var obj = (T)new JavaScriptSerializer().Deserialize<T>(jsonData);
        return obj;
    }

}

 

You must check these article:

Hope you enjoyed this tutorial. If you have any recommendations, please let us know what you think in the comment section below! See you again next time!

Share:    
Satinder Singh

Hi all, am Founder and Author of Codepedia.info, also atypical polyglot programmer from Bombay, India. I have a passion to create, solve, and deploy software applications.
       ForEach ( minute in MyLife ) { myExperience++ ; }


3 comments on “Generic Handler ashx file : Post send JSON data in Asp.net c#, jQuery”

  1. Weihui

    Very nice! Thank you. However, your jQuery gave me errors in Chrome, Edge. It only works in ie11. Any suggestion?
    Also, the jQuery should be
    success: function (jsondata) {
    console.log(jsondata);
    alert(“Success :” + jsondata);
    data gave me the content of GenericHandler.ashx


Post Comment


Your email address will not be published. Required fields are marked *