Wednesday, 16 January 2013

MVC:How to Move data between two ListBoxes using JQuery

MVC:How to Move data between two ListBoxes using JQuery

namespace Mvc2.Controllers
    public class MovieController : Controller

        public ActionResult MoveDateinListBox()
            return View();

In View
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
        MVC:How to Move data between two ListBoxes using JQuery</h5>
    <script language="javascript" type="text/javascript" src=""></script>
    <script language="javascript" type="text/javascript">
        $(function () {
            $("#MoveToRight,#MoveToLeft").click(function (event) {
                var id = $("id");
                var selectFrom = id == "MoveToRight" ? "#SelectLeftItem" : "#SelectRightItem";
                var moveTo = id == "MoveToRight" ? "#SelectRightItem" : "#SelectLeftItem";
                var selectedItems = $(selectFrom + " option:selected").toArray();
    <form method="get" action="" runat="server">
     <select id="SelectLeftItem" multiple="multiple" style="height: 100px">
        <option value="1">ASP.NET</option>
        <option value="2">C#.NET</option>
        <option value="3">SQL Server</option>
        <option value="4">VB.NET</option>
    <input id="MoveToRight" type="button" value=" >> " style="font-weight: bold" />
    <input id="MoveToLeft" type="button" value=" << " style="font-weight: bold" />
    <select id="SelectRightItem" multiple="multiple" style="height: 100px">
        <option value="1">MVC</option>
        <option value="2">WCF</option>
        <option value="3">WPF</option>
        <option value="4">Silverlight</option>


see live demo

No comments:

Post a Comment

© 2012-2018 All Rights Reserved.
The content is copyrighted to Kishore and may not be reproduced on other websites without permission from the owner.