代码之家 › 专栏 › 技术社区 › Mina Gabriel

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

vb.net asp.net c#

Mina Gabriel · 技术社区 · 14 年前

我有一个有两个的控制器 asp:HiddenField

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

该控件加载在名为 Alarms

对的控制 alarms 页面看起来像这样

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

iam试图做的是从页面传递值 警报器 到 control hidden fields 在后面的控制代码处有一个函数,用于读取隐藏字段值

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

提前感谢

3 回复 | 直到 14 年前

HatSoft 14 年前

您可以这样使用JQuery

示例:

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

Icarus 14 年前

如果您使用的是ASP.NET 4.0,最好将 ClientIDMode 属性设置为static,然后简单地使用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

Jupaol 14 年前

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

如果你使用 ClientIDMode=Static 在这种情况下,您将被限制只能添加一个 alarm:SubscriptionPanel 控制到您的页面

如果您计划使用 每个页面上只有一个控件,那么最简单的方法是@Icarus评论的方法 ,但我认为 时间方法

此备选方案 在自定义控件中封装其真正所属的逻辑:

输出

enter image description here

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" />

我刚刚找到了另一种方法,看起来更面向对象,然而,它需要使用MicrosoftAJAX库。

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函数