title: Move listbox up and down in MVC /razor
body: <p>I use mvc4/razor, in VS 2012
  I'm trying to move the items inside mvc listbox up and down using up and down buttons .
  These are my controls inside listorder/index.cshtml
  I tried the script ,but this is not working here. please help        </p>
  
  <pre><code>     @{
           var Resource = new List&lt;SelectListItem&gt; { 
          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"})
  &lt;input type="button" value="Up"  id="ResUpButton" onclick="MoveUp()" /&gt; &lt;br /&gt; 
           &lt;input type="button" value="Down" id="ResDownButton" onclick="MoveDown()" /&gt;  
  
  
  
  &lt;script src="scripts/jquery-1[1].3.2.js" type="text/javascript"&gt;&lt;/script&gt;
       &lt;script type="text/javascript"&gt;
           function MoveDown() {
               var selectedOption = $('#ListReorder &gt; option[selected]');
               var nextOption = $('#ListReorder &gt; option[selected]').next("option");
               if ($(nextOption).text() != "") {             
                   $(selectedOption).remove();
                   $(nextOption).after($(selectedOption));
               }                
           }
           function MoveUp() {
               var selectedOption = $('#ListReorder &gt; option[selected]');
               var prevOption = $('#ListReorder &gt; option[selected]').prev("option");
               if ($(prevOption).text() != "") {
                   $(selectedOption).remove();
                   $(prevOption).before($(selectedOption));
               }
             }
  
      &lt;/script&gt;
  </code></pre>