在BPM、OA等系统中，都会存在一个表单设计器。有些是通过操作gridview来完成一个表单的设计；有些是通过类似VS拖拽的方法完成一个表单的设计。很明显后面一种优越于前面一种。无论是哪种，最后都会产生一些XML之类的表单结构的数据。

　　这篇文章将讲述，在表单设计器设计好表单之后，在ASP.NET MVC中如何将表单结构的xml转换成实际应用系统中的表单。看下面一个xml文件，我们假设它是由一个表单设计器设计出来的。

     
    
     
     
      朱
          
     
      祁林
          
     
      男
          
     
      24
      
    

　　下面，我将把它转化成实际的asp.net mvc系统中的表单。首先，使用LinqtoXML将上面的XML文件转换成XElement，代码如下。在控制器中最好不要直接读取文件，这里为了简单直观起见，就直接在Controller中读取xml文件了。

[AcceptVerbs(HttpVerbs.Get)] public ActionResult Index() {
  XElement xml = XElement.Load(Server.MapPath("~/App_Data/form1.xml"));     ViewData["xml"] = xml; return View(); }

　　接着我们将在View中，将上面的XElement转换成真正的HTML表单。

　　在表单设计器中很难的一块就是控件的定位。我从我提供的XML中可以看到，它里面是存放了位置信息的。这使我们想到了div的绝对布局。这个方法在这种情况下非常的适合。

　　下面，我定义两个字符串模板：

string label = " 
    
     {2}
    
"; string input = "";

　　label用于显示文本信息，input用于显示表单上的value。下面通过循环产生html脚本。

StringBuilder sb = new StringBuilder(); sb.Append("    
    
      "); foreach(XElement f in xml.Elements()) {
    sb.Append(string.Format(label, int.Parse(f.Attribute("left").Value) - 60, f.Attribute("top").Value, f.Attribute("name").Value));   sb.Append(string.Format(input, f.Attribute("name").Value, f.Attribute("type").Value, f.Attribute("class").Value, f.Attribute("left").Value, f.Attribute("top").Value, f.Value)); } sb.Append("
    
 ");

　　最后通过Response.Write(sb.ToString())输出。

　　整个View的代码如下：

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %> 
     
       Home Page 
      
     
       <% XElement xml = (XElement)ViewData["xml"]; %> <%Html.BeginForm(); %>
     

<%    string label = " 
     
      {2}
     
"; string input = ""; StringBuilder sb = new StringBuilder();    sb.Append("    
     
       "); foreach(XElement f in xml.Elements())    {
        sb.Append(string.Format(label, int.Parse(f.Attribute("left").Value) - 60, f.Attribute("top").Value, f.Attribute("name").Value));      sb.Append(string.Format(input, f.Attribute("name").Value, f.Attribute("type").Value, f.Attribute("class").Value, f.Attribute("left").Value, f.Attribute("top").Value, f.Value));    }      sb.Append("
     
 ");      Response.Write(sb.ToString()); %>   <%Html.EndForm(); %> 

　　效果：

　　1、显示XML表单：

　　2、提交表单：

　　总结：这个是一种通过表单设计器产生动态表单最简单的方式。也是非常通用的一种方式。在产生html的时候，你可以带上Jquery的验证的脚本。当然还有很多的扩展和完善。。

　　求助与讨论：开发表单设计器是我心里的一块石头，估计也是很多正在开发BPM、OA之类童鞋心中的一块石头。最近一直在思考这个问题，从这篇文章可以看到，我我设计的表单设计器上的控件可以随意拖放的。在生成HTML的时候，使用div的绝对布局，打算朝这个方向做，不知道可行否。下面是我想到的一些问题：

　　1、采用什么技术或者模式开发表单设计器；2、如何最好的定位；3、在设计器上如何操作表格以及主从表；4、数据源的绑定；5、数据的验证；

　　如果你开发过表单设计器、或者有这方面的研究和心得、或者有这方面的兴趣、欢迎在此一起讨论。