c# - How can i move items from one Listbox to another in ASP MVC 4? -
how possible move items 1 listbox listbox in same view without having reload entire page update 2 listboxes in asp mvc 4?
it in order have selected music genres , able submit music genres webservice submit button.
the genres have id should not shown , name should shown.
i have tried figure out last 4 hours can't seem work @ all.
edit: solved moving items
i solved moving items using jquery. i’ve added reference jquery.unobtrusive-ajax.js , added methods view. final view looks this:
selectgenre.cshtml @model selectgenremodel <div id="genrediv"> @html.listboxfor(model => model.availablegenres, new multiselectlist(model.availablegenres, "id", "name"), new { size = "10" }) <input id="btnaddall" type="button" value=" >> " onclick="addallitems();" /> <input id="btnadd" type="button" value=" > " onclick="additem();" /> <input id="btnremove" type="button" value=" < " onclick="removeitem();" /> <input id="btnremoveall"type="button" value=" << " onclick="removeallitems();" /> @html.listboxfor(model => model.chosengenres, new multiselectlist(model.chosengenres, "id", "name"), new { size = "10" }) </div> <script type="text/javascript"> function additem() { $("#availablegenres option:selected").appendto("#chosengenres"); $("#chosengenres option").attr("selected", false); } function addallitems() { $("#availablegenres option").appendto("#chosengenres"); $("#chosengenres option").attr("selected", false); } function removeitem() { $("#chosengenres option:selected").appendto("#availablegenres"); $("#availablegenres option").attr("selected", false); } function removeallitems() { $("#chosengenres option").appendto("#availablegenres"); $("#availablegenres option").attr("selected", false); } </script>
edit: continued in new question
i have asked more information , more specific in question get items listbox in controller mvc asp 4
i've made fiddle give idea of how achieved. might find useful.
basically provided have 2 select elements (and presuming you're using jquery) you'd like:
$('#sourceitems').change(function () { $(this).find('option:selected').appendto('#destinationitems'); });
and corresponding html goes like:
<select id="sourceitems"> <option>testitem1</option> <option>testitem2</option> // ... </select> <select id="destinationitems"> // ... more options ... </select>
check out fiddle working example. hope helps.
Comments
Post a Comment