.NET

How to bind Gridview Using Json and Webservices

How To Bind Gridview using Json and Webservices

Json Script and for Jquery reference

  <script type="text/javascript" src="jquery.min.js"></script>

    <script type="text/javascript">
    //$(document).ready(function() {
    function BindGridView() {
                                $.ajax({
                                type: "Post",
                                url: "WebService.asmx/GetAllRecords",
                                data: "{}",
                                contentType: "application/json; charset=utf-8",
                                dataType: "json",
                                success: function(data)
                                 {
                                 //alert(data.d);
                                 var Employees = data.d;
                                 //var Employees = (typeof data.d) == 'string' ? eval('(' + data.d + ')') : data.d;
                                    $('#grddata').empty();
                                for (var i = 0; i < Employees.length; i++)
                                {
                                if (i==0) 
                                        {
                                        $('#grddata').append('<table><tr><td><strong>Emp_Title:</strong></td><td>' + Employees[i] + '</td></tr>');
                                    //$('#grddata').append('<p><strong>Emp_Title: ' + Employees[i]+ '</p></strong>');
                                        }
                                        else if(i%2)
                                        {
                                        $('#grddata').append('<tr><td><strong> Emp_Name:</strong> </td><td>' + Employees[i]+ '</td></tr>');
                                        }
                                        else
                                        {
                                        $('#grddata').append('<table><tr><td><strong>Emp_Title:</strong></td><td>' + Employees[i] + '</td></tr>');
                                        }
                                        
                                }
                                },
                                failure:function(data)
                                {
                                alert("Error Ha..Ha...Ha...");
                                }
                                });
                                }
    </script>

Design page
 <body onload="BindGridView();">
    <form id="form1" runat="server">
    <div id="grddata">
    </div>
    </form>
</body>

Web services code
using System;
using System.Data;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Data.SqlClient;
using System.Collections.Generic;

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
//[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{

 [WebMethod]
    public string[] GetAllRecords()
    {
        SqlConnection con = new SqlConnection("Data Source=BITPLUS5\\SqlExpress;Initial Catalog=WEBHR_22112011;User ID=sa;pwd=bit123;");

        con.Open();
        //string strQuery = "select Emp_title,Emp_name from tblemployee where emp_name like '" + prefixText + "%'";
        string strQuery = "select Emp_title,Emp_name from tblemployee";

        DataSet ds = new DataSet();
        SqlDataAdapter da = new SqlDataAdapter(strQuery, con);
        da.Fill(ds);
        con.Close();
        List<string> cityList = new List<string>();
        for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
        {

            cityList.Add(ds.Tables[0].Rows[i]["Emp_title"].ToString());
            cityList.Add(ds.Tables[0].Rows[i]["Emp_name"].ToString());
            //cityList.Add(ds.Tables[0].Rows[i][0].ToString());
        }
        con.Close();
        return cityList.ToArray();
        //return ds;
    }
}
Ebook Download
View all
Learn
View all
Get Started

You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

Become a sharper developer and jumpstart your career.

Basic

$0

$

. 00

monthly

For Basic members:

  • Standard Profile
  • Access learning courses
  • Access free e-books
  • 1x point
Premium

$20

$

. 00

monthly

For Premium members:

  • Earn 2x reward points
  • Premium profile with Verified check
  • Premium Avatar with status update
  • Learning courses
  • Unlimited Certifications and badges on profile
  • Unlimited Book downloads
  • Access to Premium content
  • Online Training
  • Unlimited PDF conversions and downloads
  • Professional Resume Writing
  • Interview Preparations Guide
  • 25 messages per month
  • 1 "Kodzu" avatar, basic
Elite

$45

$

. 00

monthly

For Elite members:

  • Bundle E-books
  • Access to all Learn Series
  • Unlimited Apply Jobs