connectseekers.com

Thursday, 22 January 2015

Move ListBox Item From one ListBox To another ListBox Using jQuery In Asp.Net

1/22/2015 - By Pranav Singh 0



This article will show you how you can move listbox item from one listbox to another listbox using jquery in asp.net. This will show to transfer the how to transfer data from one listbox to other listbox using jquery.


So for this article first we will create a new asp.net application and add the below code.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm6.aspx.cs" Inherits="WebApplication1.WebForm6" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Move ListBox Item From one ListBox To another ListBox Using jQuery In Asp.Net
    </title>
    <script src="jquery-1.4.1.min.js" type="text/javascript"></script>
    <script language="javascript">
        function MoveRight() {
            $('#<%=ListBox1.ClientID %> option:selected').appendTo('#<%=ListBox2.ClientID %>');
            return false;
        }
        function MoveLeft() {
            $('#<%=ListBox2.ClientID %> option:selected').appendTo('#<%=ListBox1.ClientID %>');
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <table width="100%">
        <tr>
            <td>
                <asp:ListBox ID="ListBox1" runat="server" Height="105px" Width="118px" SelectionMode="Multiple">
                    <asp:ListItem>List1 Item 1</asp:ListItem>
                    <asp:ListItem>List1 Item2</asp:ListItem>
                    <asp:ListItem>List1 Item 3</asp:ListItem>
                    <asp:ListItem>List1 Item 4</asp:ListItem>
                    <asp:ListItem>List1 Item 5</asp:ListItem>
                </asp:ListBox>
            </td>
            <td>
                <asp:Button ID="Button1" runat="server" Text=">>" OnClientClick="javascript:return MoveRight();" /><br />
                <asp:Button ID="Button2" runat="server" Text="<<" OnClientClick="javascript:return MoveLeft();" />
            </td>
            <td>
                <asp:ListBox ID="ListBox2" runat="server" Height="105px" Width="118px" SelectionMode="Multiple">
                    <asp:ListItem>List2 Item 1</asp:ListItem>
                    <asp:ListItem>List2 Item2</asp:ListItem>
                    <asp:ListItem>List2 Item 3</asp:ListItem>
                    <asp:ListItem>List2 Item 4</asp:ListItem>
                    <asp:ListItem>List2 Item 5</asp:ListItem>
                </asp:ListBox>
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

Now check the below mention jQuery code.

    <script language="javascript">
        function MoveRight() {
            $('#<%=ListBox1.ClientID %> option:selected').appendTo('#<%=ListBox2.ClientID %>');
            return false;
        }
        function MoveLeft() {
            $('#<%=ListBox2.ClientID %> option:selected').appendTo('#<%=ListBox1.ClientID %>');
            return false;
        }
    </script>

In above code I have created two function move left and right. In this function I have passed listbox1 data to the other listbox.

Now we have done run the application check the output.


About the Author

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Get Updates

Subscribe to our e-mail newsletter to receive updates.

Share This Post

0 comments:

Please let me know your view

Free Ebooks


About Us

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Contact Us

For writing article in this website please send request by your

GMAIL ID: dotnetpools@gmail.com
Email Id : contact@aspdotnet-pools.com

Bugs and Suggestions

As we all know that this website is for sharing knowledge and providing proper solution. So while reading the article is you find any bug or if you have any suggestion please mail us at contact@aspdotnet-pools.com.

Partners


Top jQuery Plugins

Global Classified : Connectseekers.com
© 2014
back to top