StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>You are passing Emp as view model, which is not a dynamic object, so you should not use <code>dynamic</code> inside the view. I would use <code>@model List<Employee></code> in the view.</p> <p>Also, to load the content, you are performing <code>$(this).load("@Url.Action("Travel", "GetEmployee")");</code> which will send a GET request to your server, but you assigned the <code>[HttpPost]</code> attribute to your controller, so it won't serve a get request. I would remove the <code>[HttpPost]</code>.</p> <p><strong>UPDATE:</strong></p> <p>A better solution would be to create a ViewModel class like this:</p> <pre><code>namespace Travelmvc.ViewModels { public class EmployeeListViewModel { public List<Employee> Emp { get; set; } } } </code></pre> <p>In my projects, I like creating a ViewModels directory where I put all my view models. Some people simply put there ViewModels in the Models directory though. Depending on where you put your ViewModel, you will have to adjust the namespace above.</p> <p>You will also need to add the following line at the top of the controller file so that the controller knows about your ViewModels:</p> <pre><code>using Travelmvc.ViewModels; </code></pre> <p>Then you would use it like this in your controller:</p> <pre><code>public ActionResult GetEmployee() { var employeeList = new EmployeeListViewModel { Emp = new List<Employee> { new Employee { EmpName= "ScottGu", EmpPhone = "23232323", EmpNum="242342"}, new Employee { EmpName = "Scott Hanselman", EmpPhone = "3435353", EmpNum="34535"}, new Employee { EmpName = "Jon Galloway", EmpPhone = "4534535345345", EmpNum="345353"} } }; return PartialView("_EmpPartial", employeeList ); } </code></pre> <p>And your view would look like this:</p> <pre><code>@using Travelmvc.ViewModels @model EmployeeListViewModel <ul> @foreach (var employee in Model.Emp) { <li> @employee.EmpName </li> } </ul> </code></pre> <p><strong>UPDATE 2:</strong></p> <p>If you need to use a dynamic object to pass the data to the view, you can use the one that already exists and that is called ViewBag. Then your controller would look like this:</p> <pre><code>using Travelmvc.Models; public ActionResult GetEmployee() { ViewBag.Emp = new List<Employee> { new Employee { EmpName= "ScottGu", EmpPhone = "23232323", EmpNum="242342"}, new Employee { EmpName = "Scott Hanselman", EmpPhone = "3435353", EmpNum="34535"}, new Employee { EmpName = "Jon Galloway", EmpPhone = "4534535345345", EmpNum="345353"} }; return PartialView("_EmpPartial"); } </code></pre> <p>The using directive would actually go at the top of your controller file.</p> <p>And your view would not be strongly typed, and it would look like this:</p> <pre><code>@using Travelmvc.Models <ul> @foreach (var employee in ViewBag.Emp as List<Employee>) { <li> @employee.EmpName </li> } </ul> </code></pre> <p>In order for this to work, both your controller and your view will need to be aware of the Employee class, hence the <code>using</code> directives. You may need to adjust the namespace depending on where you put your Employee class. In the code above, I am assuming you put it in Models\Employee.cs:</p> <pre><code>namespace Travelmvc.Models { public class Employee { public string EmpName { get; set; } public string EmpPhone { get; set; } public string EmpNum { get; set; } } } </code></pre> <p><strong>UPDATE 3:</strong></p> <p>Here is the JavaScript I would use. I would perform the load before opening the dialog, and I would open it only if the load succeeded.</p> <pre><code>$(document).ready(function () { $("#GetEmp").click(function (event) { $("#popup").load('@Url.Action("GetEmployee", "Travel")', function (responseText, textStatus, XMLHttpRequest) { if (textStatus == "error") { alert("Error"); } else { $(this).dialog({ width: 200, hight: 400, title: 'please select an employee', modal: true }); } }); }); }); </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload