我们尝试在新增/编辑界面增加一个下拉框用来代替输入框编辑Status

添加实体

打开领域层(即JD.CRS.Core)的Entitys目录 //用以存放实体对象
添加一个类StatusCode.cs //状态信息

using System;

using System.Collections.Generic;

using System.Text;

namespace JD.CRS.Entitys

{

    public enum StatusCode : byte

    {

        Enabled = ,

        Disabled =

    }

}

更新模型

更新查询视图模型

打开展示层(即JD.CRS.Web.Mvc)的Models/Course/CourseListViewModel.cs //Course查询视图模型

新增GetStatusList方法 //获取状态列表

 public StatusCode? Status { get; set; }

 public List<SelectListItem> GetStatusList(ILocalizationManager localizationManager)

 {

     var list = new List<SelectListItem>

     {

         new SelectListItem

         {

             Text = localizationManager.GetString(CRSConsts.LocalizationSourceName, "PleaseSelect"),

             Value = "",

             Selected = Status == null

         }

     };

     list.AddRange(Enum.GetValues(typeof(StatusCode))

         .Cast<StatusCode>()

         .Select(status =>

             new SelectListItem

             {

                 Text = localizationManager.GetString(CRSConsts.LocalizationSourceName, $"StatusCode_{status}"),

                 Value = status.ToString(),

                 Selected = status == Status

             })

     );

     return list;

 }

更新编辑视图模型

打开展示层(即JD.CRS.Web.Mvc)的Models/Course/EditCourseModalViewModel.cs //Course编辑视图模型

新增GetStatusList方法 //获取状态列表

 public List<SelectListItem> GetStatusList(ILocalizationManager localizationManager)

 {

     var list = new List<SelectListItem>

     {

     };

     list.AddRange(Enum.GetValues(typeof(StatusCode))

         .Cast<StatusCode>()

         .Select(status =>

             new SelectListItem

             {

                 Text = localizationManager.GetString(CRSConsts.LocalizationSourceName, $"StatusCode_{status}"),

                 Value = status.ToString(),

                 Selected = status == Status

             })

     );

     return list;

 }

更新控制器

打开展示层(即JD.CRS.Web.Mvc)的Controllers/CourseController.cs //Course控制器

更新EditCourseModal方法 //向EditCourseModalViewModel传参数Status

public async Task<ActionResult> EditCourseModal(int courseId)

{

    var course = await _courseAppService.Get(new EntityDto<int>(courseId));

    var model = new EditCourseModalViewModel

    {

        Course = course,

        Status = course.Status

    };

    return View("_EditCourseModal", model);

}

更新创建视图

打开展示层(即JD.CRS.Web.Mvc)的Views/Course/Index.cshtml //Course查询视图

添加下拉框Status //以替代输入框Status

<div class="row clearfix">

    <div class="col-sm-12">

        <div class="form-line">

            <label class="form-label">@L("Status")</label>

            @Html.DropDownListFor(

            model => model.Status,

            Model.GetStatusList(LocalizationManager),

            new

            {

                @class = "form-control",

                id = "Status"

            })

            @*<input name="Status" type="text" class="form-control" />*@

        </div>

    </div>

</div>

更新编辑视图

打开展示层(即JD.CRS.Web.Mvc)的Views/Course/_EditCourseModal.cshtml //Course编辑视图

添加下拉框Status //以替代输入框Status

<div class="row clearfix">

    <div class="col-sm-12">

        <div class="form-line">

            <label class="form-label">@L("Status")</label>

            @Html.DropDownListFor(

            model => model.Status,

            Model.GetStatusList(LocalizationManager),

            new

            {

                @class = "form-control",

                id = "Status"

            })

            @*<input name="Status" type="text" value="@Model.Course.Status" class="form-control" />*@

        </div>

    </div>

</div>

更新脚本

打开展示层(即JD.CRS.Web.Mvc)的\wwwroot\view-resources\Views\Course\_EditCourseModal.js //用以存放Course编辑相关脚本

在初始化Form时给下拉框传值

//Initial form

_$modal.on('shown.bs.modal', function () {

    _$form.find('input[type=text]:first').focus();//focus first input

    _$status.val() = status;//Status value

});

预览效果

创建课程

编辑课程

巴特西

ABP进阶教程3 - 优化编辑