2

我有一个有两个的控件asp:HiddenField

  <asp:HiddenField runat="server" ID="tabTitle" />
  <asp:HiddenField runat="server" ID="tabMenu" />

此控件加载到一个名为Alarms

页面上的控件alarms如下所示

     <alarm:SubscriptionPanel ID="pnlSubscription" runat="server" />

我试图做的是将值从页面传递alarms到，control hidden fields并且在控制代码后面有一个函数可以读取隐藏字段的值

问题是我如何将 javascript 值传递给控件中的隐藏字段on page load

提前致谢

4

3 回答 3

4

你可以像这样使用 JQuery

例子 ：

$("input[type=hidden][id='<%=tabTitle.ClientID%>']").val("Hello World"); 
$("input[type=hidden][id='<%=tabMenu.ClientID%>']").val("Hello World");
于 2012-07-31T19:15:09.157 回答
2

如果您使用的是 ASP.NET 4.0，最好的办法是将ClientIDMode这些控件上的属性设置为静态，然后简单地使用 javascript 使用普通 ol' 填充隐藏元素document.getElementById()。像这样的东西：

<asp:HiddenField runat="server" ID="tabTitle" ClientIDMode="Static" />


//since the id mode in the hidden element is static; 
//you should be able to do this safely:
document.getElementById('tabTitle').value = myvalue;

如果您不在 ASP.NET 4.0 上；jQuery 在这里会有所帮助，因为您可以使用部分匹配找到一个元素，正如 HatSoft 在他的回答中向您展示的那样，但略有不同：

$("input[type=hidden][id*='tabTitle']").val("Hello World");

注意id*=部分。这将获取其 id 包含单词的所有输入元素tabTitle

于 2012-07-31T19:19:22.830 回答
2

除了@Icarus 评论的方法之外，您还可以从您的控件中公开一个 JavaScript 函数。

如果您在其中使用您将面临的问题ClientIDMode=Static，您将被限制alarm:SubscriptionPanel为您的页面仅添加一个控件

如果您打算在每个页面上只使用一个控件，那么最简单的方法是 @Icarus 评论的那个，但是我认为它是一种临时方法

这个替代方案在自定义控件中封装了它真正属于的逻辑：

输出

在此处输入图像描述

澳交所

<div id="<%: this.ClientID %>">
    <asp:HiddenField runat="server" ID="hidden1" Value="one" />
    <asp:HiddenField runat="server" ID="hidden2" />
    <asp:Button Text="Post me" runat="server" OnClick="postme_Click" />
    <asp:Label runat="server" ID="lbl"></asp:Label>
    <script type="text/javascript">
        $(function () {
            var myObj = {
                setHidden1: function (myValue) {
                    $("#<%: this.hidden1.ClientID %>").val(myValue);
                },
                getHidden1: function () {
                    return $("#<%: this.hidden1.ClientID %>").val();
                },
                helloWorld: function () {
                    alert("hellow world");
                }
            };
            $("#<%: this.ClientID %>").data("data", myObj);
        });
    </script>
</div>

背后的 ASCX 代码

    protected void postme_Click(object sender, EventArgs e)
    {
        this.lbl.Text = "Posted: " + this.hidden1.Value;
    }

ASPX

    <script type="text/javascript">
        $(function () {
            $("#myPageButton").click(function () {
                $("#<%: this.myControl.ClientID %>").data("data").setHidden1("plop");
                $("#<%: this.myControl2.ClientID %>").data("data").setHidden1("plop2");
            });
        });
    </script>
    <input type="button" id="myPageButton" value="Set Hidden value" />
    <uc1:EncapsulateJavaScriptLogicInUserControl ID="myControl" 
        runat="server" />
    <uc1:EncapsulateJavaScriptLogicInUserControl ID="myControl2" 
        runat="server" />
    <uc1:EncapsulateJavaScriptLogicInUserControl ID="myControl3" 
        runat="server" />

我刚刚找到了另一种方式，看起来更加面向对象，但是，它需要您使用 Microsoft AJAX 库。

澳交所

改变：$("#<%: this.ClientID %>").data("data", myObj);

进入：$.extend($get("<%: this.ClientID %>"), myObj);

ASPX

改变：

$("#<%: this.myControl.ClientID %>").data("data").setHidden1("plop");
$("#<%: this.myControl2.ClientID %>").data("data").setHidden1("plop2");

进入：

$get("<%: this.myControl.ClientID %>").setHidden1("plop");
$get("<%: this.myControl2.ClientID %>").setHidden1("plop2");

使用这种方法，您可以删除.datajQuery 函数的使用

于 2012-07-31T22:17:03.330 回答