在MVC / razor中上下移动列表框

时间:2013-07-16 14:38:24

标签: jquery asp.net-mvc listbox

我在VS 2012中使用mvc4 / razor 我正在尝试使用向上和向下按钮上下移动mvc列表框中的项目。 这些是我在listorder / index.cshtml中的控件 我试过这个剧本,但这不适用于此。请帮忙

     @{
         var Resource = new List<SelectListItem> { 
        new SelectListItem { Text = "res1", Value = "1"},
        new SelectListItem { Text = "res2", Value = "2" },
         new SelectListItem { Text = "res3", Value = "3" },
          new SelectListItem { Text = "res4", Value = "4" }
    };
}

@Html.ListBox("ListReorder", Resource, new { @class = "ListMain"})
<input type="button" value="Up"  id="ResUpButton" onclick="MoveUp()" /> <br /> 
         <input type="button" value="Down" id="ResDownButton" onclick="MoveDown()" />  



<script src="scripts/jquery-1[1].3.2.js" type="text/javascript"></script>
     <script type="text/javascript">
         function MoveDown() {
             var selectedOption = $('#ListReorder > option[selected]');
             var nextOption = $('#ListReorder > option[selected]').next("option");
             if ($(nextOption).text() != "") {             
                 $(selectedOption).remove();
                 $(nextOption).after($(selectedOption));
             }                
         }
         function MoveUp() {
             var selectedOption = $('#ListReorder > option[selected]');
             var prevOption = $('#ListReorder > option[selected]').prev("option");
             if ($(prevOption).text() != "") {
                 $(selectedOption).remove();
                 $(prevOption).before($(selectedOption));
             }
           }

    </script>

1 个答案:

答案 0 :(得分:0)

尝试For more info thisthis

$("#ResUpButton,#ResDownButton").live('click',function(event) {.....