如何实现两张表共用一个下拉框

如何实现两张表共用一个下拉框

我们平时做项目的时候会经常遇到下拉框绑定数据库表的数据，而最多的是绑定一张数据库表，偶尔也会遇到两张表甚至多张表的绑定，那么当遇到两张表的时候该怎么做呢？
其实假如两张表有关联的话还好办，主要是两张表之间没有关联就有点难度，方法其实不难，就是要想办法将两张表合成一张表，或者说是将一张表放到另一张表里面。
例子： 现在我要绑定经手人的数据放到下拉框里面，但是经手人的数据是由数据库的用户表和导购员表这两张表组成，效果图如下：

导购员表与用户表之间是没有关联的。
步骤：1、先绑定用户表的数据；
用户表数据后面的括号里面的数据是我要用到的，所以你们按实际情况来写，可以像导购员查询数据一样的查询方法。

//查询数据
List<SelectVo> listUser = (from tbUser in myModels.PW_User
        join tbUserType in myModels.PW_UserType on tbUser.UserTypeID equals tbUserType.UserTypeID
         select new SelectVo{
                 id = tbUser.UserID,
                 text = tbUser.UserName + "   " + "(" + tbUserType.UserTypeName + ")",
                 UserNum = tbUser.UserNum.Substring(tbUser.UserNum.Length - 4)
}).ToList();
foreach (var item in listUser)
{
        if (item.text == "管理员            (管理员)")
        {
               item.text = "管理员" + "(***" + item.UserNum + ")";
         }
}

2、再绑定导购员表的数据；

List<SelectVo> listShoppingGuide = (from tbShoppingGuide in myModels.PW_ShoppingGuide
                select new SelectVo{
                        id = tbShoppingGuide.ShoppingGuideID,
                        text = tbShoppingGuide.ShoppingGuideName,
}).ToList();

3、将导购员表数据添加到用户表里面。

listUser.AddRange(listShoppingGuide);

AddRange的定义是：将指定集合的元素添加到 List 的末尾；
所以在这里我是将导购员表添加到用户表数据的末尾。
完整的代码：
在控制器： 这里的写法是完整的两张表查询的代码，名字就是数据库表里面的名字。

public ActionResult searchUser()
{
     //查询数据
     List<SelectVo> listUser = (from tbUser in myModels.PW_User
               select new SelectVo{
                       id = tbUser.UserID,
                       text = tbUser.UserName
               }).ToList();
     List<SelectVo> listShoppingGuide = (from tbShoppingGuide in myModels.PW_ShoppingGuide
                select new SelectVo{
                         id = tbShoppingGuide.ShoppingGuideID,
                         text = tbShoppingGuide.ShoppingGuideName,
                 }).ToList();
      listUser.AddRange(listShoppingGuide);
      return Json(listUser, JsonRequestBehavior.AllowGet);
}

在页面：

<label class="col-form-label mr-2" style="font-size: 12px;">经手人</label>
<select class="form-control form-control-sm mr-3" style="width: 150px;" id="searchUserID" name="UserID"></select>

jQuery:

//绑定经手人下拉框
createSelect("searchUserID", "/HuiGuanHuo/SellArea/searchUser"); 

"searchUserID"是Id, "/HuiGuanHuo/SellArea/searchUser"是绑定数据的路径；