(十)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>
这样就加入了该文件中的内容
