Change datasource for a datagrid using ajax

Hi ppl,

I have a datagrid with XML's as a source file. I have a combo box in the same page and when a user selects a value from the combo box i want to display different stats data without doing a normal postback. I am still learning the updatepanel Ajax control . Can anyone please guide me what i should i do to achieve the functionality? do i need to write any function in js ?

Any help much appreciated

thanks

Place the UpdatePanel around the DataGrid and the Combobox. Make sure the combobox do a postback, set the Autopostback attribute to true. Hook up to the OnSelectedIndexChanged event and get the data based on the selected value and bind it to the DataGrid. When a control inside a UpdatePanel will do a postback, the content of the UpdatePanel will be updated.

If you layout of you page don't allow a UpdatePanel around your combobox, you can instead add a async. postback trigger to the UpdatePanel that will listen to a control's event and update the panel.

Hi Thanks for the response. I placed as the gridview control in the updatepanel and used async trigger as you mentioned. when i changed the dropdownlist the grid doesnt appear at all.

Here is the script and code:

<

divID="Panel1"style="width: 568px; position: static; height: 180px; background-image: url(images/bg-nav.png);">

<spanstyle="color: #ffffff"><strong>

Select L :

</strong></span><asp:DropDownListID="DropDownList1"runat="server"Width="134px"AutoPostBack="True"OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged1"><asp:ListItemSelected="True"Value="1">yes</asp:ListItem><asp:ListItemValue="2">no</asp:ListItem></asp:DropDownList><br/><asp:UpdateProgressID="UpdateProgress1"runat="server"AssociatedUpdatePanelID="test"><ProgressTemplate><divstyle="color: #ffffff; background-color: transparent"><imgsrc="images/indicator.gif"/>

Updating ....

</div></ProgressTemplate></asp:UpdateProgress><asp:UpdatePanelID="test"runat="server"><ContentTemplate><asp:GridViewID="GridView1"runat="server"ForeColor="Silver"BorderColor="LimeGreen"BorderStyle="Inset"AutoGenerateColumns="True"><AlternatingRowStyleBackColor="LightSkyBlue"ForeColor="#404040"/></asp:GridView></ContentTemplate><Triggers><asp:AsyncPostBackTriggerControlID="DropDownList1"EventName="SelectedIndexChanged"/></Triggers></asp:UpdatePanel>

Code:

ProtectedSub DropDownList1_SelectedIndexChanged1(ByVal senderAsObject,ByVal eAs System.EventArgs)If DropDownList1.SelectedValue = 1ThenDim myDataSetAsNew DataSet()

myDataSet.ReadXml(Server.MapPath(

"test1.xml"))

GridView1.DataSource = myDataSet

GridView1.DataBind()

ElseDim myDataSetAsNew DataSet()

myDataSet.ReadXml(Server.MapPath(

"test2.xml"))

GridView1.DataSource = myDataSet

GridView1.DataBind()

EndIf

EndSub

When i give wrong XML File name, it comes up with the message saying that it cant find the xml file. Is it something i missing in grid control?

Any help much appreciated?

I copied your code, created 2 example XML files, and everything worked fine for me. When I select a value the GirdView was displayed with the correct XML file.

Hi Fredreik

Can you post your sample XML files? I tried using without AJAX functionality and its working fine :(

thanks

I can't think it has anything to do with your XML files, btw do you use the ASP.Net Ajax version 1.0 RTM, becuase your code runs on my machine with no problems at all so I can't see why it shouldn't work on yours.. maybe you have some more code that I don't have.. I only copy the code you posted.. mabye you do something in code-behind etc..!?