I am wanting to edit a number of rows in a model in a grid. I would really like to be able to edit "inline" ie within the grid rather than going off to another page via another controller.
I know about the "Web Grid" which seems lean, but I believe it needs to go over to an edit page.
In the first instance I am wanting to focus on server solutions for simplicity. Also I would want the control to respect the validation data annotations in the View Model.
Many thanks,
Ed
You can render your own grid for a table of data and include a form within it to allow the user to edit a particular row. You will need to implement typical grid features to control this process, such as row selection, insert, edit, update and possibly delete. There are plenty of good models from Web Forms world you could work to, including but not limited to MS and Telerik controls.
If you are going to make extensive use of such grids in your applications I would recommend wrapping up this functionality in an HtmlHelper extension that accepts a table of data and the configuration options you need as arguments.
http://datatables.net/ is a very good jQuery grid. Try it out.
also other options
kendo: http://demos.kendoui.com/web/grid/index.html
jqgrid. http://jqgrid.com/
Related
i am new in mvc. i want to generate a UI dynamically like
initially a table will be displayed with four columns and 5 rows. in first & second columns there will be dropdown with predefine values and in last column there will be textbox. there will be a button called add more and when user will click on that button then a postback will occur and a new row will be added to that existing column. user can remove any column just clicking on another button which will be in fourth column.
it is very easy to do it in webform with gridview but i have no idea how can i do it in mvc. i do not want to use any js library or grid rather i want to do it with html table which i will generate dynamically. please help me with concept & sample code snippet if possible. thanks
I cant see here something really connected with mvc.
The case is that you would like to have an interactive UI, that basically is the job of Javascript.
If we are talking about grids, it can be next plugins/frameworks:
Kendo UI (not free for commercial use) - http://demos.kendoui.com/web/grid/editing.html
http://jquerygrid.net/
A lot of good plugings are here: Choosing a jQuery datagrid plugin?
So basically this is the same (like) Grid View from asp.net.
If you wanna have something exactly like GridView - I think there is no native implementation (from Visual Studio) for this (maybe i'm wrong, but 4 year experience say to me that i'm right :) ).
I have an edit form in MVC. It contains different fields and 3 different partial views which is used like usercontrols. The scenario in these partial view: they contain a list with edit and delete plus an add button that when these buttons click a dialog box pop ups which contains a few related fields.
My main question is that what is the best solution to temporary save the changes of the lists(like viewstates)?
I'm asking because the main edit page contains more fields and I want in the case that the save button in the form is pressed, the whole data can be saved in database!(the tables in partial views has foreign key of the table of the main page).
Thank you in advance!
The web is stateless in its nature. Instead of looking for a workaround on the whole ViewState thing, it's better to try and embrace the medium you're using.
If you have many controls rendered on the same page you can either:
Use HTML5 Local Storage and persist on the client before submitting the whole form. There are many frameworks that will help you persist a form on the client side like Sysyphus.js
Make use of asynchronous ajax calls if you need to persist data on user input before submitting the whole form. Client-side calls can be managed using jQuery's ajax() function with ease and you can make use of the ASP.NET Web API to build the end-point on the server.
Is it practical to use the jQuery UI Autocomplete as a base for a control that is functionally equivalent (in terms of the search functionality, results returned, etc...) but that displays the results in a fundamentally different way. I suspect the details of what sort of display don't really matter here, not a single column vertical list at any rate, but I can edit if people think that those details matter. The main issue is, is it reasonably easy to override the display mechanism without altering the jQuery UI source?
Thanks,
Matthew
#Matthew, while I am not sure how much it applies to what you are trying to do, as I do not know your end game, angularjs and angularUI are both pretty useful for doing filtering on data based off a text field. You can organize it in pretty much any fashion you want and tie it to a variety of data sources.
I've used it in place of auto complete on product listing pages to help filter down without page re-loads.
MVC practically begs to create pages that are organized into clear areas of responsibility. So instead of a single page with two or three editable grids that allow in-line changes to their lists, in MVC one is more likely to get a specific edit page per line item per grid.
For that matter one is very unlikely to see the type of page that has multiple editable grids thrown on it. Is there a good UI pattern to take the place of multiple editable lists/grids on a classic asp.net page?
I am guessing there would be some sort of taxonomy with categories of editable "stuff" that's displayed in a sidebar (perhaps) which then leads to a page with one grid grid or list per entity type. And clicking on an edit per line item would drill down further into a detail edit page.
I am mainly curious if anyone has seen good UI examples that simplify the taxonomy and organization of these lists. Most likely this sort of paradigm is found in administrative parts of sites I suspect.
StackOverflow is the best example I know of. It uses tags as the taxonomy organization metaphor, gives you lists based on these tags, and then allows you to drill down into any one item (which itself contains lists of items).
Platforms, such as ASP.NET webforms or ASP.NET MVC are really means to an end here. They shouldn't set the UI paradigm, they should just help you get there.
There is no reason you couldn't have multiple grids on a page. With MVC you can also have multiple forms on a page. And if you do things right you will most likely use the concept of subcontrollers to build out your page areas to make your over all site easier to work with. You can post grid updates to an ajax handler. You could possibly submit multiple grid data to one controller if you wanted too...and then farm out the work of saving it. There is no reason to not have pages like you used too. MVC just requires that you are more creative with how you handle processing the data to keep things clean!
In our old system we had pages rendered from XSLT. In order to change the page into "edit" mode we would have a button of some sort, once clicked would have an EditYN flag which would be passed to the stored procedure. The stored procedure would simply give this variable back to indicate that the page was in edit mode. This meant that query strings, viewstate or session data were not required to indicate that the page is in edit mode.
I've been dealing with ASP.NET MVC only for the last week for RND purposes at work. I'm wondering what's the best way to have a page which displays data, to then turn into a page where you can edit all of that data? Should you move to a separate page? Should you stay on the same page and have rendering logic in the view to show the edit mode of the page?
Whilst on the same topic, I thought I'd also ask about GridViews and their place in the MVC architecture. Beforehand we'd simply use data sources and set them up with the GridView. Then the GridView could enter edit mode quite easily by itself with the UPDATE query set in the data source. How should this process be done using MVC?
Make a submit button for your edit mode. The controller action will respond to POST, set the "InEdit" flag in your model, then return the same view again. The view can then render based on the flag. But I would rather create two different views, for view and edit modes, then based on the flag analysis done in the controller action just return the one or the other view.
Whilst on the same topic, I thought
I'd also ask about GridViews and their
place in the MVC architecture.
How should this process be
done using MVC?
You can use javascript, something like jqGrid or Yahoo´s datatable. For simpler datatables, you can use jQuery´s tablesorter.
On the backend, your controller returns json objects that can be modified by the client, ie. the javascript grid which then sends the data back to the controller to be saved.