How to prevent page being postbacked when i transfer item from one listbox to other

Question

I have two listboxes in my application on button click i am pushing the item from one list box to other , the code works fine but it causes postback , while i move the item from one list box to other whole page is being loaded again , how i can prevent this .

This will be the code on my aspx page

 <div class="bx1">
        <telerik:RadListBox ID="RadListBox1" runat="server" DataTextField="Name" DataValueField="Id"
             Width="250px">
        </telerik:RadListBox>
        </div>
       <div style="height:7px"></div>
        <div class="bx5">
         <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="images/dwnArrow.png" OnClick="MoveDownClick" />
         <asp:ImageButton ID="ImageButton2" runat="server" ImageUrl="images/uparrow.png" OnClick="MoveUpClick" />
       </div>
         <div style="height:7px"></div>

       <div class="bx1">
        <telerik:RadListBox ID="RadListBox2" runat="server"   DataTextField="Name"
            DataValueField="Id" Width="250px" >
        </telerik:RadListBox>
        </div>

This is my code behind for listbox

 protected void MoveDownClick(object sender, EventArgs e)
            {
                if (RadListBox1.SelectedIndex < 0)
                {
                }
                else
                {
                    RadListBox2.Items.Add(RadListBox1.SelectedItem);
                    RadListBox1.Items.Remove(RadListBox1.SelectedItem);
                    RadListBox2.SelectedItem.Selected = false;
                }
            }
            protected void MoveUpClick(object sender, EventArgs e)
            {
                if (RadListBox2.SelectedIndex < 0)
                {

                }
                else
                {

                    RadListBox1.Items.Add(RadListBox2.SelectedItem);
                    RadListBox2.Items.Remove(RadListBox2.SelectedItem);
                    RadListBox1.SelectedItem.Selected = false;

                }

            }

Answer 1

If your version of Visual Studio is less than 2008, then first download the ajax from the following site and install it:

http://ajaxcontroltoolkit.codeplex.com/

Add a reference to the System.Web.Extensions dll and then add the following line right after your opening <form> tag:

<asp:ScriptManager runat="server" ID="Script1"></asp:ScriptManager>

Replace the Your Code in following piece of code with your entire code that you have written above:

<asp:UpdatePanel runat="Server" ID="u1">
<ContentTemplate>
Your Code
</ContentTemplate>
</asp:UpdatePanel>

That's it, this will stop posting back your page.

Answer 2

Take the time to look into using jQuery along with Microsoft's Ajax with Update Panels or moving into jQuery exclusively where possible. Here are two links that are excellent reads regarding the subject:

Microsoft Ajax? http://encosia.com/why-aspnet-ajax-updatepanels-are-dangerous/

jQuery Ajax: http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/