Lookup with CRUD functionality in its Popup

 

the lookup has a custom SearchForm, in that custom view there's a Create button which calls a PopupForm, for the editing/deleting a custom Item template is used for the lookup so that each item in the list has an edit and delete button, the edit/delete button calls a PopupForm as well, create and edit PopupForm have success js function attached which receive from the server the rendered row and after it appends/update the list with it.
CrudInLookup/Index.cshtml
@using (Html.BeginForm())
{
@Html.EditorFor(o => o.Dinner)

<input type="submit" value="Submit" class="awe-btn" />
}
Awesome/Lookup/DinnerLookupController.cs
public class DinnerLookupController : Controller
{
// used for custom search when .CustomSearch(true)
public ActionResult SearchForm()
{
return PartialView();
}

public ActionResult Search(string search, int page, bool isTheadEmpty, int? pageSize)
{
pageSize = pageSize ?? 10;
search = (search ?? "").ToLower().Trim();

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

var result = new AjaxListResult
{
Content = this.RenderPartialView("ListItems/Dinner", list.Skip((page - 1) * pageSize.Value).Take(pageSize.Value)),
More = list.Count() > page * pageSize
};

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

public ActionResult GetItem(int? v)
{
var o = v == null || v == 0 ? new Dinner() : Db.Get<Dinner>(v);

return Json(new KeyContent(o.Id, o.Name));
}
}
DinnerLookup/SearchForm.cshtml
@{ Layout = null; }
<div class="elabel2">Name:</div>
<div class="einput">
<input type="text" name="search" class="awe-searchtxt" placeholder="search..." />
</div>
<button type="button" class="awe-searchbtn awe-btn">Search</button>
<button type="button" class="awe-btn" onclick="awe.open('createDinner')" style="padding: 0.35em 0.7em;">Create</button>
<br style="clear: both;" />

@(Html.Awe().InitPopupForm()
.Name("createDinner")
.Url(Url.Action("Create", "Dinners"))
.Success("utils.lookupTblCreated")
.Height(430)
.Modal()
.Group("dinner")
.Title("create dinner"))

@(Html.Awe().InitPopupForm()
.Name("editDinner")
.Url(Url.Action("Edit", "Dinners"))
.Success("utils.lookupEdited('Id')")
.Height(430)
.Modal()
.Group("dinner")
.Title("edit dinner"))

@(Html.Awe().InitPopupForm()
.Name("deleteDinner")
.Url(Url.Action("Delete", "Dinners"))
.Success("utils.lookupDeleted('Id')")
.OkText("Yes")
.CancelText("No")
.Modal()
.Height(200)
.Title("delete 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 }})" class="awe-btn">
<span class="ico-edit"></span>
</button>
</td>
<td>
<button type="button" onclick="awe.open('deleteDinner', {params: {id: @o.Id }})" class="awe-btn">
<span class="ico-del"></span>
</button>
</td>
</tr>
}