Sunday, March 27, 2011

How to sort controls at runtime in ASP.NET

How to order Controls at runtime in ASP.NET for instance I have three text boxes in my web page in the following order

  • textbox1
  • textbox2
  • textbox3

I want the order of these controls to be changed depending on the user preferences

  • textbox3
  • textbox2
  • textbox1

that is just an example, any idea?

From stackoverflow
  • For a very simple proof-of-concept, you would need some kind of backing store like a database table that stores UserID, Ordinal, and AscxFileName. In SQL you could run a query such as:

    SELECT AscxFileName FROM tableControls WHERE UserID=@UserID ORDER BY Ordinal
    

    Then with the result set:

    while(IDataReader.Read())
    {
        Control myControl = Page.LoadControl(IDataReader["AscxFileName"].ToString());
        myPanel.Controls.Add(myControl);
    }
    
    ahmed : thanks, this didn't solve the problem, because I want to resort the controls not loading them in order
  • Grab all the IDs of the textbox controls and store them in an array. Then just do a reverse sort:

    Array.Reverse( mytextboxArray );

    ahmed : what I want is resorting the controls positions in the page thanks for trying to help
    IrishChieftain : You need to do this first. You can then spit the controls out dynamically on the page and avoid the need for either a database or a JavaScript solution.
  • You dont really need to reorder the controls, you can just change the text of the labels in front of them and change the data which is populated in them based on the user preferences!

    ahmed : thanks, what I wrote here is just an example, what I need to do is something like igoogle.com
    Robert C. Barth : Well then change your question so that people can change their answers.
    renegadeMind : It would really help you if you more if you explain why you r not satisfied with the answer instead of just down voting ppl
    ahmed : @renegadeMind- sorry mate I think I have explained that I need to change the order of controls, sorry if I was not clear enough
  • The jQuery UI framework can do that for you. Check out this demo and the docs for the same.

    ahmed : thanks, thats true however it works in client side , this consumes system resources I think, because the whole page will be loaded then jQuery will hide the object that I want hide and resort what I want to sort, thanks
    Karl : If you want to do anything at runtime on asp.net it's best to do it clientside. Your clients are powerful enough to run a modern web browser, arent they?
  • The easiest way is to use third-party controls like Telerik. More precisely DockZones.
    Otherwise you'd have to create your own pagebuilder with this functionality.

    ahmed : thanks, Telerik will work and I have used it in my X job ,I think it has some problems (1)it is not free (2) it is more than what I want (3)I feel that it consume system resources (just a feeling :))
  • Finally I have found a solution and I will explain it in detail

    create a "panel control" and called it "myPanel" and put in this all controls you want to resort

    <asp:Panel ID="myPanel" runat="server">
            <asp:Panel ID="dock1" runat="server">this is first module</asp:Panel>
            <asp:Panel ID="dock2" runat="server">this is second module</asp:Panel>
            <asp:Panel ID="dock3" runat="server">this is third module</asp:Panel>
    </asp:Panel>
    

    the output will be the following

    this is first module

    this is second module

    this is third module

    so what should I do to change their order, lets see I have created more three panels to act like a containers for the docks my code will be like this

    <asp:Panel ID="myPanel" runat="server">
            <asp:Panel ID="container1" runat="server"></asp:Panel>
            <asp:Panel ID="container2" runat="server"></asp:Panel>
            <asp:Panel ID="container3" runat="server"></asp:Panel>
            <asp:Panel ID="dock1" runat="server">this is first module</asp:Panel>
            <asp:Panel ID="dock2" runat="server">this is second module</asp:Panel>
            <asp:Panel ID="dock3" runat="server">this is third module</asp:Panel>
    </asp:Panel>
    

    in the code behind I have something like this

    this will remove dock1 control from mypanel and put it in container3

        Control myCtrl1 = myPanel.FindControl("dock1");
        Control containerCtrl1 = myPanel.FindControl("container3");
        myCtrl1.Visible = true;
        myPanel.Controls.Remove(myCtrl1);
        containerCtrl1 .Controls.Add(myCtrl1);
    

    and you can manage these thing depending on user preferences from a database or a cookies

    best regards

0 comments:

Post a Comment