三、在EDU.SIS.Web.Mvc\wwwroot\view-resources\Areas\app\Views\Demo目录下编写_CreateOrEditModal.js,用于保存创建或者编辑的实体
(function ($) { app.modals.CreateOrEditDemoObjectModal = function () { //后台接口服务 var _demoObjectService = abp.services.app.demoObject; var _modalManager; var _$demoObjectInformationForm = null; //初始化 this.init = function (modalManager) { _modalManager = modalManager; //获取modal对话框对象 var modal = _modalManager.getModal(); //时间选择控件语言设置 modal.find(\'.date-picker\').datetimepicker({ locale: abp.localization.currentLanguage.name === "zh-Hans" ? "zh-cn" : abp.localization.currentLanguage.name, format: \'YYYY-MM-DD HH:mm:ss\' }); //获取模态对话框表单数据 _$demoObjectInformationForm = _modalManager.getModal().find(\'form[name=DemoObjectInformationsForm]\'); ////验证模态对话框表单数据 _$demoObjectInformationForm.validate(); }; //保存操作 this.save = function () { console.log(1); if (!_$demoObjectInformationForm.valid()) { return; } //序列化表单数据 var demoObject = _$demoObjectInformationForm.serializeFormToObject(); //设置繁忙状态 _modalManager.setBusy(true); //保存数据 _demoObjectService.createOrEdit( //这里的方法名称createOrEdit必须首字母小写 demoObject ).done(function () { //通知对话框 abp.notify.info(app.localize(\'SavedSuccessfully\')); //关闭模态对话框 _modalManager.close(); // 触发保存事件 abp.event.trigger(\'app.createOrEditDemoObjectModalSaved\'); }).always(function () { //取消繁忙状态 _modalManager.setBusy(false); }); }; }; })(jQuery);四、在EDU.SIS.Web.Mvc\wwwroot\view-resources\Areas\app\Views\Demo\index.js给创建按钮添加事件，打开对话框
首先要创建模态对话框对象：
编写按钮点击事件,实现创建实体功能
//打开创建修改模态框事件 $(\'#CreateNewDemoObjectButton\').on(\'click\', function () { _createOrEditModal.open(); });给datatable,操作方法列，添加编辑操作：
{ text: app.localize(\'Edit\'), visible: function () { return _permissions.edit; }, action: function (data) { //编辑数据 //console.log(\'edit\'); _createOrEditModal.open({ id: data.record.demoObject.id }); } },这样就实现了创建或编辑实体功能。
删除实体首先在index.js添加删除实体方法：
//删除数据 function deleteDemoObject(demoObject) { //删除确认对话框 abp.message.confirm(demoObject.name, app.localize(\'AreYouSure\'),function (isConfirmed) { if (isConfirmed) { //调用后台，删除数据 _demoObjectService.delete({ id: demoObject.id }).done(function () { //刷新列表数据 getDemoObject(); //删除成功提示 abp.notify.success(app.localize(\'SuccessfullyDeleted\')); }); } }); }再给datatable操作方法列，添加删除实体方法,这样就实现了删除实体功能
{ text: app.localize(\'Delete\'), visible: function () { return _permissions.delete; }, action: function (data) { //删除数据 //console.log(\'delete\'); deleteDemoObject(data.record.demoObject); } } 查看实体详情一、在DemoController中添加查看实体详情方法：
/// <summary> /// 查看实体详情 /// </summary> /// <param></param> /// <returns></returns> public async Task<PartialViewResult> ViewDemoObjectModal(int id) { var rest = await _demoObjectAppService.GetDemoObjectForView(id); var model = new DemoObjectViewModel() { Name = rest.DemoObject.Name, Age = rest.DemoObject.Age, Price = rest.DemoObject.Price, IsVip = rest.DemoObject.IsVip ? "是" : "不是", EndDateTime = rest.DemoObject.EndDateTime.ToString("yyyy-MM-dd HH:mm:ss") }; return PartialView("_ViewDemoObjectModal", model); }所需要的视图模型：
namespace EDU.SIS.Web.Areas.app.Models.Demo { public class DemoObjectViewModel { /// <summary> /// 姓名 /// </summary> public string Name { get; set; } /// <summary> /// 年龄 /// </summary> public int Age { get; set; } /// <summary> /// 价格 /// </summary> public double Price { get; set; } /// <summary> /// 是否为会员 /// </summary> public string IsVip { get; set; } /// <summary> /// 截至时间 /// </summary> public string EndDateTime { get; set; } } }