Generate UI controls dynamically based on XML template in MVC

I have to create a UI in MVC based on the XML template. The code will read the XML file and will generate the UI controls on the Webpage(MVC based).

The sample XML would be of the following format:

- <Substitutions>
- <Variables>
     <Variable Substituion="%%Primary_Font%%" UIName="Primary Font" AltTExt="This color is used for all primary text on the page" UIComponent="FontPicker()" Default="Tahoma" /> 
     <Variable Substituion="%%Bg_Color%%" UIName="Page background" AltTExt="This color is used for the page background" UIComponent="ColorPicker()" Default="#FFFFFF" /> 
   </Variables>
</Substitutions>

Here, each "Variable" XML element defines a UI control to be rendered on the page at runtime. For Example : The First variable element means to display a dropdown control with Label as Primary Font and Default value as Tahoma. The property which will hold the value will be Primary_Font.

I have the option to use either C# or Javascript in places, wherever, either one is required.

The issue is how to render a UI control in a particular section of the webpage in MVC dynamically based on the XML template and populate it with required values. For example: I need to display a Dropdown for FontSelection, populate it with some hard-coded values.

Please suggest me some approach for this. Will be highly appreciate开发者_Python百科d.

Thanks in Advance.

Feels like good situation to create Custom ViewEngine.