利用ascx输出knockoutjs的模板
项目里面的UI模板在一个页面中有2K多行了.需要增加新的UI样式.问题来了.加上js代码,几乎是变成了不可维护的状态.增加和修改都需要用ctrl+f的方式找到对应的模板,然后进行处理.很容易出错.突然想到了ascx,可以很方便的在apsx上面控制是否输出.那就用它来做吧.但是有一点不同的是,只有ascx文件,没有对应的.cs文件.对应的.cs文件是另外继承了usercontroll类的文件.不需要加入新的ascx还要编译.一个demo:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="~/wx/uibase/MyUserControll.cs" Inherits="WJWXWeb.wx.uibase.MyUserControll" %>
<script type="text/template" id="editormap-template">
<div class="closeModel" data-bind="click: $root.closeMe">
<span class="myicon">×</span>
</div>
<div>
<div id="modalcontent">
<div class="content" style="background-color: #f5f5f5;">
<div class="orderheader">
<div class="ui-grid">
<div class="ui-block-a">
<img src="../images/landmark.png" />
</div>
<div class="ui-block-b" style="height: 34px; line-height: 34px;">
<span data-bind="text: $root.orderinfo.mapaddress">hello word</span>
</div>
</div>
</div>
<div style="padding: 10px; background-color: #fff;">
<table style="width: 100%;">
<tr style="height: 55px; border-bottom: 1px solid #f2f2f2;">
<td style="width: 60px">详细地址</td>
<td>
<input type="text" data-bind="textInput: address" placeholder="A栋27楼207室" style="margin: 2px; height: 100%; width: 100%; margin: 0; border: none;" /></td>
<td style="color: red;">*</td>
</tr>
<tr style="height: 55px; border-bottom: 1px solid #f2f2f2;">
<td style="width: 60px">联系电话</td>
<td>
<input type="text" data-bind="textInput: ordertel" style="margin: 2px; height: 100%; width: 100%; margin: 0; border: none;" /></td>
<td style="color: red;">*</td>
</tr>
<tr style="display: none;">
<td>联系人</td>
<td>
<input type="text" data-bind="textInput: orderman" style="margin: 2px; height: 100%; width: 100%" /></td>
<td style="color: red;">*</td>
</tr>
</table>
</div>
</div>
<div class="bar bar-standard bar-footer mybar">
<a class="pull-right canpay" style="width: 100%;" data-bind="click: SaveAddress">确定</a>
</div>
</div>
</div>
</script>
</script>
aspx页面的代码.
<%@ Register TagPrefix="uiv1" TagName="editormap" Src="~/wx/uiv1/editormap.ascx" %>
输出
<uiv1:editormap runat="server" />
打完收猫.
页面上面有太多的uiv1:editormap和<%@ Register，要是能在cs文件中，动态加载？
{
/// <summary>
/// 加载数据
/// </summary>
/// <param name="datasource"></param>
/// <param name="datafilter"></param>
public virtual void ondatainit(object datasource, string datafilter)
{
}
{
var controltemplate = LoadControl("~/webparts/contacts.ascx") as webpart;
controltemplate.ondatainit(null, Request["id"]??"");
MyLog.Log(RenderControlAsString(controltemplate));
MyLog.Log(RenderControlAsString(LoadControl("~/webparts/footer.ascx")));
}
{
StringWriter sw = new StringWriter();
HtmlTextWriter writer = new HtmlTextWriter(sw);
ctl.RenderControl(writer);
string str = sw.ToString();
writer.Close();
sw.Close();
return str;
}
{
StringWriter sw = new StringWriter();
HtmlTextWriter writer = new HtmlTextWriter(sw);
ctl.RenderControl(writer);
string str = sw.ToString();
writer.Close();
sw.Close();
return str;
}
