MVC :: How To Do Handle Editable Grid With Textboxes
Sep 21, 2010
Is there any sample shows the best way to create an editable grid with textboxes, so when user clicks on the save button, the entire grid's textboxes are posted back to controller and bind to its model? I prefer not using any 3rd party grid such the one comes with MvcContrib.
In a ASP.NET application I have a paging RadGrid which shows up textbox in each row. Outside the grid, there is an OK button to save the content of all the textbox. If user changes text in any one or more of the textbox and without clicking on the "OK" button, tries to move to a different page number (of the grid by clicking on the page number), he should be prompted for confirmation of save or cancel the changes.
I am guessing that one can write a Javascript function which would look for any form input control (textbox in my case) and detect changes and If there are changes, would prompt the user. However, I am not sure where I can call this function from?
I am using RadGrid but I guess this should be applicable to GridView as well.
I need to save the marks in database for each student...I have one drop down list..In this drop down contain 2 std 3 std 4 std, etc..if the user click 2 std ,2 std subjects are display in the grid with textbox for marks upload...If the user click 3 std, 3 std subjects are display in the grid with textbox...and also save the entered marks into database..and i need to edit the marks.
I've seening quite a few posts on here regarding grids, but nothing specifically asking for a free grid component that supports editing. Has any body come across such a thing? Is there a JQuery pluggin that I could use? If not has anybody got any pointers on a good approach to writing my own (using asp.net mvc2 and/or jquery)?
a customer asked me for a web app, written in ASPNET, that can use an editable grid (that works with a SqlServer DB) in the similar manner as Excel works; i can use gridView with Edit link in every row but i wanted to know if there are better solutions (possibly free..) that i can use.
I am in need of a very simple grid which the user should be able to edit very quickly. The grid will display a list of food items (name and price) that make up a menu.
My usual approach here is just a GridView bound to a collection of the food items with an Edit button to the left of every row. When the Edit button is clicked I navigate to an Edit page where the user can edit that item and click OK to save it to the database and then go back to the grid page, where the grid is reloaded and shows the edited item.
This approach however is much to slow, the user should be able to edit the grid much more quickly, ideally without posting back (either fully, partially or via ajax).
What I'm thinking is really simple, but I don't have the necessary javascript skill to create this...:
A UserControl that simply creates a new row of TextBoxes for every food item (along with maybe a Delete button). The 'grid' is thus always in 'edit mode' (it always shows the textboxes in every row) and the user can type in any textbox to change the name or price. When this change is made, nothing happens server side, yet. When the user presses Save, I finally run a save method that just checks all rows and saves the new values to the database.
Since the grid is so simple (just Name and Price and the underlying data has a unique Id as well obviously) I think this should be possible, but I wouldn't know how to create this...
I did try, I had a UserControl 'MenuGrid' that was nothing but a PlaceHolder (and two labels for the 'Name' and 'Price' menu headers). It has a DataSource property that I set to a collection of food items in the menu, and then for each of those food items I add a MenuGridRow (another UserControl) to the Placeholder. This MenuGridRow contains two TextBoxes and the Delete button. It also contains a HiddenField control that gets the Id of the food item.
Loading works fine, I can get all the data in this 'grid', but I don't see any way to save it back. Once I changed the items and want to Save on the server, I don't see any way to access the MenuGridRows from the MenuGrid (let alone accessing the TextBoxes on that in turn). I think the problem is that it's all just rendered to html and during runtime there is no such thing as a MenuGrid or MenuGridRow anymore. So all I have is a couple of TextBoxes with seemingly random names and there's no way for me to determine which Textbox belongs to which HiddenField (which contains the Id).
Also, I don't see any way to handle the deleting of a row; I was thinking to just run some javascript that deletes the MenuGridRow from the MenuGrid, but again same problem, there's no such thing as a MenuGridRow at that point and I'd have to figure out which TextBoxes and HiddenField belong to that row and then delete them via javascript.
I tried looking for an editable ajax enabled grid as well, so I don't have to do it all by myself, but I didn't really find anything useful. Most of the grids I found don't even work properly, some work but are still very slow (there's still a postback, they just put the grid in an UpdatePanel but that doesn't make it any faster).
I have a page with one dropdownlist and one grid. when dropdownlist's selected index is changed i generate a BindingList with some data based on the dropdownlist's selected value. this BindingList is binded to the GridView with one readonly column (eg: Item) and one column for entering data (eg: qty).
i need the Qty column to directly editable (without pressing edit, then goes to edit mode). and update this values back to BindingList's corresponding Item when the qty cell's focus is changed.
I am using Gridview and on that data is binded conditionally.the problem is that at the time of editing whole row of the grid is in editable mode and i want only few of the columns editable. my code is as follows
Note: Code is taken from this tutorial [URL] I currently have an editable gridview with only some columns editable by the user. In the background I want to record the time/date they have saved the data to the grid. This column 'Time' is not bound to the grid. Is there anyway I can still include this update when rebinding the newly edited data?
I'm also having a problem saving the updated data of my column ActivityTotal. I've been debugging that and following the variable, and it holds the correct value, but just doesnt seem to update. I am providing the codes below for both my gridview and the cs behind and would be grateful if someone could take a look, I assume it's a sort of minor sql issue on my part.
code
protected void UpdateButton_Click(object sender, EventArgs e) { originalDataTable = (DataTable)ViewState["originalValuesDataTable"]; foreach (GridViewRow r in GridView_ABC.Rows) if (IsRowModified(r)) { GridView_ABC.UpdateRow(r.RowIndex, false); } // Rebind the Grid to repopulate the original values table. tableCopied = false; GridView_ABC.DataBind(); }
I am building a retail shopping website and want multiple db records per row - e.g. 2 records per row side by side. Each record will have an image, a couple of labels from the database to state Item title / name, description etc and I need to add a textbox for the quantity. In clothing section a radio button for size and another textbox for item colour. I will then add a button (any button) to gather the info (recordID and textbox input) and take me to the shopping cart.
Problem: In ListView I get the multiple records but can't get the data from the textboxes: In Gridview I can get the textbox data but can't get multipe records per row.Which grid should I use to get both of these features working?
I have a repeater which is binded using a Collection of Entity Data Framework.
Once the repeater is binded using the datasource, the user can control the no of rows present in the repeater using a Dropdown list on the page. For ex: if datasource has 2 rows, user want to add 3 more rows, user selects 5 from dropdown, which adds 3 additional rows to the Repeater. I am able to do this.
The repeater has textbox controls in each row. Now once the user enter the values in this textbox of the newly generated rows, the user can save the values entered with the no of rows specified.
I have a button which is outside the repeater and on click of this i need to validate all the textbox values and save them into dB accordingly.
Here is my code
Repeater.aspx
[Code]....
[Code]....
Repeater.aspx.cs
[Code]....
Right now the problem is im not able to fetch the values of the textboxes present in the newly generated rows.
I've done this using bound controls like Repeaters etc but now I need to display information about a single file for example. SO i will pass the fileid in the querystring, then I need to populate some textboxes, autocomplete textboxes etc. and then save changes. what's the most efficient way of doing this?
Problem in YUI:I am using YUI grid,my dataset contains some special character.i bind my dataset into the grid,but its not displayed in my grid? how to solve this
I enable Caret browsing in IE8 (press F7) and then this field becomes editable, though the text is grayed out and consequently gives a wrong feeling to the user that the field is editable. This does not happen if I mark the textbox as readonly, but I do not want to mark it as a readonly field. how to have the textbox in disabled mode when in Caret Browsing.
Edit1: I am not looking for a solution which would change IE settings/registry, am looking for a programmatic solution as my site is a public facing website
Edit2: View states are enabled for the page and for the controls
I have a few field in my entity that i wish to be non-editable. Looking in the docs it seems like "EditableAttribute" would do the trick. However this is only 4.0Just wondering if there are other attributes that would have the desire effect. So be clear, i have a field called "DateRegistered" i wish to display this as string not text field using "Html.EditorFor"
How to make exported .XLS file Editable Thid code makes .XLS File Read Only
:( using System; using System.Data; using System.Configuration; using System.IO; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; public class GridViewExportUtil { /// <param name="fileName"></param> /// <param name="gv"></param> public static void Export(string fileName, GridView gv) { HttpContext.Current.Response.Clear(); HttpContext.Current.Response.AddHeader( "content-disposition", string.Format("content-disposition", "attachment; filename={0}", fileName)); HttpContext.Current.Response.ContentType = "application/ms-excel"; HttpContext.Current.Response.Cache.SetCacheability(HttpCacheability.NoCache); HttpContext.Current.Response.Charset = System.Text.Encoding.Unicode.EncodingName; HttpContext.Current.Response.ContentEncoding = System.Text.Encoding.Unicode; HttpContext.Current.Response.BinaryWrite(System.Text.Encoding.Unicode.GetPreamble()); using (StringWriter sw = new StringWriter()) { using (HtmlTextWriter htw = new HtmlTextWriter(sw)) { // Create a form to contain the grid Table table = new Table(); // add the header row to the table if (gv.HeaderRow != null) { GridViewExportUtil.PrepareControlForExport(gv.HeaderRow); table.Rows.Add(gv.HeaderRow); } // add each of the data rows to the table foreach (GridViewRow row in gv.Rows) { GridViewExportUtil.PrepareControlForExport(row); table.Rows.Add(row); } // add the footer row to the table if (gv.FooterRow != null) { GridViewExportUtil.PrepareControlForExport(gv.FooterRow); table.Rows.Add(gv.FooterRow); } // render the table into the htmlwriter table.RenderControl(htw); // render the htmlwriter into the response HttpContext.Current.Response.Write(sw.ToString()); HttpContext.Current.Response.End(); } } } /// <summary> /// Replace any of the contained controls with literals /// </summary> /// <param name="control"></param> private static void PrepareControlForExport(Control control) { for (int i = 0; i < control.Controls.Count; i++) { Control current = control.Controls[i]; if (current is LinkButton) { control.Controls.Remove(current); control.Controls.AddAt(i, new LiteralControl((current as LinkButton).Text)); } else if (current is ImageButton) { control.Controls.Remove(current); control.Controls.AddAt(i, new LiteralControl((current as ImageButton).AlternateText)); } else if (current is HyperLink) { control.Controls.Remove(current); control.Controls.AddAt(i, new LiteralControl((current as HyperLink).Text)); } else if (current is DropDownList) { control.Controls.Remove(current); control.Controls.AddAt(i, new LiteralControl((current as DropDownList).SelectedItem.Text)); } else if (current is CheckBox) { control.Controls.Remove(current); control.Controls.AddAt(i, new LiteralControl((current as CheckBox).Checked ? "True" : "False")); } if (current.HasControls()) { GridViewExportUtil.PrepareControlForExport(current); } } } }
problem is I have a table with rows and columns. I would like to update each row independently without the entire table gets updated. Basic problem is UpdatePanel can only be applied to column level rater than row level. If I add updatepanel with in each column with updatemode as conditional, then the event associated to the drop down list was not able to update controls outside the column like enabling another dropdown box outside updatepanel within same row and add items to it.