I am binding data in a DataTable to a GridView.
The result is a simple table with 5 columns and 3 rows.
What I want to achieve is:
If an user clicks on a cell in the GridView, the selected cell should become editable (with a textbox). In that textbox the user should have to possibility to enter new value and save it to the database.
What I've achieved so far is:
I followed this tutorial: http://www.dotnetlogix.com/Article/aspnet/80/How-to-make-GridView-Individual-Cells-Selectable.html
I managed to make the cells clickable, when clicking the cell the background color becomes red:
With that tutorial I also managed to get the ColumnIndex and RowIndex.
So I was able to do: GridView.SetEditRow(RowIndex);
Then my result became:
This is almost what I want, but not 100%. The SetEditRow edits the whole row, but I need to edit the clicked cell which is based on a row and column index.
Can anyone help me further please?
I've followed some other tutorials as well, but without result.
I tried this a few years ago and ran into a few issues, I don't recall all of them off the top of my head right now. What I ended up doing was using a repeater instead of a gridview to build a table. Since I'm writing the HTML I have more control over things. The table contained both a dig tag for the static value and a text input for the edit value. I used jquery to show and hide when needed. I then used ajax to post the changes back. This was a lot of work, but it ended up working out ok. Hope this helps.
Related
Hello after having spent two days looking for a solution for this problem I give up.
I need to point the contents of a datatable to an asp control: DataGrid
this is the controller:
And the code that should be filled is the following:
I would appreciate all the help you can give because when I run the code it does load the datagrid but creates 2 more columns, plus I have to hide the ID column because the user should not observe this.
Below you can see an image of the grid
I have records that are displayed on a page and I have a small "edit" icon on the very right of each row.
So when I click the icon I want the user to edit "selected" row.
Now, I am generating the records and images behind code! so i am not using a control it generated a html code then i do something like this
output.InnerHTML = generatedCode;
Question, how can i create a function to determine which icon has been clicked and also that id of that icon?
If you are doing this with tables you must generate some unique id for each row edit link so that you can identify which row you have to edit. Apart from this there are pretty much easy way to display records in asp.net i.e GridView
I'm trying to create an ASP.NET/C# page that allows the user to edit a table of data, add rows to it, and save the data back to the database. For the table of data, I'm using a DataGrid whose cells contain TextBoxes or CheckBoxes. I have a button for adding rows (which works) and a button for saving the data. However, I'm quite stuck on two things:
The TextBoxes and CheckBoxes should retain their values on postback. So if the user edits a TextBox and clicks the button to add more rows, the edits should be retained when the page reloads. However, the edits should not be saved to the database at this point.
When the user clicks the save button, or anytime before, the DataTable underlying the DataGrid needs to be updated with the values of the TextBoxes and CheckBoxes so that the DataTable can be sent to the database. I have a method that does this, but I can't figure out when to call it.
Any help getting this to work, or suggestions of alternative user interfaces that would behave similarly, would be appreciated.
Take a look at the ASP.NET GridView control. It's newer than the DataGrid and has editing features, editing events, etc built in.
Check out the following website:
http://highoncoding.com/Categories/7_GridView_Control.aspx
There are tons of articles on the above link about the GridView control.
I have been given a mockup that I do not know is possible to code in ASP.NET without being a real html and javascript wizard.
I want a GridView that when a row is selected, the selected row expands and below the selected row a panel of additional information is shown, which would also include another small GridView. The idea is this would all be in-line. So if the user selected row 4, then the additional information would appear below row 4 and then after the additional information the parent GridView would continue with row 5.
Ultimately I would want to do a multi-select type of set up, but first I need to figure out if this is even possible. Also, the solution must be 508 Compliant
The one solution I considered was using only one "column". Then I would put all my fields in the ItemTemplate, and my detail panel content in the EditItemTemplate and instead of selecting the row, set it to edit mode. The problem with this solution is I lose the functionality of multiple columns if I throw everything in one huge ItemTemplate.
Any and all suggestions or ideas are appreciated.
What you're describing would be best fulfilled with a ListView control. It takes a little more templating work to set up than a grid view, but you have much more control over it and you can emulate the look of a GridView. You would set your Selected Item template to contain another ListView (or GridView) thats bound to your detailed data.
I've done this using a gridview inside a ListView and using ajaxcontroltoolkit collapsible panel
Your parent list would be a listview that would have 2 table rows for each item, on the first row your parent column, on the second row use colspan and add a gridview wrapped on a collapsible panel
i want to know how to edit a single row (which i select) from a data grid
for example i have a datagrid with columns A, B and C
and i have a couple rows of data, approx 10 rows.
lets say i want to change the value of data within row 4.
how would i do this?
i am using visual studio 2003, but i guess if visual studio 2005 would be okay too. for the coding I'm using c#
thanks..
All grid-like components of asp.net have the same machanism as it comes to starting to edit a single row. Actually it's default for asp.net only to edit a single row in a grid.
Needed to start editing is to include asp:button or asp:linkbutton in the ItemTemplate with the CommandName set to "Edit". This one of reserved commandnames all grid-like components knows how to respond to. Clicking this button in DataGrid will raise the EditCommand Event. In this event you have to set the EditItemIndex of the grid equal to Item.Itemindex of the eventargs. This will render the row vaccordeing to the EditItemTemplate.
In this template you put 2 buttons or linkbuttons. One should have the CommandName set to "Update" and one should have the CommandName set to "Cancel".
The "Update" button raises the UpdateCommand event. In which you execute code that store the data in the row to its storage (eg.: database) and sets the EditItemIndex to -1 --> all rows are rendered read-only(ItemTemplate or AlternateItemTemplate).
The "Cancel" button raises the CancelCommand event. In the event handler you have to do si set the EditItemIndex to -1.
This description is only true for DataGrid en not for the in asp.net introduced GridView which handles most of this "Boilerplate"code it self working together with the datasource controls. Google the web for more info on this. it's to much to explain here right now.
Hope it helps?
Take a look at the documentation for adding an EditItemTemplate to your datagrid. You use the ItemTemplate for view-only, display elements and you use the EditItemTemplate for controls used to bind against a single row that you select.
Here's a link that might help:
http://www.gridviewguy.com/
Is your data in a DataTable before making it a DataGrid, or can you put it in a DataTable? You can update/delete/edit rows in a DataTable, here's a link with code snippets, pretty straight forward:
http://msdn.microsoft.com/en-us/library/tat996zc(VS.80).aspx