Hi Im a newbie in asp.net, im a php programmer though, and i've been working on a pop up div with a search engine on it, in php i have no problem working with json but in asp it took me already two days to find a similar problem, yet no luck. I hope you can help me..
heres my code
//HTML
i have a dropdown and a textbox for input of the keyword

<table id="filterContainer"> 
        <tr> 
            <td>
                Filter By: 
                <asp:DropDownList ID="DropDownList3" name="filter" runat="server" >
                    <asp:listitem text="Please Select.." value=""></asp:listitem> <asp:listitem text="Id" value="id"></asp:listitem> 
                    <asp:listitem text="Program Title" value="title"></asp:listitem> 
                    <asp:listitem text="Customer Name" value="name"></asp:listitem> 
                </asp:DropDownList> 
            </td> 
        </tr> 
        <tr> 
            <td>
                Filter Key:
                <asp:TextBox ID="FilterKey" name="filterKey" runat="server"></asp:TextBox> 
            </td> 
        </tr> 
</table>

//My grid for the display of data

<asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
    <ContentTemplate> 
        <asp:GridView ID="GridView1" runat="server" CssClass="Grid" class="fixedTable" AutoGenerateColumns="false"  AlternatingRowStyle-BackColor = "#C2D69B" ShowHeader = "false">
            <Columns> 
                <asp:BoundField DataField="Title" HeaderText="Title" /> 
                <asp:BoundField DataField="Name" HeaderText="Name" /> 
                <asp:BoundField DataField="DTASA_Amount" DataFormatString="{0:n2}" HeaderText="Amount" /> 
                <asp:BoundField DataField="DTASA_Accrued" DataFormatString="{0:n2}" HtmlEncode = False HeaderText="Accrued" /> 
                <asp:BoundField DataField="DTASA_Balance" HtmlEncode = False  HeaderText="Balance" /> 
            </Columns> 
        </asp:GridView> 
    </ContentTemplate>
</asp:UpdatePanel>

//JS

$('#FilterKey').on('change', function() {
    var key = $(this).val();
    var filter = $('#DropDownList3').val();
    $.ajax({
    type: "POST",
    contentType: "application/json; charset=utf-8",
    url: "dtasa.aspx/GetDtasaRecordN",
    data: "{'Key':'" + key + ", 'Filter':'" + filter + "'}",
    dataType: "json",
    success: function (result) {
    alert('success');
    }
    });
})

//c#
I dont know exactly how to do it on c# file, what i want is to pass the variable on js here and get the data on database and display it on a gridview

protected void GetDtasaRecordNOld(string filterKey, string filter)
    {
        //object sender, EventArgs e
        DataSet ds = new DataSet();
        DataTable dt = new DataTable();
        String strSQL = "";
        Hashtable htParameter = new Hashtable();
        //String FilterKey = "TLC";
        //String filter = "title";
        htParameter.Add("filterKey", filterKey); //FilterKey.Text
        htParameter.Add("filter", filter);//DropDownList3.SelectedValue
        try
        {
            strSQL = oSQLS.GetDtasaRecN(htParameter);
            ds = oDataEnc.PerformMultipleQuery(strSQL);
            dt = ds.Tables[0];
            GridView1.DataSource = dt;
            GridView1.DataBind();

        }
        catch (Exception ex)
        {
            this.lblError.Text = "DefinePageLoad : " + ex.Message;
            ex = null;
        }

    }

If you are using older code, an ASMX might be more useful. If you are more up-to-date an MVC controller or WebApi is much easier to use IMO.

ASMX:

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public List<YourClass> GetJson()
{
    return your_result_list_here;
}

MVC:

public JsonResult GetJson()
{
    return Json(your_result_list_here, JsonRequestBehavior.AllowGet);
}

WebApi:

public HttpResponseMessage GetJson()
{
    return Request.CreateResponse(HttpStatusCode.OK, your_result_list_here);
}

Im sorry but i dont have any idea on ASMX, im familiar with the MVC and WebApi, but i think im not using the two, MVC and WebApi..

Where was this class and method defined?
oSQLS.GetDtasaRecN

Hi @tobyITguy,
I defined it this way, its a class connected to all may queries.. Thanks

    private static clsSQLData oDataEnc = new clsSQLData(); //class to may database connection
    private static clsSQLStatement oSQLS = new clsSQLStatement();//class to all may queries
    private static clsUtilities oUtilities = new clsUtilities();

hello i have an update into this, what i tried is to put update panel and triggers to the my textbox and dropdown,i tried i can pass the variables to may c# file and can get the details from may database, yet may problem is i cant return the data to may gridview.. here's may updated codes

 <asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
     <ContentTemplate>
         <div id="light" class="white_content">
            <a href = "javascript:void(0)" class="image" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">
                <img src="http://localhost:62251/Website2/assets/css/image/close.png" alt="Close" title="Close"/>
            </a>
         <br />
         <br />
         <table id="filterContainer">
             <tr>
                 <td>
                 Filter By: 
                 <asp:DropDownList ID="DropDownList3" AutoPostBack="true" name="filter" runat="server" onselectedindexchanged="GetDtasaRecordN">
                     <asp:listitem text="Please Select.." value=""></asp:listitem>
                     <asp:listitem text="Id" value="id"></asp:listitem>
                     <asp:listitem text="Title" value="title"></asp:listitem>
                     <asp:listitem text="Name" value="name"></asp:listitem>
                 </asp:DropDownList>
                 </td>
             </tr>
             <tr>
                 <td>
                 Filter Key:
                 <asp:TextBox ID="FilterKey" AutoPostBack="true" name="filterKey" runat="server"  OnTextChanged="GetDtasaRecordN"></asp:TextBox>
                 </td>
             </tr>
         </table>
         <br />
         <br />
         <div id="demoHead">
         <table cellspacing="0" cellpadding="0" rules="all" id="tblHeader">
             <tr>
                 <td>Title</td>
                 <td>Name</td>
                 <td>Amount</td>
                 <td>Accrued</td>
                 <td>Balance</td>
             </tr>
         </table>
         </div>
         <div id="demo" style ="">
             <asp:GridView ID="GridView1" runat="server" CssClass="Grid" class="fixedTable" AutoGenerateColumns="false" AllowSorting="True"  AlternatingRowStyle-BackColor = "#C2D69B" ShowHeader = "false">
                 <Columns>
                     <asp:BoundField DataField="DTASA_Description" HeaderText="Program Title" />
                     <asp:BoundField DataField="CustomerName" HeaderText="Customer Name" />
                     <asp:BoundField DataField="DTASA_Amount" DataFormatString="{0:n2}"  HtmlEncode = False HeaderText="Amount" />
                     <asp:BoundField DataField="DTASA_Amount" DataFormatString="{0:n2}" HtmlEncode = False HeaderText="Accrued" />
                     <asp:BoundField DataField="DTASA_Amount" DataFormatString="{0:n2}" HtmlEncode = False HeaderText="Balance" />
                     <asp:BoundField DataField="DTASA_Program_Code" Visible="false" HtmlEncode = False HeaderText="Program_Code" />
                     <asp:BoundField DataField="DTASA_End_Date" Visible="false" HtmlEncode = False HeaderText="Balance" />
                 </Columns>
             </asp:GridView>
         </div> 
         <Triggers>
            <asp:AsyncPostBackTrigger ControlID="FilterKey" EventName="TextChanged" />
         </Triggers>
         <Triggers>
            <asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" />
         </Triggers>
         </div>
     </ContentTemplate>
 </asp:UpdatePanel>
 <div id="fade" class="black_overlay"></div>

c#

 protected void GetDtasaRecordN(object sender, EventArgs e)
    {
        //object sender, EventArgs e
        DataSet ds = new DataSet();
        DataTable dt = new DataTable();
        String strSQL = "";
        Hashtable htParameter = new Hashtable();
        htParameter.Add("filterKey", FilterKey.Text); //FilterKey.Text
        htParameter.Add("filter", DropDownList3.SelectedValue);//DropDownList3.SelectedValue
        try
        {
            strSQL = oSQLS.GetDtasaRecN(htParameter);
            ds = oDataEnc.PerformMultipleQuery(strSQL);
            dt = ds.Tables[0];
            GridView1.DataSource = dt;
            GridView1.DataBind();

        }
        catch (Exception ex)
        {
            this.lblError.Text = "DefinePageLoad : " + ex.Message;
            ex = null;
        }
    }

I actually dont see anything wrong with your code.

Try setting AutoGenerateColumns to true in the asp control and let C# make the columns for you. Lets see what happens.

I have solved it already thank you guys.. I just put the triggers inbetween the </ContentTemplate> and </asp:UpdatePanel>.

 <asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="False">
     <ContentTemplate>
     <asp:GridView ID="GridView1" runat="server" EnableCaching="false" CssClass="Grid" class="fixedTable" AutoGenerateColumns="false" AllowSorting="True"  AlternatingRowStyle-BackColor = "#C2D69B" ShowHeader = "false">
         <Columns>
         <asp:BoundField DataField="Number" ItemStyle-CssClass="hiddencol" HeaderText="Dtasa" />
         <asp:BoundField DataField="Description" HeaderText="Program Title" />
         <asp:BoundField DataField="Name" HeaderText="Customer Name" />
         <asp:BoundField DataField="Amount" DataFormatString="{0:n2}"  HtmlEncode = False HeaderText="Amount" />
         </Columns>
     </asp:GridView>
    </ContentTemplate>
         <Triggers><asp:AsyncPostBackTrigger ControlID="FilterKey" EventName="TextChanged" /></Triggers>
         <Triggers><asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" /></Triggers>
 </asp:UpdatePanel>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.