如何获得web用户控制';的文本框值

本文关键字:文本 何获得 web 用户 控制 | 更新日期: 2023-09-27 18:19:51

我正在使用Ajax日历扩展程序开发一个日历用户控件。

用户控制代码

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" ClientIDMode="Predictable" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxControl" %>
<link rel="stylesheet" href="GridViewCSSThemes/YahooGridView.css" type="text/css" media="screen" />
<div style="position:relative;border:none;">
    <asp:TextBox ID="txtDate" MaxLength="10" ToolTip="DD/MM/YYYY" Width="100"
        CssClass="tb10" runat="server">
    </asp:TextBox>
    <asp:ImageButton ImageUrl="~/GridViewCSSThemes/Images/Calendar_scheduleHS.png" ID="imgCalender" runat="Server"
        BorderWidth="0" ImageAlign="absmiddle" />
    <ajaxControl:CalendarExtender ID="AjaxCalenderCtrl" runat="server" Format="dd/MM/yyyy" PopupPosition ="TopLeft" 
        TargetControlID="txtDate" CssClass="red" FirstDayOfWeek="Sunday" PopupButtonID="imgCalender">
    </ajaxControl:CalendarExtender>
    <ajaxControl:TextBoxWatermarkExtender WatermarkCssClass="tb10" ID="txtWaterMarkDate"
        runat="server" WatermarkText="DD/MM/YYYY" TargetControlID="txtDate">
    </ajaxControl:TextBoxWatermarkExtender>
    <ajaxToolkit:MaskedEditExtender ID="MaskedEdit_dt" runat="server"
        TargetControlID="txtDate"
        Mask="99/99/9999"
        MessageValidatorTip="true"
        OnFocusCssClass="MaskedEditFocus"
        OnInvalidCssClass="MaskedEditError"
        MaskType="Date"
        AcceptAMPM="true"
        AcceptNegative="Left"
        ErrorTooltipEnabled="True" />
    <ajaxToolkit:MaskedEditValidator ID="MaskedEditV_dt" runat="server"
        ControlExtender="MaskedEdit_dt"
        ControlToValidate="txtDate"
        EmptyValueMessage="Date is required"
        InvalidValueMessage="Date is invalid"
        Display="Dynamic"
        TooltipMessage="Input a date"
        EmptyValueBlurredText="Date is required"
        InvalidValueBlurredMessage="Date is invalid"
        IsValidEmpty="false"
        ValidationGroup="MKE" />
    <%--<asp:RegularExpressionValidator ID="regexpvalEndDateEdit" ErrorMessage="!" ValidationExpression="(0[1-9]|[12][0-9]|3[01])[- /.](0[1-9]|1[012])[- /.](19|20)'d'd"
        ControlToValidate="txtDate" runat="server"></asp:RegularExpressionValidator>--%>
</div>

用户控件背后的代码

internal string _DValue;
public string DValue
{
    get
    {
        if (_DValue == "")
        {
            _DValue = txtDate.Text;
        }
        else
        {
            txtDate.Text = _DValue;
        }
        return _DValue;
    }
    set { _DValue = value; }
}
public string IdClientId
{
    get { return this.ClientID; }
}
protected void Page_Load(object sender, EventArgs e)
{
}

我能够使用服务器端代码获得控件值。现在我需要从javascript访问文本框(txtDate)值和MaskedEditValidator(MaskedEdit V_dt)inerHtml。我怎么能做到这一点。

第1版

aspx页面中的用户控件

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CustomControlTest2.aspx.cs" Inherits="CustomControlTest2" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxControl" %>
<%@ Register TagPrefix="uc1" TagName="UCCalender" Src="~/WebUserControl.ascx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
  <title>User Control Test</title>
</head>
<body>
<form id="form1" runat="server">
<ajaxToolkit:ToolkitScriptManager runat="server" ID="ScriptManager1" EnablePageMethods="true" />
<div>
    <table>
        <tr>
            <td>
                <uc1:UCCalender ID="UCCalStartDate" runat="server" DValue="" />
            </td>
        </tr>
        <tr>
            <td>
                <asp:Button ID="btnExe" runat="server" Text="Submit" onclick="btnExe_Click" />
            </td>
        </tr>
        <tr>
            <td>
                <asp:Label ID="lblMsg" runat="server" Text="Label"></asp:Label>
            </td>
        </tr>
    </table>
</div>
</form>

代码隐藏

protected void btnExe_Click(object sender, EventArgs e)
{
    lblMsg.Text = UCCalStartDate.DValue;
}

如何获得web用户控制';的文本框值

ASP.NET加载以显示UserControl,它仅呈现UserControl的内容。用户控件中的控件将以ID $content_UControlName_Control呈现。您可以在呈现页面后进行检查。您可以使用document.getElementById(content_UControlName_Control)之类的Javascript中的ID来访问控件。

最后我得到了答案。感谢Nag

单击按钮

<asp:Button ID="btnExe" runat="server" Text="Submit" OnClientClick="getValue('UCCalStartDate_txtDate','UCCalStartDate_MaskedEditV_dt');" onclick="btnExe_Click" />

Javascript

function getValue(id,msk) {
        alert(document.getElementById(id).value);
        alert(document.getElementById(msk).innerHTML);
    }

最后,我可以使用java脚本访问calander控件的文本框值