在asp.net中经常要写些特殊的WebControl,并应用到不同的场合,偶然发现将自己写的控件放置到ajax的UpdatePanel中就出错。
经过不断的调试和翻阅msdn,原来是正常使用Page刷新时可以页面向客户端注册脚本块,而在UpdatePanel刷新时不能注册它以外的内容,所以在updatePanel中的控件没有将js资源文件注册到客户端。
于是就产生了ScriptManager与ClientScript的区别
- System.Web.UI.ScriptManager
为 Web 和应用程序服务管理 ASP.NET AJAX 脚本库和脚本文件、部分页面呈现以及客户端代理类生成。
向客户端注册资源文件的方法:RegisterClientScriptResource
每次发生回发时都向 System.Web.UI.ScriptManager 控件注册嵌入程序集中的客户端脚本文件。
向客户端注册启动脚本块的方法:RegisterStartupScript
为每个异步回发向 System.Web.UI.ScriptManager 控件注册一个启动脚本块,并将该脚本块添加到页面中。
2. System.Web.UI.Control.Page.ClientScript (返回一个System.Web.UI.ClientScriptManager)
获取用于管理脚本、注册脚本和向页添加脚本的 System.Web.UI.ClientScriptManager 对象
向客户端注册资源文件的方法:RegisterClientScriptInclude
使用类型、键和 URL 向 System.Web.UI.Page 对象注册客户端脚本包含。
向客户端注册启动脚本块的方法:RegisterStartupScript
使用类型、键、脚本文本和指示是否添加脚本标记的布尔值向 System.Web.UI.Page 对象注册启动脚本。
通过以上的定义,就会发现ScriptManager适用在特殊的场合,那么我们在控件中如何来进行区分应该使用哪一个呢?其实可以通过寻找控件的parent,判断是否有updatepanel,如果有就用ScriptManager;没有的话当然用ClientScript,避免每次postback操作时控件都要进行资源文件的注册。
贴出代码如下:(弹出多选的CheckBox功能控件)
1.CS文件
Code
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Drawing;
namespace WebUI
{
[DefaultProperty("Text")]
[ToolboxData("<{0}:DropdownCheckBoxListControl runat=server></{0}:DropdownCheckBoxListControl>")]
public class DropdownCheckBoxListControl : WebControl
{
private TextBox InputTextBox;
private CheckBoxListAssistant InputChechBoxList;
private AjaxControlToolkit.PopupControlExtender PopupControl;
private string _inputText;
private Unit _displayHeight;
private Unit _displayWidth;
private Unit _dropHeight;
private Unit _dropWidth;
public virtual string DisplayInputText
{
get { return _inputText; }
set {
_inputText = value;
if (InputTextBox != null){
InputTextBox.Text = _inputText;
}
}
}
public virtual ListItemCollection Items
{
get { return InputChechBoxList.Items; }
}
public virtual ListItemCollection CheckedItems
{
get {
ListItemCollection lists = new ListItemCollection();
foreach(ListItem li in InputChechBoxList.Items)
{
lists.Add(li);
}
return lists;
}
}
public Unit DisplayHeight
{
get { return _displayHeight == Unit.Empty ? new Unit("17px") : _displayHeight; }
set { _displayHeight = value; }
}
public Unit DisplayWidth
{
get { return _displayWidth == Unit.Empty ? new Unit("100px") : _displayWidth; }
set { _displayWidth = value; }
}
public Unit DropHeight
{
get { return _dropHeight == Unit.Empty ? new Unit("150px") : _dropHeight; }
set { _dropHeight = value; }
}
public Unit DropWidth
{
get { return _dropWidth == Unit.Empty ? new Unit("100px") : _dropWidth; }
set { _dropWidth = value; }
}
public virtual string DataValueField
{
get { return InputChechBoxList.DataValueField; }
set { InputChechBoxList.DataValueField = value; }
}
public virtual string DataTextField
{
get { return InputChechBoxList.DataTextField; }
set { InputChechBoxList.DataTextField = value; }
}
public virtual object DataSource
{
get { return InputChechBoxList.DataSource; }
set { InputChechBoxList.DataSource = value; }
}
public override void DataBind()
{
InputChechBoxList.DataBind();
}
public DropdownCheckBoxListControl()
{
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
InputTextBox = new TextBox();
InputChechBoxList = new CheckBoxListAssistant();
PopupControl = new AjaxControlToolkit.PopupControlExtender();
InputChechBoxList.Style.Add(HtmlTextWriterStyle.BackgroundColor, "#cccccc");
InputTextBox.Style.Add(HtmlTextWriterStyle.VerticalAlign, "top");
InputChechBoxList.Style.Add(HtmlTextWriterStyle.TextOverflow, "scroll");
InputTextBox.ID = this.ClientID + "_InputTextBox";
InputChechBoxList.ID = this.ClientID + "_InputChechBoxList";
PopupControl.ID = this.ClientID + "_PopupControl";
InputTextBox.Width = this.DisplayWidth;
InputTextBox.Height = this.DisplayHeight;
InputChechBoxList.Width = this.DropWidth;
InputChechBoxList.DivHeight = this.DropHeight;
if (!String.IsNullOrEmpty(_inputText))
{
InputTextBox.Text = _inputText;
}
PopupControl.OffsetY = Convert.ToInt32(InputTextBox.Height.Value);
PopupControl.TargetControlID = InputTextBox.ID;
PopupControl.PopupControlID = InputChechBoxList.ID + "_div";
this.PreRender += new EventHandler(DropdownTreeViewControl_PreRender);
this.Controls.Add(InputTextBox);
this.Controls.Add(InputChechBoxList);
this.Controls.Add(PopupControl);
}
public static string GetChildControlPrefix(Control control)
{
if (control.NamingContainer.Parent == null)
{
return control.ID;
}
else
{
return String.Format("{0}_{1}", control.NamingContainer.ClientID, control.ID);
}
}
void DropdownTreeViewControl_PreRender(object sender, EventArgs e)
{
bool isPage = true;
Control c = this.Parent;
while(c != null)
{
if (c is Page)
{
isPage = true;
break;
}
else if (c is UpdatePanel)
{
isPage = false;
break;
}
else
{
c = c.Parent;
}
}
if (!isPage)
{
ScriptManager.RegisterClientScriptResource(
this.Page,
this.GetType(),
"WebUI.Resources.DropdownCheckBoxListControl.js"
);
ScriptManager.RegisterStartupScript(
this.Page,
this.GetType(),
String.Format("ChechHelper_{0}", this.ID),
String.Format("ChechHelper.register(\"{0}\",\"{1}\");", this.InputTextBox.ClientID, this.InputChechBoxList.ClientID),
true
);
}
else
{
if (!this.Page.ClientScript.IsClientScriptIncludeRegistered(this.GetType(), "_ChechHelper"))
{
this.Page.ClientScript.RegisterClientScriptInclude(
this.GetType(),
"_ChechHelper",
this.Page.ClientScript.GetWebResourceUrl(
this.GetType(), "WebUI.Resources.DropdownCheckBoxListControl.js"
)
);
}
this.Page.ClientScript.RegisterStartupScript(
this.GetType(),
String.Format("ChechHelper_{0}", this.ID),
String.Format("ChechHelper.register(\"{0}\",\"{1}\");", this.InputTextBox.ClientID, this.InputChechBoxList.ClientID),
true
);
}
}
protected override void RenderContents(HtmlTextWriter output)
{
base.RenderContents(output);
}
protected override void CreateChildControls()
{
base.CreateChildControls();
}
protected override void RenderChildren(HtmlTextWriter writer)
{
base.RenderChildren(writer);
}
}
}
2.资源文件
Code
if(!this.ChechHelper){
ChechHelper = function(){
var helpers = new Array();
function _chechHelper(){
var me = this;
this._inputTextID = null;
this._checkBoxListID = null;
this._separator = ",";
this.setInputTextID = function(e) { me._inputTextID = e; }
this.setcheckBoxListID = function(e) { me._checkBoxListID = e; }
this.setSeparator = function(e) { me._separator = e; }
this.oncheckClick = function(e){
var evt = e || window.event; // FF || IE
var obj = evt.target || evt.srcElement // FF || IE
me.getChechedText();
}
this.getChechedText = function(){
var text = document.getElementById(me._inputTextID);
text.value = "";
var check = document.getElementById(me._checkBoxListID);
if(check == null){
return;
}
var es = check.getElementsByTagName("INPUT");
for (i=0; i< es.length; i++){
if (es[i].type == "checkbox") {
if(es[i].checked){
if(text.value.length > 0){
text.value += me._separator;
}
var td = es[i].parentElement;
var las = td.getElementsByTagName("LABEL");
if(las != null && las.length > 0) {
text.value += las[0].innerHTML;
}
}
}
}
}
this.init = function(){
var check = document.getElementById(me._checkBoxListID);
if(check == null){
return;
}
var es = check.getElementsByTagName("INPUT");
for (i=0; i< es.length; i++){
if (es[i].type == "checkbox") {
es[i].attachEvent("onclick",me.oncheckClick);
}
}
}
}
return {
register: function(inputID,checkBoxListID) {
var th = new _chechHelper();
th.setInputTextID(inputID);
th.setcheckBoxListID(checkBoxListID);
th.init();
helpers.push(th);
}
}
}();
}