Load Me ASP.NET MVC 5 AJAX - Alaeddin Alhamoud

Load Me ASP.NET MVC 5 AJAX

السلام عليكم ,

في المثال التالي سوف نحاول استخدام AJAX مع ASP.NET MVC , واظهار موشر مشغولية المعالج , في اثناء تنفيذ اي عمليه.

 public class EmployeeController : Controller    {        private readonly IEmployee _Employee;        public EmployeeController(IEmployee employee)        {            _Employee = employee;        }        // GET: Employee        public ActionResult Index()        {            return View();        }        [HttpGet]        public ActionResult GetEmployees()        {           return PartialView("_GetEmployees", _Employee.GetEmployee);        }    }

Index Pege :

@{    ViewBag.Title = "Index";}<link href="~/Content/loadme.css" rel="stylesheet" />@{    var options = new AjaxOptions()    {        UpdateTargetId = "DivContent",        InsertionMode = InsertionMode.Replace,        HttpMethod = "Get",        OnBegin = "onLoadBegin",        OnSuccess = "onLoadSuccess"    };}<br/>@Ajax.ActionLink("Employees", "GetEmployees", "Employee", options,new { @class = "btn btn-primary" })<hr/><div id="DivContent">    Your PartialView Will be here. </div><div id="divLoading" style="display:none">    <div class="loadmeRect">        <div class="loadmeRectChild loadmeRect1"></div>        <div class="loadmeRectChild loadmeRect2"></div>        <div class="loadmeRectChild loadmeRect3"></div>        <div class="loadmeRectChild loadmeRect4"></div>        <div class="loadmeRectChild loadmeRect5"></div>    </div>    <div class="loadme-mask"></div></div>

partial View

@model IEnumerable<TestLoadMeAjax.Models.Employee><p>    @Html.ActionLink("Create New", "Create")</p><table class="table">    <tr>        <th>            @Html.DisplayNameFor(model => model.Name)        </th>        <th>            @Html.DisplayNameFor(model => model.Gender)        </th>        <th>            @Html.DisplayNameFor(model => model.Salary)        </th>        <th></th>    </tr>@foreach (var item in Model) {    <tr>        <td>            @Html.DisplayFor(modelItem => item.Name)        </td>        <td>            @Html.DisplayFor(modelItem => item.Gender)        </td>        <td>            @Html.DisplayFor(modelItem => item.Salary)        </td>        <td>            @Html.ActionLink("Edit", "Edit", new { id = item.Id }, new { @class = "btn btn-warning" })|            @Html.ActionLink("Details", "Details", new { id=item.Id }, new { @class = "btn btn-warning" }) |            @Html.ActionLink("Delete", "Delete", new { id=item.Id }, new { @class = "btn btn-warning" })        </td>    </tr>}</table>

Code GitHub

Comments