Basic Simple Asp.net + jQuery + JSON example

Question

I\'m trying to learn how to make a simple call to the server from Javascript/jQuery. I\'ve been trying to learn and could not find a tutorial with those simple steps.

Answer 1

Here sample code using jquery ajax call and on serverside webmethod returns jSon format data. Jquery :

$(‘#myButton’).on(‘click’,function(){
    var aData= [];
     aData[0] = “2010”; 
     aData[0]=””    
     var jsonData = JSON.stringify({ aData:aData});
       $.ajax({
                type: "POST",
                url: "Ajax_function/myfunction.asmx/getListOfCars",  //getListOfCars is my webmethod 
                data: jsonData,
                contentType: "application/json; charset=utf-8",
                dataType: "json", // dataType is json format
                success: OnSuccess,
                error: OnErrorCall
            });

function OnSuccess(response.d)) {
console.log(response.d)
}
function OnErrorCall(response)) { console.log(error); }
});

Codebehind : Here a webmethod which is returning json format data i.e list of cars

[webmethod]
public List getListOfCars(list aData) 
{
    SqlDataReader dr;
    List carList = new List();

         using (SqlConnection con = new SqlConnection(cn.ConnectionString))
         {
            using (SqlCommand cmd = new SqlCommand())
            {
               cmd.CommandText = "spGetCars";
               cmd.CommandType = CommandType.StoredProcedure;
               cmd.Connection = con;
               cmd.Parameters.AddWithValue("@makeYear", aData[0]);
               con.Open();
               dr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
               if (dr.HasRows)
               {
                  while (dr.Read())
                   {    
                       string carname=dr[“carName”].toString();
           string carrating=dr[“carRating”].toString();
            string makingyear=dr[“carYear”].toString();
           carList .Add(new Cars{carName=carname,carRating=carrating,carYear=makingyear}); 
        }
                }
            }
          }
        return carList 
        }

//Created a class

Public class Cars {
public string carName;
public string carRating;
public string carYear;
}

Blog Article:

• jQuery Asp.net ajax JSON Example, C# WebMethod with sql database
• Insert Data Using jQuery Ajax in Asp.net C# [Database MS SQLServer]