开发自定义图片按钮,实现类似ASP提交

在开发时如果要使用多个图片按钮时,我们经常必须为每个按钮制作一个图片(如:新增,修改,删除
等,其实只是文字不一样而已,我们却必须制作3个图片,一句话麻烦),如果能开发一图片按钮控件,
实现只须更改文字就可以生成按钮,那就好了。以下是实现方式(采用将图片分割成三部分进行实现)
///

1<summary>   
2/// 图片按钮控件   
3/// </summary>

public class Buttoner : Button
{
//
// 常量
//
private const string HTML1 = "

1<table ";="" ;="" align='\"center\"' background='\"";' border='\"0\"' cellpadding='\"0\"";' cellspacing='\"0\"' const="" cursor:hand\"="" height='\"";' html10="\" html3="\" html4="\" html5=" STYLE=\" html6="\" html7="&gt;\n\t&lt;TR&gt;" html8="\n\t\t&lt;TD Valign=\" html9="\" id='\"";' middle\"="" onclick='\"javascript:";' private="" string="" width='\"";'>";   
2private const string HTML11 = "";   
3private const string HTML12 = "\n\t\n</table>

";
private const string HTML13 = " disabled="true"";
private const string HTML14 = " TabIndex="";
private const string HTML15 = " onkeydown="javascript:";
private const string HTML16 = " style="padding-top:";

private const string KEY_FORM_SUBMIT_JS = "FormSubmitJs";
//
// 变量
//
private string leftImagePath;
private string middleImagePath;
private string rightImagePath;

private Unit length;
private Unit height = 20;
private Unit width = 6;
private Unit topPadWidth = 3;

private string action = null;
private string target = null;

private bool defaultButton = false;

///

1<summary>   
2/// 构造函数   
3/// </summary>

public Buttoner()
{
leftImagePath = ApplicationUrl.GetButtonImagePath("btnLeft");
middleImagePath = ApplicationUrl.GetButtonImagePath("btnMiddle");
rightImagePath = ApplicationUrl.GetButtonImagePath("btnRight");
}

///

1<summary>   
2/// 左图片路径   
3/// </summary>

public string LeftImagePath
{
get
{
return leftImagePath;
}
set
{
leftImagePath = value;
}
}

///

1<summary>   
2/// 中间图片路径   
3/// </summary>

public string MiddleImagePath
{
get
{
return middleImagePath;
}
set
{
middleImagePath = value;
}
}

///

1<summary>   
2/// 右图片路径   
3/// </summary>

public string RightImagePath
{
get
{
return rightImagePath;
}
set
{
rightImagePath = value;
}
}

///

1<summary>   
2/// 中间图片长度   
3/// </summary>

public Unit Length
{
get
{
return length;
}
set
{
length = value;
}
}

///

1<summary>   
2/// 图片高度   
3/// </summary>

public override Unit Height
{
get
{
return height;
}
set
{
height = value;
}
}

///

1<summary>   
2/// 图片宽度   
3/// </summary>

public override Unit Width
{
get
{
return width;
}
set
{
width = value;
}
}

///

1<summary>   
2/// 图片距顶部宽度   
3/// </summary>

public Unit TopPadWidth
{
get
{
return topPadWidth;
}
set
{
topPadWidth = value;
}
}

///

1<summary>   
2/// 提交的页面   
3/// </summary>

public string Action
{
get
{
return action;
}
set
{
action = value;
}
}

///

1<summary>   
2/// Action的目标框架   
3/// </summary>

public string Target
{
get
{
return target;
}
set
{
target = value;
}
}

///

1<summary>   
2/// 是否默认按钮   
3/// </summary>

public bool DefaultButton
{
get
{
return defaultButton;
}
set
{
defaultButton = value;
}
}

protected override void OnPreRender(EventArgs e)
{
if(this.Visible && !Page.IsClientScriptBlockRegistered(ApplicationKey.FORM_SUBMIT_JS))
{
string src = ApplicationUrl.GetJsPath("FormSubmit");
StringBuilder strBuilder = new StringBuilder();
strBuilder.Append("

1<script language='\"javascript\"' src='\"");' strbuilder.append("\"="" strbuilder.append(src);=""></script>

");

if(defaultButton)
{
strBuilder.Append("\n

 1<script event='\"onkeydown\"' for='\"document\"' id='\"ButtonEnterSubmit\"' language='\"javascript\"'>\n\t");   
 2strBuilder.Append("if(window.event.keyCode == 13)\n\t\t");   
 3strBuilder.Append("{\n\t\t\t");   
 4strBuilder.Append("document.getElementById('");   
 5strBuilder.Append(this.ClientID);   
 6strBuilder.Append("').focus();\n\t\t\t"); 
 7
 8if(this.Enabled)   
 9{   
10if(this.CausesValidation)   
11strBuilder.Append("if(typeof(Page_ClientValidate) != 'function' || Page_ClientValidate()) "); 
12
13if(action == null || action == string.Empty)   
14strBuilder.Append(Page.GetPostBackEventReference(this));   
15else   
16{   
17strBuilder.Append("Submit('");   
18strBuilder.Append(action);   
19strBuilder.Append("', '");   
20strBuilder.Append(target);   
21strBuilder.Append("');");   
22}   
23} 
24
25strBuilder.Append("\n\t\t}");   
26strBuilder.Append("\n</script>

");
}

Page.RegisterClientScriptBlock(ApplicationKey.FORM_SUBMIT_JS, strBuilder.ToString());
}
}

protected override void Render(HtmlTextWriter writer)
{
if(this.Visible)
{
writer.Write(HTML1);
writer.Write(this.ClientID);
writer.Write(HTML3);
writer.Write(height);
writer.Write(HTML4);
writer.Write(HTML14);
writer.Write(this.TabIndex);
writer.Write(HTML6);

if(this.Enabled)
{
// onclick提交
writer.Write(HTML5);
writer.Write("{ document.getElementById('");
writer.Write(this.ClientID);
writer.Write("').focus(); ");

if(this.CausesValidation)
writer.Write("if(typeof(Page_ClientValidate) != 'function' || Page_ClientValidate()) ");

if(action == null || action == string.Empty)
writer.Write(Page.GetPostBackEventReference(this));
else
{
writer.Write("Submit('");
writer.Write(action);
writer.Write("', '");
writer.Write(target);
writer.Write("');");
}

writer.Write("} ");
writer.Write(HTML6);
}
else
writer.Write(HTML13);

writer.Write(HTML7);

writer.Write(HTML8);
writer.Write(width);
writer.Write(HTML9);
writer.Write(leftImagePath);
writer.Write(HTML10);
writer.Write(" ");
writer.Write(HTML11);

writer.Write(HTML8);
writer.Write(length);
writer.Write(HTML9);
writer.Write(middleImagePath);
writer.Write(HTML6);
writer.Write(HTML16);
writer.Write(topPadWidth);
writer.Write(HTML10);
writer.Write(this.Text);
writer.Write(HTML11);

writer.Write(HTML8);
writer.Write(width);
writer.Write(HTML9);
writer.Write(rightImagePath);
writer.Write(HTML10);
writer.Write(" ");
writer.Write(HTML11);

writer.Write(HTML12);
}
}
}

FormSubmit.js

// click提交
function Submit(action, target)
{
document.forms[0].action = action;

if(target != null && target.length != 0)
document.forms[0].target = target;

document.forms[0].__VIEWSTATE.disabled = true;
document.forms[0].submit();
}

// 按Enter键事件
function EnterKeyDown(id)
{
if(window.event.keyCode == 13 && window.event.srcElement.id == id)
return true;
else
return false;
}

Published At
Categories with Web编程
Tagged with
comments powered by Disqus