Building Dynamic UI with C#?

Question

I need to expose some input fields based on what properties I find for particular types in an assembly.

I'm not sure how common an approach like that is. Perhaps there are easier ways. Maybe on the client side instead of server.

If anyone knows of a good way of doing something like this, I would appreciate the help.

Create input controls accordingly and simple add control to some div container? I'm not sure if it would be more complex than that. I'll need to somehow add css classes to the controls as I build them so they get placed nicely; that might get tricky.

Answer 1

This all sounds like standard asp.net development. Any good tutorial should be able to help you. For the asp server controls, you use the CssClass property to set the class for the control.

Here is the asp.net tutorial from the W3C Schools.

Answer 2

I assume you will use reflection to figure out what properties entity has, then you would based on the type of the property create an input field. You would have to dynamically create control to handle input in code behind. Make sure you give that control and id. You will have to recreate these controls on the post back. This looks to me like dynamic property editor. There might be some free ones, google for it.

Answer 3

If the UI doesn't have to be completely dynamic you could include all the controls in the markup with any optional ones set to Visible="false". Then, selectively enable the appropriate controls in your code-behind. For example:

Default.aspx

    <asp:Button ID="EvenButton" runat="server" Text="Even" Visible="false" />
    <asp:Button ID="OddButton" runat="server" Text="Odd" Visible="false" />

Default.aspx.cs

    protected void Page_Load(object sender, EventArgs e)
    {
        String msg = "A message to count";

        if (msg.Length % 2 == 0)
        {
            // Enable the Even Button
            EvenButton.Visible = true;
        }
        else
        {
            OddButton.Visible = true;
        }
    }

The advantage of this method is that you can lay things out with the appropriate CSS easily in the markup. If, on the other hand, your UI is much more dynamic than this, you'll probably have to resort to dynamically creating controls in the code-behind and adding them to the page via calls to Controls.Add(). This way, however, is harder to layout. And you have to deal with things like re-wiring any event handlers on each postback.

Hope that helps.

Answer 4

I ended up leveraging JQeury.
I laid out a simple markup with the basic layout I would need.
For creating controls dynamically, I did it all in javascript using Jquery methods.
This of course requires that you return some data set to the UI intelligently enough to render it.