(十)ASP.NET自定义用户控件(3)

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

using HX.DHL.EIP.Services.Def.Localization;
using HX.DHL.EIP.Web.Framework;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Windows.Forms;namespace HX.DHL.EIP.Web.UserControl
{
public partial class TabLocatedRender : EIPUserControlBase
{
public ILanguageService Languageservice { get; set; }
public string FirstInputData="";
public string SecondInputData = "";
public string DefaultDivId = "";
//新建一个容器
StringBuilder LgTab = new StringBuilder();
protected void Page_Load(object sender, EventArgs e)
{ LgTab.Append("<div>");
LgTab.Append("<table style='padding: 0px; margin: 0px; height: 100%;' cellpadding='0' cellspacing='0'>");
LgTab.Append("<tr>");
LgTab.Append("<td id='menutab' style='vertical-align: bottom;'>");
LgTab.AppendLine("<input ID='CurrentLanguage' type='hidden' />");
LgTab.AppendLine("<input ID='FirstInput' type='hidden'/>");
LgTab.AppendLine("<input ID='SecondInput' type='hidden'/>");
//LgTab.Append("<form method='post' name='' action='~/Base/Language/Form.aspx'/>");
LgTab.AppendLine("<input ID='AllLocalData' name='AllLocalDataName' />");
//LgTab.Append("</form>");
//取数据库中语言
var lgdata = this.Languageservice.GetAllLanguages(false);
foreach (var lg in lgdata)
{
var innerHtml = lg.Name;
var divId = lg.LanguageCulture;
LgTab.AppendLine(string.Concat(new object[]
{
"<div id='",divId,"' onclick=\"ChangeDiv('",divId,"')\">"+innerHtml+"</div>"
}));
}
DefaultDivId = lgdata.First().LanguageCulture;
LgTab.Append(" <script type='text/javascript'>");
LgTab.AppendLine(string.Concat(new object[]
{
"document.getElementById(\"CurrentLanguage\").value = '",DefaultDivId,"';"
}));
LgTab.AppendLine(string.Concat(new object[]
{
"document.getElementById(\"FirstInput\").value = '",FirstInputData,"';"
}));
LgTab.AppendLine(string.Concat(new object[]
{
"document.getElementById(\"SecondInput\").value = '",SecondInputData,"';"
}));
LgTab.Append("var templg = $(\"#CurrentLanguage\").val();");
LgTab.Append("var FirstInputData = $(\"#FirstInput\").val();");
LgTab.Append("var SecondInputData = $(\"#SecondInput\").val();");
LgTab.Append("GetTabClick($(\"#\" + templg)[0]);");
LgTab.Append("var arr = new Array();");
LgTab.Append("var AllData=\"\";");
//多语言的字段需加属性onblur，失去焦点时保存本页多语言字段。
LgTab.Append("$(\"#\"+FirstInputData).onblur = SaveThisTab();");
LgTab.Append("$(\"#\"+SecondInputData).onblur = SaveThisTab();");
LgTab.Append(string.Concat(new object[]
{ "function ChangeDiv(divId){SaveThisTab(divId);ChangeTab(divId);TakeNextTab(divId);}"
}));
LgTab.Append(string.Concat(new object[]
{ "function ChangeTab(divId){ GetTabClick($(\"#\" + divId)[0]);document.getElementById(\"CurrentLanguage\").value = divId;}"
}));
LgTab.Append(string.Concat(new object[]
{
"function SaveThisTab(){ var ThisDivId = $(\"#CurrentLanguage\").val();var FirstInputDataString = $(\"#",FirstInputData,"\").val();var SecondInputDataString = $(\"#",SecondInputData,"\").val();arr[ThisDivId]=FirstInputDataString+\"|\"+SecondInputDataString;AllData=\"\";for(var lgId in arr){AllData=AllData+lgId+\":\"+arr[lgId]+\";\";}document.getElementById(\"AllLocalData\").value = AllData;}"
}));
LgTab.Append(string.Concat(new object[]
{
"function TakeNextTab(divId){document.getElementById(\"",FirstInputData,"\").value = null;document.getElementById(\"",SecondInputData,"\").value = null;if(arr[divId]!=null){var strs=arr[divId].split(\"|\");document.getElementById(\"",FirstInputData,"\").value = strs[0];document.getElementById(\"",SecondInputData,"\").value = strs[1];}}"
}));
LgTab.Append("</script>");
LgTab.Append("</td>");
LgTab.Append("</tr>");
LgTab.Append("</table>");
LgTab.Append("</div>"); lt.Text = LgTab.ToString();
}
public void GetInput(string inputone, string inputtwo)
{
FirstInputData = inputone;
//FirstInputData = "CurrentLanguage";
if (inputtwo == "")
{
SecondInputData = inputone;
}
else
{
SecondInputData = inputtwo;
}
}
}
}

上述是TabLocatedRender.ascx.cs的内容

然后在TabLocatedRender.ascx这里面放入一个占位符，插入后台的东西

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="TabLocatedRender.ascx.cs" Inherits="HX.DHL.EIP.Web.UserControl.TabLocatedRender" %>
<script src="/Themes/Scripts/Common/common.js"></script>
<asp:Literal ID="lt" runat="server"></asp:Literal>

然后一个简单的自定义控件就生成了。

这样的控件在使用的时候呢，Form.aspx必须要有@Register

<%@ Page Title="语言管理" Language="C#" MasterPageFile="~/Base/Base.Master" AutoEventWireup="true" CodeBehind="Form.aspx.cs" Inherits="HX.DHL.EIP.Web.Base.Language.Form" %><%@ Register Src="~/UserControl/TabLocatedRender.ascx" TagPrefix="uc1" TagName="TabLocatedRender" %><asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<uc1:TabLocatedRender runat="server" id="TabLocatedRender" />
<%-- <div>
<table style="padding: 0px; margin: 0px; height: 100%;" cellpadding="0" cellspacing="0">
<tr>
<td id="menutab" style="vertical-align: bottom;">
<asp:TextBox ID="CurrentLanguage" runat="server" CssClass="hidden"></asp:TextBox>
<script type="text/javascript">
function addDiv() {
var param = "";
AjaxAction('/Base/Language/Form.aspx', 'GetItems', param, function (rs) {
var items = rs.Data;
$.each(items, function (i, v) {
var item = v;
var div = document.createElement("div");
div.id = item.LanguageCulture;
div.innerHTML = item.Name;
div.onclick = function remo() {
CallWebMethod("ChangeTab", "", this.id);
};
menutab.appendChild(div);
}); //$("#tab1")[0] 其中$("#tab1")这个是jquery的对象，加[0]转换成document对象
var templg = $("#CurrentLanguage").val();
GetTabClick($("#" + templg)[0]);
}); }
</script>
</td>
</tr>
</table>
</div>--%>
<table class="frm" id="langTable">
<tr>
<th><span id="result_box" class="short_text" lang="zh-CN"><span>语言</span><span class="">文化</span></span>：
</th>
<td>
<select id="LanguageCulture" class="middleplus_width" runat="server" datatype="*1-20" enableviewstate="true"></select>
</td>
</tr>
<tr>
<th>
<%--<img src="/Themes/Images/16/flag_orange.png" />--%>
<span class="localization">名称：</span>
</th>
<td>
<input id="Name" runat="server" type="text" datatype="*1-20" class="localization_background" value="多语言字段"/>
</td>
</tr>
<tr>
<th><span id="result_box0" class="short_text" lang="zh-CN"><span class="">SEO代码</span></span>：
</th>
<td>
<input id="UniqueSeoCode" runat="server" type="text" datatype="*1-2" style="width:90%" />
</td>
</tr>
<tr>
<th>国旗图标：
</th>
<td>
<input id="txtFlagImageFileName" type="hidden" runat="server"/>
<img id="imgbutton" src="/Themes/Images/illustration.png" runat="server" alt=""
style="vertical-align: middle; padding-right: 10px;" />
<a id="selectFlag" href="javascript:void(0)" class="button green" onclick="SelectOpenImg()">选择国旗</a>
</td>
</tr>
<tr>
<th>从右到左：
</th>
<td>
<%--datacol="yes" err="自定义"--%>
<%--<input id="Rtl" runat="server" type="text" datatype="*1-20" style="width:90%" />--%>
<input id="Rtl" type="checkbox" runat="server" onclick="" style="width:90%" />
</td>
</tr>
<tr>
<th>语言编号：
</th>
<td>
<%--datacol="yes" err="自定义"这两个属性值目前是有没有都可以--%>
<input id="OrderID" runat="server" type="text" datatype="n1-20" style="width:90%" />
</td>
</tr>
</table> <div class="frm-bottom-center">
<asp:LinkButton ID="Save" runat="server" class="l-btn" OnClientClick="return Valid('form1');"
OnClick="Save_Click"><span class="l-btn-left">
<img src="/Themes/Images/disk.png" alt="" />保存</span></asp:LinkButton>
<a class="l-btn" href="javascript:void(0)" onclick="OpenClose();"><span class="l-btn-left">
<img src="/Themes/Images/cancel.png" alt="" />关闭</span></a> </div>
</asp:Content><asp:Content ID="Content3" ContentPlaceHolderID="FooterScript" runat="server">
<script type="text/javascript">
//初始化
$(function () {
// addDiv();
// var templg = $("#CurrentLanguage").val();
// GetTabClick($("#"+templg)[0]);
//var arrr = new Array();
//var a = "";
//arrr["qq"] = "qqq";
//arrr["ww"] = "www";
//for (var item in arrr) {
// alert(arrr[item]);
// a = a + item + ":" + arrr[item];
// alert(a);
//}
}) function onkeyButton_Name(text) {
$("#Button_Title").val(text);
}
//全取系统图标
function SelectOpenImg() {
var url = "/Base/Menu/IconsList.aspx?Size=16&prefix=flag";
top.openDialog(url, 'Icons_List', '国旗图标 - 全取', 615, 400, 100, 100);
}
//全取图标回调赋值
function Get_Menu_Img(img) {
$("#imgbutton").attr("src", '/Themes/Images/16/' + img);
$("#txtFlagImageFileName").val(img); } $("#txtType_0").click(function () {
$("#ImgType").attr("disabled", true);
$("#Src").attr("disabled", true);
});
$("#txtType_1").click(function () {
$("#ImgType").attr("disabled", false);
$("#Src").attr("disabled", false); }); </script></asp:Content>