Pass C# object to webmthod through ajax

Ajax is frequently used in ASP.NET to pass data from javascript to c# methods known as WebMethod in webforms. It is easy to pass common data like string or int values to webmethod through ajax.

Sometimes we need to pass whole object of some C# class thorugh ajax  to avoid sending and receiving large number of parameters. Lets take an example where we will send UserInfo object from ajax to webmethod.


This is our class whose object will be sent through ajax

public class UserInfo
{
    public int UserId { get; set; }
    public string UserName { get; set; }
    public string Address { get; set; }

}

And here is webmthod in which we will receive the UserInfo object

[System.Web.Services.WebMethod]
public static void GetUserInfo(UserInfo User)
{
  //Your Code
}

And Here is our ajax method

var objUser = new Object();
        objUser.UserId = 1;
        objUser.UserName = "Mairaj";
        objUser.Address = "Street 10";

        $.ajax({
            cache: false,
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "User.aspx/GetUserInfo",
            data: JSON.stringify({ User: objUser }),
            dataType: "json",
            success: function (data) {
                console.log("Success");
            },
            error: function (err) {
                console.log(err.responseText);
            }

        });


Here is object received


Comments

Post a Comment

Popular posts from this blog

Using Progress Bar In C#

Image
Using Progress Bar in C#: Progress Bar is very commonly used control in many applications to display the progress of task being performed. Progress Bar is displayed when copying files, deleting files or installing some software. How to use Progress Bar: ·          Start New Windows Form Application. ·          Go to Toolbox. ·          Select Progress Bar and Drag it to your Form. To make Progress Bar working you need to know some properties of Progress Bar Progress Bar.Maximum: Defines how long it should run Progress Bar.Step: Defines how much it should increase current position of Progress Bar. Progress Bar.Style: How should it look like? There is also a very basic method which is used to run Progress Bar properly. Progress Bar.PerformStep() Let’s see an example. In this example we will copy files and folders from one location to another and show the progress bar wh...
Read more

Get elements by class name in javascript

To get elements using class name we use getElementsByClassName method available with document object. This method takes name of class an argument.  It returns array of elements because more than one element(s) can have same class. < input type ="button" value ="Get By Class" onclick =" GetByClassName() " /> < div id ="myDiv" class ="myClass">     This is a div </ div > < script type ="text/javascript">   function GetByClassName() {         var elements = document.getElementsByClassName( "myClass" );         if (elements.length > 0) {             alert(elements[0].innerHTML);         }     else       alert( "No matching element found" );    }   </ script >
Read more

Jquery serer side datatables in asp.net

In this post we will learn how we can implement jquery   server side datatables in asp.net mvc application. We need to add datatables library to our page, we can add references of libray from datatables <a href="https://datatables.net/" target="_blank">website</a>. We need to create an html table on which we will apply datatable. <table class="table table-striped table-bordered table-hover table-checkable order-column dataTable" id="tblInventoryItems">   <thead>     <tr>       <th>Item Name</th>       <th>Item Price</th>       <th>Item Quantity</th>       <th></th>     </tr>   </thead>   <tbody></tbody> </table> Then we need the code which will apply the datatable to above html table. Below is the code to apply datatable $("yourtableid").DataTable({         "p...
Read more