Create/Edit Parent and Child Form MVC - asp.net-mvc

I am using C# and MVC3
I have a simple Entity Model
Entities: Orders , OrderItems
Orders have 0 or more Order Items
I want to create a single page to create an order
While on this Page I would fill in the fields that are in the Orders table (Customer, Phone, Order Number...etc)
Then there would be a grid (I am using Telerik MVC grid). I want to add OrderItems to this grid. I was thinking of having s small form above the grid with its own submit button. I can submit using ajax and refresh the grid using ajax.
At the bottom there would be a single submit button that coudl create the order and all the orderitems at once.
I can't seem to piece this enitre solution together.

Short answer: follow this post - how to implement Create action on Order and Order Details on single Create View
Basically, convert your code to partial views in your main view. Also separate order entry form from displaying the order list. Also you may find useful to look at this resource - Empty Model with Partial View

Related

Telerik mMVC master detail grid view for two unrelated models

I need to display/present two different models in a master-detail grid.
One model(collection) is bound to master grid.It has a link in one of the column and is enabled/disabled based on condition. Simple.
What I need to do is upon clicking the link I should be able to populate the detail grid by calling another controller- action. I need the row information,to pass the row details/ model data to the controller-action to fetch the model for detail grid.How do I do this through Javascript/jQuery.
The detail model is not a collection.
Any other approach to achieve this?
http://demos.telerik.com/aspnet-mvc/razor/grid/detailsajax gives a great example on how to do this with AJAX. I am assuming you are using the MVC Extensions by Telerik?

Best Practice, render same partial multiple times, similar id issue

I have a master-detail-master-detail (order header-> order details-> work order header->Work order details) relationship that I want to show on a single page. I have a standard form to start with the order header, then a series of kendo ui tabs, one for each order detail. Within the tab, I display a partial view showing a nested master detail relationship showing the Work Order Header (form) and Work order Details (grid).
The problem with this is that since the partial is being generated multiple times on the same page, you have non-unique element ids.
All in all, it works, except that it violates non-unique Id rules and since I have some kendo widgets in the partial, they don't work because of this.
So just wondering what is the best way to handle this? I suppose you could put a suffix on each Id, and then capture the form submit and strip the suffix off before the form is submitted to the controller...
Are there any other ways?

Divide a user interface into asp.net mvc views

I have a CSS #MainDiv containing a #TreeDiv on the left side and a #DataGridDiv on the right side.
The TreeDiv contains a Javascript Treeview with Department objects and the DataGridDiv
contains a Datagrid with Employee objects.
Changing the selection of a Department in the Treeview should change also the related employee objects in the DataGrid.
I have setup a DepartmentController. Both controls should be able to recieve data via ajax
independently from each other.
1.) What kind of object should my Index method return to display this aggregated data in the view?
2.) How should I divide my controls into what sort of views?
2.) How should I divide my controls into what sort of views?
Create a view with #MainDiv, #TreeDiv and #DatagridDiv. Let #TreeDiv host your tree control (You already know this). Create a partial view to display the datagrid with employee objects. Let #DatagridDiv host this partial view.
Now when a department is selected in tree control, you can make an ajax call to a controller method which accepts the department and returns the partial view containing the employee data. Update the #DatagridDiv with returned data.
Alternatively if you are comfortable with Json, your controller method could return the employee data in Json format (instead of partial view) and You can populate this into an html table inside #datagridDiv using javascript/jquery.
1.) What kind of object should my Index method return to display this aggregated data in the view?
In the Index method you can return your view which contains all 3 Divs and #TreeDiv populated with tree control. On the client side when page loads you can identify the selected department to make an ajax call and update #datagridDiv. This approach will have a it lag on the clientside, however you can use that to display some animation indicating the page is loading/div is updating.
If you dont want to add this lag period, identify the department that will be selected when tree view is loaded and populate the partial view for that department, add this to your #datagridDiv on the server side and deliver.

How To: Use MVC and Ajax to add / remove a row in grid for data entry + model binding?

I'm new to Ajax, but I think I know how to reasonably use MVC + model binding.
What I'm trying to do is to create an Add button (or Ajax.ActionLink) to add a new row in my grid for data entry. Example: Think of a typical Order entry system with Order (header) and Product (items). My OrderViewModel contains an "Order" object, and the Order object contains a collection List.
The way I plan to do this is that my View render the grid in a PartialView, and the PartialView is a simple for-loop to create the table tags from the List. I will use the default model binder (for collections).
Anyone have suggestions on how to do this?
I've already figured out how to do this using jQuery, but I want (i think I want) to try and use Ajax so that I can add my custom business logic (e.g. like setting defaults, translations, etc.)as opposed to do this client-side.
In other words, I want to do do something similar to what the Telerik grid does with its Ajax Editing with the Add/Remove link/buttons.
Tips and sample code would be greatly appreciated.
One of my challenges, and not sure if I'm going down the wrong way, is that I don't know how to pass back the model back to the Controller Action from the Ajax submit. When I look at Telerik's code, it looks like they store the persisted items in HttpContext.Session, and this is exactly the reason why I don't want to use their grid.
Thanks.
They might choose the session repository storage for demonstration purposes. If you transform the logic from their SessionProductRepository class for your model and implement identical Update/Insert/Delete methods for it, you'll probably get what you want.

Using a dynamic list of checkboxes in a view, how to create the model

I have an asp mvc 2 app lication where I want to display a list of check boxes that a user can select, based on a list of records in a database. To display the list my model contains a List object and the view has a foreach, and outputs Html.CheckBox for each item in the list.
Is there a way to get the model populated with the selected checkboxes, given that the model can't have specific properties for each checkbox, because the list is dynamic? Or do I have to manually iterate through the forms variables myself?
Edit: Extra details as per sabanito's comment
So in a simple view/model scenario, if my model had a property called Property1, then my view outputted a Textbox for Property1, when the form is posted via a submit button, the mvc framework will automatically populate a model with Property1 containing the text that was entered into the textbox and pass that model to the Controllers action.
Because I am dealing with a dynamic list of options the user could check, I can't write explicit boolean properties in my model and explicitly create the checkboxes in my view. Given that my list is dynamic, I'm wondering if there are ways to create my model and view so that the mvc framework is able to populate the model correctly when the form is posted.
Here's what I would do:
Are you having any issues generating the checkbox's dynamically?
If not, create a property on your ViewModel that is a:
public List<string> CheckboxResults { get; set; }
When you generate your checkbox's in the view make sure they all share the name = "CheckboxResults". When MVC see's your ViewModel as a parameter on the action method it will automatically bind and put all the "CheckboxResults" results in the List (as well as your other ViewModel properties). Now you have a dynamic List based on which checkbox's your user checked that you can send to your DomainModel or wherever.
Pretty cool stuff. Let me know if you're having issues generating the checkbox's dynamically, that's kind of a seperate issue than model binding to a list.
Use a ViewModel that reflects your view exactly, and map your domain model(s) to the viewmodel.
At first it often seems appropriate to use domain models directly in the view, for no better reason than that they're simple to use. However, as the view gets more complex over time, you end up putting a TON of conditional logic in your view, and end up with spaghetti. To alleviate this, we typically create a ViewModel that correlates 1:1 with the view.

Resources