Calling Page Method


Today I will tell you how to call a page method using ajax request.
AjaxRequest.aspx
<script type="text/javascript" src="Scripts/jquery-1.7.2.js"></script>
<script type="text/javascript">
   $(document).ready(function()
   {
  
    $("#btnGetData").click(function()
    {
    
    $.ajax({
      type: "POST",
      url: "AjaxRequest.aspx/GetData",
      data: "{}",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(msg) {
      $("#GetData").append(msg.d);
      }
    });
  });
  });
    </script>
<div id="Data">
    To get data using ajax request click on this button.<br />
    <input type="button" id="btnGetData" value="Get Data" />
   
    <div id="GetData">
   
    </div>
   
    </div>
AjaxRequest.aspx.cs
[System.Web.Services.WebMethod]
    public static string GetData()
    {
        string query = "select * from employee";
        DataTable dt = new DataTable();
        DataAccess da = new DataAccess();
        da.FillGrid(dt, query);
        string table = "<table><tr><td>This data is returned using ajax call.</td></tr>";
        table += "<tr><td>Id</td><td>Name</td></tr>";
        foreach (DataRow dr in dt.Rows)
        {
            table += "<tr><td>" + dr[0].ToString() + "</td><td>"+dr[1].ToString()+"</td></tr>";
        }
        table += "</table>";
        return table;
    }
Now let’s discuss in detail.$.ajax has some parameters I will discuss only some important things in it.
·         URL :This is the url of your web page and after that comes your method name.i-e mypage.aspx/mymethod.
·         Data: if your method accepts some arguments you need to pass them here and argument name must be same as in the method. i-e suppose you have a method which accepts an argument public static string GetName(string name) so when you will call it you will pass it like data: "{name:'"+somename+"'}".
·         Success: When your method is called successfully you can write code here what you want after success. You can call another function in it.
·         The method in cs class should be webmethod and should be static.
Now in this example I have a query which returns data and I have created an HTML table using data retrieved from database and returned that data and in my page I have appended this data to a div.

Comments

Post a Comment

Popular posts from this blog

Check if ViewBag is null or doesn't exist

ASP.NET MVC uses  ViewBag to store some data from Controller and than accessed in View like you can save UserName in ViewBag who is logged in to your website and than display it in view. Sometimes you need to check if ViewBag exists or it is not null than execute your next piece of code. Let's take an example. Controller Code public ActionResult Index() { ViewBag . UserName = "John"; return View(); } View Code @if ( ViewBag . UserName ! = null ) { < label >@ViewBag.UserName</ label >;     } Here if ViewBag.UserName is not null than label will be rendered with username. If it is null the code will not execute. So you can easily check for a ViewBag Property and execute your code.
Read more

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 while copying. using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using
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({         "proccessing": true,         "serverSide": true,  
Read more