其实添加数据也可以这样简单——表单的第三步抽象(针对UI及后置代码)

简介: 终于赶出来了,现写了一遍代码。 感谢大家的支持,感谢大家提出自己的看法。衷心的感谢,真的。 应该是先写第二步的,但是想一想还是先写第三步吧。 一般大项目里面都会有很多的基础信息的表,比如学历、职称等等,最近做了一个项目,居然有四十多个。
终于赶出来了,现写了一遍代码。

感谢大家的支持,感谢大家提出自己的看法。衷心的感谢,真的。

应该是先写第二步的,但是想一想还是先写第三步吧。

一般大项目里面都会有很多的基础信息的表,比如学历、职称等等,最近做了一个项目,居然有四十多个。如果一个一个地写是不是太麻烦了呢?

下面就要介绍一种方法 —— 基本一个页面搞定。

还是先说一下前提吧
VS2003 、 SQL2000 、 webform ,办公系统里的基础信息表的维护。

1、SQL2000里的几个系统表
写过代码生成器的Tx对这几个表都很熟悉吧,sysobjects 、syscolumns 、systypes 。

请打开企业管理器(查询分析器也可以),建立一个视图,粘贴下面的SQL语句,然后保存视图,名字就叫做 V_Sys_TableInfo 吧,后面要用到的哦。
SELECT  tbl.name  AS  TableName, tbl.xtype  AS  TableType, col.name  AS  FieldName, 
      tt.name 
AS  FieldType, col.length  AS  FieldLength
FROM  dbo.syscolumns col  INNER   JOIN
      dbo.sysobjects tbl 
ON  col.id  =  tbl.id  INNER   JOIN
      dbo.systypes tt 
ON  col.xtype  =  tt.xtype
WHERE  (tbl.xtype  =   ' u ' AND  (tt.name  <>  N ' sysname ' )


看不懂SQL语句没关系,运行一下看看结果就知道了。你发现了什么?你的数据库里的表名、字段名、字段类型和字段大小。


那么这些信息有什么用呢?请先回顾一下第一步里保存数据都需要哪些元素。表名、字段名、用户输入的信息。

知道我要怎么用了吧,对,就是要通过表名来获取表所拥有的字段名。


2、DataGrid是不是也可以这么用。
开始绘制表单了。一个一个文本框的拖拽是不是挺烦的,那么一起把需要的控件逗弄出来怎么样?
想想上面得到的记录集,是不是可以利用一下呢?

建立一个UserControl ,拖一个DataGrid 出来,设置三列,第一列绑定 FieldName ,第二列空,第三列设置成模版列,放一个文本框。代码如下
< asp:DataGrid  id ="DG"  align ="center"  runat ="server"  BorderColor ="#CCCCCC"  BorderStyle ="None"  BorderWidth ="1px"
    BackColor
="White"  CellPadding ="4"  ForeColor ="Black"  AutoGenerateColumns ="False" >
    
< FooterStyle  ForeColor ="Black"  BackColor ="#CCCC99" ></ FooterStyle >
    
< SelectedItemStyle  Font-Bold ="True"  ForeColor ="White"  BackColor ="#CC3333" ></ SelectedItemStyle >
    
< HeaderStyle  Font-Bold ="True"  ForeColor ="White"  BackColor ="#333333" ></ HeaderStyle >
    
< Columns >
        
< asp:BoundColumn  Visible ="False"  DataField ="FieldName"  HeaderText ="FieldName" ></ asp:BoundColumn >
        
< asp:BoundColumn  DataField ="FieldName"  HeaderText ="字段名" ></ asp:BoundColumn >
        
< asp:TemplateColumn  HeaderText ="控件" >
            
< ItemTemplate >
                
< FONT  face ="宋体" >
                    
< hbs:HBSTextBox  id ="Txt"  runat ="server"  Columns ="30" ></ hbs:HBSTextBox ></ FONT >
            
</ ItemTemplate >
        
</ asp:TemplateColumn >
    
</ Columns >
    
< PagerStyle  HorizontalAlign ="Right"  ForeColor ="Black"  BackColor ="White" ></ PagerStyle >
</ asp:DataGrid >
< P >
    
< TABLE  id ="Table1"  cellSpacing ="1"  cellPadding ="1"  width ="100%"  align ="center"  border ="0" >
        
< TR >
            
< TD  align ="center" > &nbsp;
                
< asp:Button  id ="Btn_Save"  runat ="server"  Width ="70px"  Text =" 确 定 " ></ asp:Button > &nbsp; < INPUT  id ="Btn_Return"  onclick ="myEsc()"  type ="button"  value =" 返 回 "  name ="Btn_Return" ></ TD >
            
</ TD ></ TR >
    
</ TABLE >
    
</ P >


进入后台,绑定DataGrid。想象一下会出现什么样的效果。
运行效果。



先不详细说明了,发代码先。

UserControl 页面 BaseForm.ascx
<% @ Register TagPrefix="HBS" Namespace="HBS.Controls" Assembly="HBSControls"  %>
< asp:DataGrid  id ="DG"  align ="center"  runat ="server"  BorderColor ="#CCCCCC"  BorderStyle ="None"  BorderWidth ="1px"
    BackColor
="White"  CellPadding ="4"  ForeColor ="Black"  AutoGenerateColumns ="False" >
    
< FooterStyle  ForeColor ="Black"  BackColor ="#CCCC99" ></ FooterStyle >
    
< SelectedItemStyle  Font-Bold ="True"  ForeColor ="White"  BackColor ="#CC3333" ></ SelectedItemStyle >
    
< HeaderStyle  Font-Bold ="True"  ForeColor ="White"  BackColor ="#333333" ></ HeaderStyle >
    
< Columns >
        
< asp:BoundColumn  Visible ="False"  DataField ="FieldName"  HeaderText ="FieldName" ></ asp:BoundColumn >
        
< asp:BoundColumn  HeaderText ="字段名" ></ asp:BoundColumn >
        
< asp:TemplateColumn  HeaderText ="控件" >
            
< ItemTemplate >
                
< FONT  face ="宋体" >
                    
< hbs:HBSTextBox  id ="Txt"  runat ="server"  Columns ="30" ></ hbs:HBSTextBox ></ FONT >
            
</ ItemTemplate >
        
</ asp:TemplateColumn >
    
</ Columns >
    
< PagerStyle  HorizontalAlign ="Right"  ForeColor ="Black"  BackColor ="White" ></ PagerStyle >
</ asp:DataGrid >
< P >
    
< TABLE  id ="Table1"  cellSpacing ="1"  cellPadding ="1"  width ="100%"  align ="center"  border ="0" >
        
< TR >
            
< TD  align ="center" > &nbsp;
                
< asp:Button  id ="Btn_Save"  runat ="server"  Width ="70px"  Text =" 确 定 " ></ asp:Button > &nbsp; < INPUT  id ="Btn_Return"  onclick ="myEsc()"  type ="button"  value =" 返 回 "  name ="Btn_Return" ></ TD >
            
</ TD ></ TR >
    
</ TABLE >
</ P >

public   class  BaseForm : System.Web.UI.UserControl
    
{
        
Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
        
override protected void OnInit(EventArgs e)
        
{
            
//
            
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
            
//
            InitializeComponent();
            
base.OnInit(e);
        }

        
        
/**//// <summary>
        
///        设计器支持所需的方法 - 不要使用代码编辑器
        
///        修改此方法的内容。
        
/// </summary>

        private void InitializeComponent()
        
{
            
this.Btn_Save.Click += new System.EventHandler(this.Btn_Save_Click);
            
this.Load += new System.EventHandler(this.Page_Load);

        }

        
#endregion

        
        
protected System.Web.UI.WebControls.Button Btn_Save;
        
protected System.Web.UI.WebControls.DataGrid DG;

        DataAccessLayer dal 
= new DataAccessLayer();
        
        
属性#region 属性
        
protected string Kind = "1";
        
protected string DataID = "";
    
        
        
private string _TableName = "";
        
/**//// <summary>
        
/// 设置表名,用于添加和修改数据
        
/// </summary>

        public string TableName
        
{
            
get{return _TableName;}
            
set{_TableName = value;}
        }

        
        
private string _FieldID = "";
        
/**//// <summary>
        
/// 设置主键名,用于修改数据
        
/// </summary>

        public string FieldID
        
{
            
get{return _FieldID;}
            
set{_FieldID = value;}
        }

        
#endregion


        
private void Page_Load(object sender, System.EventArgs e)
        
{
            
// 在此处放置用户代码以初始化页面

        }


        
绑定#region 绑定
        
public void BindDataGrid()
        
{
            
this.DG.DataSource = dal.RunSqlDataTable("select * from V_Sys_TableInfo where TableName='" + _TableName + "'");
            
this.DG.DataBind();

            
//隐藏第一行
            DG.Items[0].Visible = false;
        }

        
#endregion


        
保存#region 保存
        
private void Btn_Save_Click(object sender, System.EventArgs e)
        
{
            
//保存数据

            
string[] str1 = new string[DG.Items.Count - 1];
            
string[] str = new string[DG.Items.Count - 1];

            
int i = -1;
            
foreach (DataGridItem item in DG.Items)
            
{
                
if (i != -1)        //掠过第一行
                {
                    
//字段名
                    str1[i] = item.Cells[0].Text ;        
                    
//取值
                    str[i] = ((HBSTextBox)item.Cells[2].FindControl("Txt")).TextTrimNone;
                }

                i
++;
            }


            
保存数据#region 保存数据
            
switch (Kind )
            
{
                
case "1":
                    
//添加时验证是否有相同的记录,代码略。写多了会影响这里的主题
                    
//添加数据
                    dal.InsertDataStr(_TableName,str1,str);
                    
break;
    
                
case "2":
                    
//修改时验证是否有相同的记录,代码略。写多了会影响这里的主题    
                    
//修改数据
                    dal.UpdateData(_TableName,str1,str, _FieldID + " = " + DataID);
                    
break;
            }

            
#endregion


            
检查是否出现异常#region 检查是否出现异常
            
if (dal.ErrorMsg.Length > 2)
            
{
                Functions.PageRegisterAlert(Page,
"保存数据的时候出现意外情况,请与管理员联系!");
                
return ;
            }


            Functions.PageRegisterAlert(Page,
"保存成功!");
            
#endregion


        }

        
#endregion

    }


表单页面 MoreTable.aspx
< body  MS_POSITIONING ="FlowLayout" >
        
< form  id ="Form1"  method ="post"  runat ="server" >
            
< uc1:BaseForm  id ="myForm"  runat ="server"  TableName ="News" ></ uc1:BaseForm >
        
</ form >
    
</ body >

// 请注意这里,在VS2003里面,这行是不会自动出现的,需要手动填写。
         protected  JYK.Test.UC.BaseForm myForm;         // 用户控件
    
        
private   void  Page_Load( object  sender, System.EventArgs e)
        
{
            
// 在此处放置用户代码以初始化页面
            Response.Cache.SetNoStore();

            
if (!Page.IsPostBack)
            
{
                myForm.BindDataGrid();
                
//把英文的字段名改成中文的
                myForm.DG.Items[1].Cells[1].Text = "分类";
                myForm.DG.Items[
2].Cells[1].Text = "内容";
                myForm.DG.Items[
3].Cells[1].Text = "标题";
                myForm.DG.Items[
4].Cells[1].Text = "编辑";
                

            }

        }

用户控件只使用一个就可以了。(不知道这算不算抽象)

表单控件是一个页面对应一个数据表,其实也就是设置一下表名,和显示一下字段的中文名。


优点呢:代码少,其他的就不说了。

缺点就很多了:只能用文本框、要单独设置中文名、页面死板不灵活、不够OO,只能单表操作。

不过除了不够OO(准确点说是一点都不OO:)),其他的是都可以改进的。至于怎么改进,如果您感兴趣可以想一想,方法实在是太多了。

ps:我现在写程序并不是用的这种方法,只是思路是一样的。这种方法,是我刚写的,在实际中没有应用过的。

相关文章
|
3月前
|
前端开发
Element UI 【实战】纯前端对表格数据进行增删改查(内含弹窗表单、数据校验、时间日期格式)
Element UI 【实战】纯前端对表格数据进行增删改查(内含弹窗表单、数据校验、时间日期格式)
126 6
|
2月前
|
前端开发 JavaScript UED
element-ui 表格数据究竟隐藏着怎样的神秘样式与格式化技巧?快来揭开谜底!
【8月更文挑战第22天】《element-ui 表格数据样式及格式化案例》展示了如何利用 element-ui 的表格组件实现美观且易读的数据展示。通过简单配置,可以自定义表格样式,如边框、背景色等,并通过 formatter 实现数据格式化,例如将成绩保留一位小数。此外,还能依据条件设置行样式,如成绩达优则高亮显示,从而增强用户体验和数据可读性。
51 1
|
2月前
|
计算机视觉
ElementUI——vue2+element-ui 2.x的动态表格和表单
ElementUI——vue2+element-ui 2.x的动态表格和表单
35 1
|
2月前
|
C# 开发者 设计模式
WPF开发者必读:命令模式应用秘籍,轻松简化UI与业务逻辑交互,让你的代码更上一层楼!
【8月更文挑战第31天】在WPF应用开发中,命令模式是简化UI与业务逻辑交互的关键技术,通过将请求封装为对象,实现UI操作与业务逻辑分离,便于代码维护与扩展。本文介绍命令模式的概念及实现方法,包括使用`ICommand`接口、`RelayCommand`类及自定义命令等方式,并提供示例代码展示如何在项目中应用命令模式。
29 0
|
3月前
element UI 组件封装--搜索表单(含插槽和内嵌组件)
element UI 组件封装--搜索表单(含插槽和内嵌组件)
61 5
|
3月前
|
JavaScript
vue + element UI 表单中内嵌自定义组件的表单校验触发方案
vue + element UI 表单中内嵌自定义组件的表单校验触发方案
83 5
|
3月前
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
351 3
|
3月前
Element UI 多选表格--判断勾选数据行的 Checkbox 时为选中还是取消选中
Element UI 多选表格--判断勾选数据行的 Checkbox 时为选中还是取消选中
31 1
|
3月前
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
53 0
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
|
3月前
软件研发核心问题之在需求拆解过程中,“数据与UI如何关联”的问题如何解决
软件研发核心问题之在需求拆解过程中,“数据与UI如何关联”的问题如何解决
下一篇
无影云桌面