Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

Bind Data's to Table Using JSON with Webservice.

0.00/5 (No votes)
23 Nov 2007 1  
Create JSON Application With WebServices

Introduction:

In this article, i wanted to tell you "How to Bind Data's from Database to Client Page Without Refreshing". Here I am using JSON Concept And Web Service (For Getting Data From Database).

Concepts Using:

AJAX-Asynchronous JavaScript And Xml.
JSON-JavaScript Object Notation

JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate.JSON is a text format that is completely language independent but uses conventions that are familiar to programmers of the C-family of languages, including C, C++, C#, Java, JavaScript, Perl, Python, and many others. These properties make JSON an ideal data-interchange language.

WebServices:

Steps For Developing:

Steps:

I am using Following steps for doing this:

  1. Create a web Service for getting Data's from Database.
  2. Convert The Data's(Dataset) to String Object(Using JSON Concept);
  3. Build your Web services.
  4. Call Web services Using Script.
  5. Bind the Data to Client Page.

1.Create a web Service for getting Data's from Database:

1.1 In Webservice Project you have add the Following ConnectionStrings Code in your Web.configFile after

<configuration>
<appSettings/>
<connectionStrings>
<add name="NorthwindConString" connectionString="server=localhost;
    Database=Northwind;uid=sa;pwd=;" providerName="System.Data.SqlClient"/>
</connectionStrings>

1.2.Then Add Json.dll File,It is Used To Convert a Dataset Object to JSON String.

JSON dll Contains one Class called ConvertMe.It is used to Convert Our Datasets to Json String.

1.3 Write the Code in webservice Project For Getting Data's From Database

SqlConnection objcon;
/// <summary>

/// Method For Connection To DataBae

/// </summary>

public void DatabaseConnection(){
    try
    {
        string ConString = ConfigurationManager.ConnectionStrings[
            "NorthwindConString"].ConnectionString;objcon = new 
            SqlConnection(ConString);objcon.Open(); } catch (Exception ex)
    { 
        throw (ex);
    }
}
/// <summary>

/// Method For Getting Datas and then Bind it to Dataset

/// </summary>

/// <returns></returns>

public DataSet GetDatasFromDataBase()
{
    DataSet ds = new DataSet();
    try
    {
        DatabaseConnection();
        SqlCommand objCmd = new SqlCommand();
        objCmd.CommandText = "select ContactTitle from Customers";
        objCmd.CommandType = CommandType.Text;
        objCmd.Connection = objcon;

        SqlDataAdapter objdap = new SqlDataAdapter(objCmd);
        objdap.Fill(ds);
    objcon.Close();


    }
    catch (Exception ex)
    {
        throw (ex);
    }
    return ds;
}
[WebMethod]
///Method For Convert a Dataset To JSON String

public string ConvertDatasetToJSON()
{
    string jsonString = null;
    try
    {
        DataSet ds = new DataSet();
        ds = GetDatasFromDataBase();
        /// Convert Dataset to JSON String.

        jsonString = ConvertMe.ToJson(ds);
    }
    catch (Exception ex)
    {
        throw (ex);
    }
    return jsonString;
}

3. Build your Web services.

4.Create Web Application Project.

<%@ Page Language="C#" AutoEventWireup="true" 
CodeFile="JsonWithwebservice.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript" language="javascript" src=JScript.js></script>
<script type="text/javascript" language="javascript" src=json.js></script>
</head>
<body onload="InitializeService()" id="service" 
tyle="behavior:url(webservice.htc)" onresult="ShowResult()">
<form id="form1" runat="server">
<div id="divDataBaseBind">
<input type=button id="btnGet" value="GetJSON" onclick="GetResponse();" />
</div>
</form>
</body>
</html>

5.Call the WebService Using JavaScript:

function InitializeService()
{ 
    service.useService("http://192.168.15.38/Study/WebService1/" +
        "Service.asmx?wsdl", "GetData");
}
function GetResponse() 
{
    service.GetData.callService("ConvertDatasetToJSON"); 
}

Conclusion

It will help you all. Download the code from the link and run. If I make any mistake.Plz reply me....

Thanks,

Regards,

JustinDhas.Y

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here