自定义选择控件引出的笔记
A、选择页的弹出及返回值
ListPage.htm：
<script type="text/javascript">
function ShowDialog()
{
var obj = new Object(); //传递多个值
obj.id = 1000;
obj.name = 'testname';
var returnValue = window.showModalDialog("SelectPage.htm",obj,"dialogWidth=500px;dialogHeight=300px");
document.getElementById("lbReturnValue").innerHTML = returnValue.one + "," + returnValue.two + "," + returnValue.three;
}
</script>
<a href="javascript:void(0);" onclick="ShowDialog()">ShowWindow</a>
<span id="lbReturnValue"></span>
SelectPage.htm：
<script type="text/javascript">
var para;
window.onload = function GetPara()
{
para = window.dialogArguments;
document.getElementById("lbPara").innerHTML = para.name + "," + para.id;
}
function ReturnValue()
{
var obj = new Object(); //返回多个值
obj.one = para.name + "one"; //对数据加工处理
obj.two = para.id + 2;
obj.three = Date();
window.returnValue=obj;
window.close();
}
</script>
传过来的参数:<span id="lbPara"></span>
<a href="javascript:void(0);" onclick="ReturnValue()">ReturnValue</a>
B、Request.Form的用法：
WebForm1.aspx
<form id="form1" action="WebForm2.aspx" method="post">
<input type="text" name="tb" />
<input type="submit" />
</form>
WebForm2.aspx-Page_Load：
Response.Write(Request.Form["tb"]); //得到Page1提交的输入框内容
C、关于控件状态的保存测试：
TestPage.aspx：
<input type="text" />
<asp:TextBox ID="tb" runat="server"></asp:TextBox>
<asp:Button ID="btn" runat="server" Text="Sumbit"/>
//输入值后提交，HTML控件值丢失，TextBox值还在。
D、选择控件生成的HTML代码：
ListPage.aspx:
<input type='text' name='MySelectCtl' id='MySelectCtl' value='' />
<input type='hidden' name='MySelectCtl_IdValue' id='MySelectCtl_IdValue' value='' />
<a href='javascript:void(0);' onclick="var rtnValue = window.showModalDialog('SelectPage.aspx'); document.getElementById('MySelectCtl_IdValue').value = rtnValue.rtnId; document.getElementById('MySelectCtl').value = rtnValue.rtnText;">
选择</a>
SelectPage.aspx:
<script type="text/javascript">
function GetRtn()
{
var obj = new Object();
obj.rtnId = "100,101,102";
obj.rtnText ="值A,值B,值C";
window.returnValue= obj;
window.close();
}
</script>
<a href="javascript:void(0);" onclick="GetRtn()">Select</a>
E、编写自定义控件类的Render：
public class MySelectCtl : WebControl, INamingContainer
{
public string SelectPage { set; get; }
public string SelectText { set; get; }
protected override void Render(HtmlTextWriter writer)
{
string js = "var rtnValue = window.showModalDialog('" + this.SelectPage + "');"
+ " document.getElementById('" + this.ID + "_IdValue').value = rtnValue.rtnId;"
+ " document.getElementById('" + this.ID + "').value = rtnValue.rtnText;";
string text = string.IsNullOrEmpty(this.SelectText) ? "选择" : this.SelectText;
writer.Write("<input type='text' name='" + this.ID + "' id ='" + this.ID + "' />"
+ " <input type='hidden' name='" + this.ID + "_IdValue' id='" + this.ID + "_IdValue' />"
+ " <a href='javascript:void(0);' onclick=\"" + js + "\">" + text + "</a>");
}
}
F、为控件加上显示值和ID值：
//添加属性
public string TextValue { set; get; }
public string IdValue { set; get; }
//Render时加上输入框的value显示：
writer.Write("<input type='text' name='" + this.ID + "' id ='" + this.ID + "' value='" + this.TextValue + "' />"
+ " <input type='hidden' name='" + this.ID + "_IdValue' id='" + this.ID + "_IdValue' value='" + this.IdValue + "' />"
+ " <a href='javascript:void(0);' onclick=\"" + js + "\">" + text + "</a>");
G、存取控件的值状态：
//在Page_Load和Btn_Click之后触发此事件
//只有改变了数据结构，在页面提交后才会触发LoadViewState事件，才能设置控件值
protected override object SaveViewState()
{
object[] aryObj = new object[1];
aryObj[0] = base.SaveViewState();
return aryObj;
}
//页面点击查询按钮时在页面Page_Load和Btn_Click之前触发此事件
//在恢复视图状态时设置控件值，这样在Page_Load和Btn_Click中就可以取到控件的值，对页面进行初始化
protected override void LoadViewState(object savedState)
{
base.LoadViewState(savedState);
this.TextValue = Page.Request.Form[this.ID]; //PostBack向页面本身提交
this.IdValue = Page.Request.Form[this.ID + "_IdValue"];
}
H、页面事件执行顺序：
第一次打开：Page_Load-SaveViewState-Render
提交页面后：LoadViewState-Page_Load-btn_Click-SaveViewState-Render
PS:附控件完整代码（错误甚多，只供本人学习）：
选择控件
{
public string TextValue { set; get; }
public string IdValue { set; get; }
public string SelectPage { set; get; }
public string SelectText { set; get; }
protected override object SaveViewState() //2,6 --> Render
{
object[] aryObj = new object[1];
aryObj[0] = base.SaveViewState();
return aryObj;
}
protected override void LoadViewState(object savedState) //4-第2次click
{
object[] aryObj = (object[])savedState;
if (aryObj[0] != null) base.LoadViewState(savedState);
this.TextValue = Page.Request.Form[this.ID];
this.IdValue = Page.Request.Form[this.ID + "_IdValue"];
}
protected override void Render(HtmlTextWriter writer) //3,7
{
string js = "var rtnValue = window.showModalDialog('" + this.SelectPage + "');"
+ " document.getElementById('" + this.ID + "_IdValue').value = rtnValue.rtnId;"
+ " document.getElementById('" + this.ID + "').value = rtnValue.rtnText;";
string text = string.IsNullOrEmpty(this.SelectText) ? "选择" : this.SelectText;
writer.Write("<input type='text' name='" + this.ID + "' id ='" + this.ID + "' value='" + this.TextValue + "' />"
+ " <input type='hidden' name='" + this.ID + "_IdValue' id='" + this.ID + "_IdValue' value='" + this.IdValue + "' />"
+ " <a href='javascript:void(0);' onclick=\"" + js + "\">" + text + "</a>");
}
}
ListPage.aspx:
<cc1:MySelectCtl ID="MySelectCtl1" runat="server" SelectPage="SelectPage.aspx" />
SelectPage.aspx:
function GetRtn(rtnId,rtnText)
{
var obj = new Object();
obj.rtnId = rtnId;
obj.rtnText = rtnText;
window.returnValue= obj;
window.close();
}
