如何在控件vb.net中将参数从javascript传递到隐藏字段

Question

我的控件有两个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

提前致谢

Answer 1

您可以像这样使用JQuery

示例：

$("input[type=hidden][id='<%=tabTitle.ClientID%>']").val("Hello World"); 
$("input[type=hidden][id='<%=tabMenu.ClientID%>']").val("Hello World"); 

Answer 2

如果您使用的是ASP.NET 4.0，最好的办法是将这些控件上的ClientIDMode属性设置为静态，然后使用javascript使用普通的“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

的所有输入元素

Answer 3

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

如果您使用ClientIDMode=Static，您将面临的问题是，您只能在页面中添加一个alarm:SubscriptionPanel控件

如果您打算在每个页面上仅使用一个控件，那么最简单的方法是@Icarus 评论的方法，但我会将其视为时间方法

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

输出

ASCX

<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库。

ASCX

更改：$("#<%: 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");

使用这种方法，您可以删除.data jQuery函数

的使用