Grid CRUD using Popup Demo

Drag a column header and drop it here to group by that column
Id
Name
Date
Chef
Meals
Bonus Meal
 
 
4315cabbage1/6/2025Naked ChefMango, ApplePapaya
675asdasda6/8/2007Gaia EarthRiceApple
673Apples9/17/2018Peter GibbonsBroccoli, MangoBanana
671Cookies11/13/2019Joanna StanTomato, Walnuts, CauliflowerCucumber
669Morning Tea6/15/2009Pepper TomatoHazelnutsCucumber
667Morning meal8/11/2018Pepper TomatoWalnutsBuckwheat
665Snacks and movie10/9/2020Joanna StanBuckwheatWheat
663Apero10/27/2010Gaia EarthAlmonds, Buckwheat, AppleLettuce
661petit dej8/3/2009Joanna StanWalnuts, BuckwheatBanana
659Breakfast10/27/2012Casse CrouteMangoBroccoli
show code
Grid crud, built using the Grid and PopupForm helpers called via InitCrudPopupsForGrid,
each PopupForm has Success js function assigned, these functions are located in aweUtils.js.
Post actions return a json object which tells the PopupForm that the result is a success, that json object contains the id property which is used to flash the row.
Delete PopupForm has OnLoad js func used to animate the row that is about to be deleted.

Make sure to use "return PartialView" for PopupForm/Popup views this will ignore _viewstart.cshtml so that you don't use the _Layout.cshtml and realod all the scripts, and as a result break the js.

Grid Crud Inline Popup 

Drag a column header and drop it here to group by that column
Id
Name
Date
Chef
Meals
Bonus Meal
 
 
4315cabbage1/6/2025Naked ChefMango, ApplePapaya
675asdasda6/8/2007Gaia EarthRiceApple
673Apples9/17/2018Peter GibbonsBroccoli, MangoBanana
671Cookies11/13/2019Joanna StanTomato, Walnuts, CauliflowerCucumber
669Morning Tea6/15/2009Pepper TomatoHazelnutsCucumber
667Morning meal8/11/2018Pepper TomatoWalnutsBuckwheat
665Snacks and movie10/9/2020Joanna StanBuckwheatWheat
663Apero10/27/2010Gaia EarthAlmonds, Buckwheat, AppleLettuce
661petit dej8/3/2009Joanna StanWalnuts, BuckwheatBanana
659Breakfast10/27/2012Casse CrouteMangoBroccoli
show code
Crud popups are open inline, inside a div identified by id.



Comments