(十)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>

这样就加入了该文件中的内容