C# 基于Tab Out或按键上的单个字段自动填充字段

我正在使用Visual Studio 2017中使用实体框架创建的ASP.NET MVC项目。我有一个员工控制器的创建视图，用户可以在其中输入库存数据。我想让用户ID字段从Active Directory自动填充数据。当输入用户名时，如何实现按键、制表或字段更改事件，以便触发查找、返回并用相关数据填充特定字段

以下是我所看到的一个想法：

以下是一些CSHTML as供参考：

<div class="form-horizontal">
        <h4>Employee</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.OfficeId, "Office", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DropDownList("OfficeId", null, htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.OfficeId, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.username, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.username, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.username, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.FullName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.FullName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.FullName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.email, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.email, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.email, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.phone, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.phone, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.phone, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.EquipId, "Equipment", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DropDownList("EquipId", null, htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.EquipId, "", new { @class = "text-danger" })
            </div>
        </div>

雇员

@Html.ValidationSummary（true，“，new{@class=“text danger”}）
@LabelFor（model=>model.OfficeId，“Office”，htmlAttributes:new{@class=“controllabel col-md-2”}）
@DropDownList（“OfficeId”，null，htmlAttributes:new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.OfficeId，“，new{@class=“text danger”}）
@LabelFor（model=>model.username，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.username，new{htmlAttributes=new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.username，“，new{@class=“text danger”}）
@LabelFor（model=>model.FullName，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.FullName，new{htmlAttributes=new{@class=“form control”}}）
@Html.ValidationMessageFor（model=>model.FullName，“，new{@class=“text danger”}）
@LabelFor（model=>model.email，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.email，new{htmlAttributes=new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.email，“，new{@class=“text danger”}）
@LabelFor（model=>model.phone，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.phone，new{htmlAttributes=new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.phone，“，new{@class=“text danger”}）
@LabelFor（model=>model.equid，“设备”，htmlAttributes:new{@class=“controllabel col-md-2”}）
@DropDownList（“equid”，null，htmlAttributes:new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.equid，“，new{@class=“text danger”}）

我不熟悉ajax，只懂一点点javascript，但我更愿意尝试将代码包含到C中，因为所有与Active Directory相关的代码都已经编写好了

---

我是否可以在用户ID字段旁边添加一个“查找”按钮，让他们单击该按钮进行填充？如果是这样的话，怎么做呢？

这是可以做到的，尽管需要一点javascript。像这样：

型号：

public class EmployeesViewModel
    {
        public int SelectedOfficeID { get; set; }
        public int SelectedEquipmentID { get; set; }

        public int UserID { get; set; }
        public string Name { get; set; }
        public string Email { get; set; }
        public string Phone { get; set; }

        public List<Office> OfficeList { get; set; }
        public List<Equipment>  EquipmentList { get; set; }
    }

    public class Equipment
    {
        public int EquipmentID { get; set; }
        public string EquipmentName { get; set; }
    }

    public class Office
    {
        public int OfficeID { get; set; }
        public string OfficeName { get; set; }
    }

公共类EmployeesViewModel
{
public int SelectedOfficeID{get；set；}
public int SelectedEquipmentID{get；set；}
public int UserID{get；set；}
公共字符串名称{get；set；}
公共字符串电子邮件{get；set；}
公用字符串电话{get；set；}
公开列表清单清单{get；set；}
公共列表设备列表{get；set；}
}
公共级设备
{
公共int设备ID{get；set；}
公共字符串设备名称{get；set；}
}
公课办公室
{
public int OfficeID{get；set；}
公共字符串OfficeName{get；set；}
}

控制器：

public class EmployeesController : Controller
{
  public ActionResult Employee()
  {
    EmployeesViewModel model = new EmployeesViewModel();
    SetEquipmentData(model);
    SetOfficeData(model);
    return View(model);
  }


[HttpPost]
public ActionResult Employee(EmployeesViewModel model)
{
    SetEquipmentData(model);
    SetOfficeData(model);

    // remove properties from modelstate in order to get modified values in view
    ModelState.Remove("Name");
    ModelState.Remove("Phone");
    ModelState.Remove("Email");

    //SHOULD GET EMPLOYEE DATA FROM DB BASED ON UserID PROPERTY

    // dummy data: 
    model.Name = "John Doe";
    model.Phone = "973-548-85965";
    model.Email = "John@Company.com";
    return View(model);
}


private void SetEquipmentData(EmployeesViewModel model)
{
    // dummy data: 
    model.EquipmentList = new List<Equipment>();
    model.EquipmentList.Add(new Equipment(){EquipmentID = 1, EquipmentName="Hammer"});
    model.EquipmentList.Add(new Equipment() { EquipmentID = 2, EquipmentName = "Screwdriver" });
    model.EquipmentList.Add(new Equipment() { EquipmentID = 3, EquipmentName = "Vise" });
    model.EquipmentList.Add(new Equipment() { EquipmentID = 4, EquipmentName = "Plier" });
    model.EquipmentList.Add(new Equipment() { EquipmentID = 5, EquipmentName = "Saw" });
}

private void SetOfficeData(EmployeesViewModel model)
{
    // dummy data: 
    model.OfficeList = new List<Office>();
    model.OfficeList.Add(new Office() { OfficeID = 10, OfficeName = "Charleston" });
    model.OfficeList.Add(new Office() { OfficeID = 20, OfficeName = "Springfield" });
    model.OfficeList.Add(new Office() { OfficeID = 30, OfficeName = "Montclair" });
    model.OfficeList.Add(new Office() { OfficeID = 40, OfficeName = "Louisville" });
    model.OfficeList.Add(new Office() { OfficeID = 50, OfficeName = "Albany" });
}

}

公共类EmployeesController:控制器
{
公共行动结果雇员（）
{
EmployeesViewModel model=新EmployeesViewModel（）；
设置设备数据（模型）；
SetOfficeData（模型）；
返回视图（模型）；
}
[HttpPost]
公共行动结果员工（员工视图模型）
{
设置设备数据（模型）；
SetOfficeData（模型）；
//从modelstate中删除属性，以便在视图中获得修改后的值
ModelState.删除（“名称”）；
ModelState.Remove（“手机”）；
ModelState.Remove（“电子邮件”）；
//应基于UserID属性从数据库获取员工数据
//虚拟数据：
model.Name=“John Doe”；
model.Phone=“973-548-85965”；
model.Email=”John@Company.com";
返回视图（模型）；
}
专用void设置设备数据（EmployeesViewModel模型）
{
//虚拟数据：
model.EquipmentList=新列表（）；
model.EquipmentList.Add（新设备（）{EquipmentID=1，EquipmentName=“Hammer”}）；
model.EquipmentList.Add（新设备（）{EquipmentID=2，EquipmentName=“螺丝刀”}）；
model.EquipmentList.Add（新设备（）{EquipmentID=3，EquipmentName=“Vise”}）；
model.EquipmentList.Add（新设备（）{EquipmentID=4，EquipmentName=“Plier”}）；
model.EquipmentList.Add（新设备（）{EquipmentID=5，EquipmentName=“Saw”}）；
}
私有void SetOfficeData（EmployeesViewModel模型）
{
//虚拟数据：
model.OfficeList=新列表（）；
Add（newoffice（）{OfficeID=10，OfficeName=“Charleston”}）；
Add（new Office（）{OfficeID=20，OfficeName=“Springfield”}）；
Add（new Office（）{OfficeID=30，OfficeName=“Montclair”}）；
Add（new Office（）{OfficeID=40，OfficeName=“Louisville”}）；
model.OfficeList.Add（new Office（）{OfficeID=50，OfficeName=“Albany”}）；
}
}

视图：

<div class="form-horizontal">
        <h4>Employee</h4>
        <hr />
     @using (Html.BeginForm("Employee", "Employees", FormMethod.Post, new { id = "EmployeeForm", name = "EmployeeForm" }))
     {  
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.SelectedOfficeID, "Office", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DropDownListFor(model => model.SelectedOfficeID, new SelectList(Model.OfficeList, "OfficeID", "OfficeName"))
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.UserID, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.UserID, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.UserID, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Email, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Email, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Phone, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Phone, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Phone, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.SelectedEquipmentID, "Equipment", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                 @Html.DropDownListFor(model => model.SelectedEquipmentID, new SelectList(Model.EquipmentList, "EquipmentID", "EquipmentName"))
            </div>
        </div>

     }
        </div>

<script type="text/javascript">  
    $('#UserID').bind('change', function(e) {
        document.EmployeeForm.submit();
    });
</script> 

雇员

@使用（Html.BeginForm（“雇员”），