Bind gridview using javascript?

Question

Here is my scenario, I have implemented a gridview, when the user press the add button on the page a new row is generated with empty input texts using javascript, after that the user fill the inputs and press the save button, thus all values is sent as an object to a webservice which handles the data insertion. after that i want to refresh the grid, bind (refresh) my gridview and since i am inserting the data from a html button there is no postback. I know that when you access the gridview from javascript it renders as an HTML table is there a way i can bind data to it, Is there any solution ?

There is a solution that i think maybe will work but i will have to try it, which is empty the gridview table and construct again by adding each cell it. — yahya kh
– yahya kh, Commented Dec 7, 2011 at 14:12

dipak · Accepted Answer · 2011-12-07 14:23:09Z

2

this things depends on yous GridView structure, of course you can use HTML DOM model to modify it and insert new row at end of gridview. but there are lot of manual effort required to achieve this and more chances of bugs.

another approach could be use of UpdatePanel.

  <ajax:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional"> 
                            <ContentTemplate> 
                                    <asp:GridView ID="GridView" Visible="false" runat="server"  HeaderStyle-Width="200" HeaderStyle-BackColor="#2B6292" HeaderStyle-ForeColor="White"  
                                    AllowSorting="true" AllowPaging="true" Width="600" AutoGenerateColumns="False" OnRowCreated="GridView_OnRowCreated"  
                                    DataKeyNames="Id" onsorting="GridView_OnSort"> 
                                            <Columns> 
                                                    ... 
                                            </Columns> 
                                    </asp:GridView> 
                            </ContentTemplate> 
                            <Triggers> 
                                    <ajax:AsyncPostBackTrigger ControlID="CreateButton"/> 
                            </Triggers> 
                    </ajax:UpdatePanel>

please refer to http://blogs.microsoft.co.il/blogs/dorony/archive/2008/05/23/using-updatepanel-to-disable-gridview-view-state.aspx for more information.

answered Dec 7, 2011 at 14:23

dipak

2,0332 gold badges17 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

yahya kh Over a year ago

I actually would like to use HTMl, but i am at how to retrieve an array of objects to an array object in javascript. whenever i retrieve the data it says object undefined. students = GetAllStudents();

dipak Over a year ago

is it possible to post code, where you making ajax request and webmethod which returns GetAllStudents? basically there is .d or .data property which is array of students.

yahya kh Over a year ago

i made a question regarding it: stackoverflow.com/questions/8429363/…

Collectives™ on Stack Overflow

Bind gridview using javascript?

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related