Awesome ASP.net Core and MVC Controls

AjaxList CRUD demo


AjaxListDemo/Crud.cshtml
@{
var ajl = "DinnersList1";
}
@Html.InitCrudPopupsForAjaxList(ajl, "AjaxListCrud", "Dinner")

<div class="bar">
<div style="float: right;">
@Html.Awe().TextBox("txtName").Placeholder("search...").CssClass("searchtxt")
</div>

<button type="button" class="awe-btn mbtn" onclick="awe.open('createDinner')">Create</button>
</div>

@(Html.Awe().AjaxList(ajl)
.Url(Url.Action("GetDinners", "AjaxListCrud"))
.TableLayout(true)
.Parent("txtName", "search"))
Demos/AjaxList/AjaxListCrudController.cs
public class AjaxListCrudController : Controller
{
public ActionResult GetDinners(string search, bool isTheadEmpty, int? pageSize, int? pivot)
{
var ps = pageSize ?? 7;
search = (search ?? "").ToLower().Trim();

var list = Db.Dinners.Where(o => o.Name.ToLower().Contains(search))
.OrderByDescending(o => o.Id);

var items = (pivot.HasValue ? list.Where(o => o.Id <= pivot.Value) : list).Take(ps + 1).ToList();
var isMore = items.Count > ps;

var result = new AjaxListResult
{
Content = this.RenderPartialView("ListItems/Dinner", items.Take(ps)),
More = isMore
};

if (isMore)
{
result.Pivot = items.Last().Id;
}

if (isTheadEmpty) result.Thead = this.RenderPartialView("ListItems/DinnerThead");
return Json(result);
}

public ActionResult Delete(int id)
{
var dinner = Db.Get<Dinner>(id);

return PartialView(new DeleteConfirmInput
{
Id = id,
Type = "dinner",
Name = dinner.Name
});
}

[HttpPost]
public ActionResult Delete(DeleteConfirmInput input)
{
Db.Delete<Dinner>(input.Id);
return Json(new { input.Id });
}

public ActionResult Create()
{
return PartialView();
}

[HttpPost]
public ActionResult Create(DinnerInput input)
{
if (!ModelState.IsValid) return View(input);

var dinner = Db.Insert(new Dinner
{
Name = input.Name,
Date = input.Date.Value,
Chef = Db.Get<Chef>(input.Chef),
Meals = Db.Meals.Where(o => input.Meals.Contains(o.Id)),
BonusMeal = Db.Get<Meal>(input.BonusMealId)
});

return Json(new { Content = this.RenderPartialView("ListItems/Dinner", new[] { dinner }) });
}

public ActionResult Edit(int id)
{
var dinner = Db.Get<Dinner>(id);

var input = new DinnerInput
{
Id = dinner.Id,
Name = dinner.Name,
Chef = dinner.Chef.Id,
Date = dinner.Date,
Meals = dinner.Meals.Select(o => o.Id),
BonusMealId = dinner.BonusMeal.Id
};

return PartialView("create", input);
}

[HttpPost]
public ActionResult Edit(DinnerInput input)
{
if (!ModelState.IsValid) return View("create", input);
var dinner = Db.Get<Dinner>(input.Id);

dinner.Name = input.Name;
dinner.Date = input.Date.Value;
dinner.Chef = Db.Get<Chef>(input.Chef);
dinner.Meals = Db.Meals.Where(m => input.Meals.Contains(m.Id));
Db.Update(dinner);

return Json(new { dinner.Id, Content = this.RenderPartialView("ListItems/Dinner", new[] { dinner }) });
}
}
Shared/ListItems/Dinner.cshtml
@model IEnumerable<AwesomeMvcDemo.Models.Dinner>
@foreach (var o in Model)
{
<tr class="awe-li" id="dinner@(o.Id)" data-val="@o.Id">
<td>@o.Name </td>
<td>@o.Date.ToShortDateString() </td>
<td>@o.Chef.FirstName @o.Chef.LastName </td>
<td>@(string.Join(", ", o.Meals.Select(z => z.Name)))</td>
<td>
<button type="button" onclick="awe.open('editDinner', {params: {id: @o.Id }}, event)" class="awe-btn editbtn">
<span class="ico-crud ico-edit"></span>
</button>
</td>
<td>
<button type="button" onclick="awe.open('deleteDinner', {params: {id: @o.Id }}, event)" class="awe-btn delbtn">
<span class="ico-crud ico-del"></span>
</button>
</td>
</tr>
}



Comments

We use cookies to improve your online experience. By accessing this site, you agree to the use of cookies and other technologies to process your personal data (e.g. IP address) to enhance and personalise your experience across our websites. Additionally, third-party companies, may store cookies on your device and use similar technologies to collect and use certain information. For more information, refer to our privacy policy and cookie policy.