JSON : get User details based on Userid in ASP.NET


get User details based on Userid in JSON

In this articles i'm going to explain how to retrieve data from database by using userid and display in below div tag in asp.netwebpage by using json. as show in above image

JSON

  1. JSON stands for JavaScript Object Notation
  2. JSON is a lightweight data-interchange format
  3. JSON is language independent
  4. JSON is "self-describing" and easy to understand

Create Users Table in Master Database

 Create Table users(
  @uid int,
  @username varchar(25),
  @name varchar(25)
 )

 Insert into users values('1','Username1','Name1')
 Insert into users values('2','Username2','Name2')
 Insert into users values('3','Username3','Name3')
 Insert into users values('4','Username4','Name4')
 Insert into users values('5','Username5','Name5')
 Insert into users values('6','Username6','Name6')
 Insert into users values('7','Username7','Name7')
 Insert into users values('8','Username8','Name8')
 Insert into users values('9','Username9','Name9')


Design HTML

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="JsonWebApplication.WebForm2" %>

<!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></title>
    <!--  Add JQuery Script Code Here  -->
</head>
<body>
    <form id="form1" runat="server">
   
<div>
     <table>
         <tr>
             <td>Enter User ID :</td>
             <td>
                 <asp:TextBox ID="txtuserid" runat="server"></asp:TextBox>
             </td>
             <td>
                 <asp:Button ID="b1" runat="server" Text="Get User Details" />
             </td>
         </tr>
     </table>
    </div><br />
        <div id="divdisplay"></div> 
   
     <br />
    </form>
</body>
</html>

JSON Code

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

 $(document).ready(function () {
            $('#b1').click(function () {
                var uid = $('#txtuserid').val();
                $.ajax({
                    contentType: 'application/json; charset=utf-8',
                    url: 'WebForm2.aspx/GetUser',
                    data: JSON.stringify({ uid: uid }),
                    dataType: 'json',
                    method: 'post',
                    success: function (data) {
                        for (var i = 0; i < data.d.length; i++) {
                            $("#divdisplay").empty();
                            $("#divdisplay").append("<table border='0'>" + "<tr>" + "<td>Username :</td>" + "<td>" + data.d[i].Username + "</td>" + "</tr>" + "<tr>" + "<td>Name :</td>" + "<td>" + data.d[i].Name + "</td>" + "</tr>" + "</table>");
                        }
                    },
                    error: function (result) {
                        alert('Error');
                    }
                });
                return false;
            });

</script>

C# Coding : Get User Details Based on UserID

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;

namespace JsonWebApplication
{
    public partial class WebForm2 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        [WebMethod]
        public static List GetUser(int uid)
        {
            List listUser = new List();
            SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["dbCon"].ConnectionString);
            SqlDataAdapter da = new SqlDataAdapter("select username, name from users where uid='" + uid + "'", con);
            DataSet ds = new DataSet();
            da.Fill(ds);
            if (ds.Tables[0].Rows.Count > 0)
            {
                User _user = new User();
                _user.Username = ds.Tables[0].Rows[0]["username"].ToString();
                _user.Name = ds.Tables[0].Rows[0]["name"].ToString();
                listUser.Add(_user);
            }
            return listUser;
        }
       
    }
}
0 Komentar untuk "JSON : get User details based on Userid in ASP.NET"

Back To Top