Step 1: Your Webconfig file like.

<?xml version="1.0"?>

<configuration>

<configSections>

<sectionGroup name="ajaxNet">

<section name="ajaxSettings" type="AjaxPro.AjaxSettingsSectionHandler,AjaxPro.2"
 requirePermission="false" restartOnExternalChanges="true"/>

</sectionGroup>

</configSections>

<ajaxNet>

<ajaxSettings>

<urlNamespaceMappings useAssemblyQualifiedName="false">

<add type="MyAjaxMethods,App_Code" path="_a"/>

</urlNamespaceMappings>

<jsonConverters>

<add type="AjaxPro.BitmapConverter,AjaxPro.2"/>

</jsonConverters>

<oldStyle>

<includeMsPrototype/>

</oldStyle>

</ajaxSettings>

</ajaxNet>

<connectionStrings/>

<system.web>

<compilation debug="true"/>

<authentication mode="Forms"/>

</system.web>

<location path="ajaximage">

<system.web>

<httpHandlers>

<add verb="GET" path="*.ashx" type="AjaxPro.AjaxBitmapHttpHandler,AjaxPro.2"/>

</httpHandlers>

</system.web>

</location>

<location path="ajaxpro">

<system.web>

<httpHandlers>

<add verb="*" path="*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>

</httpHandlers>

</system.web>

</location>

</configuration>

Step2:

 Create Default.aspx page.

On page load event.

AjaxPro.Utility.RegisterTypeForAjax(typeof(AJAXDataset.Default));

Step 3: Your .aspx file like.


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AJAXDataset.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> Create DataTable using Javascript</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>
                    First Name :
                </td>
                <td>
                    <asp:TextBox ID="txt_fname" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td>
                    Last Name :
                </td>
                <td>
                    <asp:TextBox ID="txt_lname" runat="server"></asp:TextBox>
                </td>
            </tr>           
            <tr>
                <td>
                </td>
                <td>
                    <asp:Button ID="btnsave" runat="server" Text="Save" OnClientClick="SetEmployeeDetails();"/>
                     <asp:Button ID="btnclear" runat="server" Text="Clear" OnClientClick="ClearDetails();"/>
                </td>
            </tr>
        </table>
    </div>
    <script language="javascript" type="text/javascript">
 
        GetEmployeeData();
        //Get the Value from Server side and bind it.
        function GetEmployeeData() {
            // Create Dataset from client side.
            var ds = new Ajax.Web.DataSet();
            /*
            Call the server side function
            AJAXDataset => namespace
            AJAXDataset => class name od your page.
            so it's like
            Inherits ="AJAXDataset.Default"
            GetEmployeeData => it's your Default page Web methosd.
            */
            ds = AJAXDataset.Default.GetEmployeeData();           
            for (var i = 0; i < ds.value.Tables[0].Rows.length; i++) {               
                document.getElementById("<%=txt_fname.ClientID %>").value = ds.value.Tables[0].Rows[i]["FName"];
                document.getElementById("<%=txt_lname.ClientID %>").value = ds.value.Tables[0].Rows[i]["LName"];
            }         
        }
        //  SetEmployeeDetails();
        function SetEmployeeDetails() {
            //Create DataTable From Client Side.
            var dt = new Ajax.Web.DataTable();
            dt.addColumn("FName", "System.String");
            dt.addColumn("LName", "System.String");
            var drToAdd = new Object();
           drToAdd.FName = document.getElementById("<%=txt_fname.ClientID %>").value;
           drToAdd.LName = document.getElementById("<%=txt_lname.ClientID %>").value;
            dt.addRow(drToAdd);
            /*
       Call the server side function InsertEmployeeData and pass the DataTable to it.            AJAXDataset => namespace
            AJAXDataset => class name od your page.
            so it's like
            Inherits ="AJAXDataset.Default"
            InsertEmployeeData => it's your Default page Web methosd.
            */
            AJAXDataset.Default.InsertEmployeeData(dt);
            return false;
        }
 
        function ClearDetails() {
            document.getElementById("<%=txt_fname.ClientID %>").value = "";
            document.getElementById("<%=txt_lname.ClientID %>").value="";
         }
    </script>
    </form>
</body>
</html>

Step 4: Your .cs file like.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using AjaxPro;
namespace AJAXDataset
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            AjaxPro.Utility.RegisterTypeForAjax(typeof(AJAXDataset.Default));
        }
        [AjaxPro.AjaxMethod()]
        public System.Data.DataSet GetEmployeeData()
        {
            DataSet ds = new DataSet();
            DataTable table = new DataTable();
            table.Columns.Add("FName", typeof(string));
            table.Columns.Add("LName", typeof(string));
            table.Rows.Add("Jayendrasinh", "Fatehsinh");
            ds.Tables.Add(table);
            return ds;
        }
        [AjaxPro.AjaxMethod()]
        public void InsertEmployeeData(DataTable dt)
        {
            if (dt != null)
            {
                if (dt.Rows.Count > 0)
                {
                    for (int i = 0; i < dt.Rows.Count; i++)
                    {               
                    }
                }
            }
        }
    }
}