MVC3 2 列表框在回发时交换项目捕获更改

Question

上周我一直在阅读有关此主题的帖子，并接近但仍不完全在那里。任何帮助都会有所帮助。我有许多 hyper-v 服务器，并试图不断更新分配给它的来宾 VM。我有两个列表 1 分配来宾机器的列表。第二个可用访客机器列表

我有以下几点：

视图模型：

namespace MyFirstApplication.ViewModels
{
    public class HVHostGuestViewModel
    {
        public string HVCname { get; set; }
        public int AvailMemory { get; set; }
        public int AvailDisk { get; set; }
        public SelectList HVGuests {get; set; }
        public SelectList AvailGuests { get; set; }
        public List<string> GuestsRemoved { get; set; }
        public List<string> GuestsAdded { get; set; }
        public string HVComments { get; set; }
    }
}

控制器：

public ActionResult Manage(int id)
    {
        tblHVHost tblhvhost = db.tblHVHosts.Find(id);
        var AssignedComputers = (from c in db.tblComputers
                                  where (c.tblHVHostHVHostId == id  && c.HostName !    = "DTR")
                                  orderby(c.HostName)
                                  select c).ToList();

        var UnAssignedComputers = (from c in db.tblComputers
                                   where c.tblHVHostHVHostId == 1 && c.HostName != "DTR"
                                   orderby(c.HostName)
                                   select c).ToList();

     var GuestVM = new SelectList(AssignedComputers,"tblHVHostHVHostId","HostName");
     var AvailVM = new SelectList(UnAssignedComputers, "tblHVHostHVHostId","HostName");



        var HVViewModel = new HVHostGuestViewModel
        {
           HVCname = tblhvhost.HVCName,
           AvailDisk = 1000,
           AvailMemory = 32,
           HVComments = tblhvhost.HVComments,
          HVGuests = GuestVM,
          AvailGuests = AvailVM                
        };

        return View(HVViewModel);

    }
    //
    // POST:/HVHost/Manage/
    [HttpPost]
    public ActionResult Manage(HVHostGuestViewModel HVViewModel)
    {


        return View();
    }

查看：（使用 Razor 引擎）

将 VM 分配给 Hyper-V 服务器

@using (Html.BeginForm("Manage", "HVHost", FormMethod.Post)){

<table>

    <tr>          
        <th> Assigned Machines </th>
        <th></th>
        <th> Available Machines</th>
   </tr>
    <tr>
        <td>
            @Html.ListBox("Guests", Model.HVGuests)
        </td>

        <td>
              <input id="MoveRight" type="button" value=" >> " />
            <br />
              <input id="MoveLeft" type="button" value=" << " />
        </td>

        <td>
             @Html.ListBox("Available", Model.AvailGuests) 

        </td>
    </tr>
    <tr>
        <td></td>
         <td> <input type="submit" value="Submit" onclick =" " /> </td>
         <td></td>

    </tr>
</table>

@Html.HiddenFor(model => model.GuestsRemoved)
@Html.HiddenFor(model => model.GuestsAdded)

}

jQuery 脚本：

$(function () {
    $("#MoveRight,#MoveLeft").click(function (event) {
        var id = $(event.target).attr("id");
        var selectFrom = id == "MoveRight" ? "#Guests" : "#Available";
        var moveTo = id == "MoveRight" ? "#Available" : "#Guests";

        var selectedItems = $(selectFrom + " :selected").toArray();
        $(moveTo).append(selectedItems);
        selectedItems.remove;
        var name = $(event.target).attr("Text");

        $("#GuestsRemoved").val("MPE999")
        $("#GuestsAdded").val("mpe111")

    })
});

什么是有效的：我得到两个列表，并且能够在两个列表之间移动项目（从左到右/从右到左）。这是使用我找到的 jQuery 脚本。

到目前为止，从我所读到的内容来看，我有两个选择：1 在每个事件之后回发到服务器。 2）留在客户端，在隐藏字段中保留所选项目的列表，这些项目在回发时可供控制器使用。 我决定尝试选项 2。 我在视图模型中添加了两个元素：GuestsRemoved、GuestsAdded 作为列表 我使用 Razor 辅助语法将这些元素添加到我的视图中：@html.HiddenFor(model => model.guestsRemoved) & @Html.HiddenFor(Model => model.GuestsAdded)。 接下来，我将它添加到我的 Jquery 脚本中。我通过为其分配一个测试值来验证值将返回到控制器：$("#GuestsAdded").val("mpe111")

所以这就是我卡住的地方。我无法找出给出“HostName”的正确属性，这就是我想要返回的。此实例中的主机名列表。

原始的 html 看起来像： MPE123

选择列表对象是：
var GuestVM = new SelectList(AssignedComputers,"tblHVHostHVHostId","HostName")

我不知道如何访问“主机名”。 任何帮助将不胜感激。

Answer 1

试试这个：

var listOfHostNHames = $(selectFrom + " :selected").text();