CODEWITHSUNDEEP
c#asp.net-mvcentity-framework
Niranjan
Niranjan

Reputation: 99

Create Viewmodel to post data and display data in mvc 4

I am creating one form. I have viewmodel.I have one form there i have client_id,Emp_id and submit button. When the submit button clicked, below i want to display some data. This is my view model.

public class GroupVM
{
    public string Name { get; set; }
    public IEnumerable<MyItem> Items { get; set; }
}
Public class MyItem
{
public string client_id {get;set;}
public string emp_id {get;set;}

public string Label { get; set; }
public string Value { get; set; }
public string Emp_id { get; set; }
public string Name { get; set; }
}

Currently this is view code.

@model IEnumerable<GroupVM>
@foreach(var group in Model)
{
    <table>
        <thead>
            <tr>
                <th>Name</th>
                @foreach(var item in group.Items)
                {
                    <th>@item.Label</th>
                }
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>@group.Name</td>
                @foreach(var item in group.Items)
                {
                    <td>@item.Value</td>
                }
            </tr>
        </tbody>
    </table>
}

In this view i want textboxes for client_id and emp_id. Now problem is if i put @model IEnumerable in view header i cant put textboxes for client_id and emp_id. So should i change my viewmodel? When i click on submit button, based on emp_id and client_id i have written query to get data and it will bind to model. This is my controller code to bind data to model.

public ActionResult Test()
{
    var table = new List<MyItem> {
        new MyItem { Label = "DocumentNumber", Value = "12345678", Emp_id = 1, Name = "First" },
        new MyItem { Label = "ExpiryDate", Value = "1/1/2015", Emp_id = 1, Name = "First" },
        new MyItem { Label = "IssueLoc", Value = "India", Emp_id = 1, Name = "First" },
        new MyItem { Label = "DocumentNumber", Value = "SecondValue", Emp_id = 2, Name = "Second" },
        new MyItem { Label = "ExpiryDate", Value = "SecondValue", Emp_id = 2, Name = "Second" },                
    };
    var data = table.GroupBy(x => x.Name).Select(x => new GroupVM
    {
        Name = x.Key,
        Items = x
    });
    return View(data);
}

Upvotes: 0

Views: 97

Answers (1)

user3559349
user3559349

Reputation:

You need another view model with contains the properties for client_id and emp_id and a collection of GroupVM

public class SearchVM
{
    public string ClientID { get; set; }
    public string EmployeeID { get; set; }
    public IEnumerable<GroupVM> Groups { get; set; }
}

and in the view

@model SearchVM
....
@using (Html.BeginForm("Test", "Home", FormMethod.Get))
{
    @Html.TextBoxFor(m => m.ClientID)
    @Html.TextBoxFor(m => m.EmployeeID)
    <input type="submit" value="Search" />
}
@foreach(var group in Model.Groups) // change
{
    .... // as before
}

and change the Test() method to

public ActionResult Test(string clientID, string employeeID)
{
    // filter your data based on the parameters, for example
    var data = table.Where(x => x.Emp_id == EmployeeID).GroupBy(x => x.Name).Select( ..... );
    SearchVM model = new SearchVM
    {
        ClientID = clientID,
        EmployeeID = employeeID,
        Groups = data
    };
    return View(model);
}

Side note: Using a textbox for entering an ID property does not seem appropriate and you should consider using a dropdownlist that renders the names of each Employee (but posts back the ID value). You can also consider using ajax to to post the values to a controller method that returns a partial view of the table and update the DOM without leaving the page to improve performance.

Upvotes: 1

Related Questions