web-dev-qa-db-ja.com

Jquery非表示フィールド

この隠しフィールドの値を取得できないのはなぜですか？

コントロールがあります...

<asp:HiddenField ID="HiddenFieldServerDateTime" runat="server" />

としてレンダリング...

<input type="hidden" name="ctl00$cph_main$HiddenFieldServerDateTime" id="ctl00_cph_main_HiddenFieldServerDateTime" value="08/01/2010 10:54:11"

使用する価値を得ようとしている...

var serverDateTime = $("#HiddenFieldServerDateTime").attr('value');

それで何が問題なのでしょうか？

これが好き

var dateTime = $("[id$=_HiddenFieldServerDateTime]").val();
asp.netjqueryhidden-field
30
Dooie

JQueryは_asp:HiddenField_について何も知らないためです。 _<input type="hidden" name="ctl00$cph_main$HiddenFieldServerDateTime" id="ctl00_cph_main_HiddenFieldServerDateTime" ..._があるHTML構造を調べます。したがって、_ID= HiddenFieldServerDateTime_の入力はありません。これを克服する方法はいくつかあります。

  • CSSセレクターを使用します。

    _<asp:HiddenField ID="HiddenFieldServerDateTime" 
                 runat="server" 
                 CssClass="SomeStyle" />
_

    次のセレクターを使用：var serverDateTime = $(".SomeStyle").val();

    CssClassは HiddenField クラスで使用可能なクラスではありません（および Attributes コレクションを持たないため、手動で追加することはできません）。

  • ClientIDプロパティを使用します。

    _var serverDateTime = $("#<%= HiddenFieldServerDateTime.ClientID %>").val();
_

  • 非表示フィールドを選択可能なものでラップします。

    _<div class="date-time-wrap">
  <asp:HiddenField ID="..." runat="server" />
</div>
_

    _var serverDateTime = $('.date-time-wrap input[type=hidden]').val();
_
58
Darin Dimitrov

私はこれがすでに回答され解決されていることを知っていますが、ここには2つのより良い（私の意見では）とより簡単な選択肢があります。 .NET4（またはそれ以上）を使用している場合、ClientIDMode = "Static"を使用して、生成されたHTMLでIDを強制的に使用できます。

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

つまり、JQueryでこれを行うことができます。

var serverDateTime = $('#HiddenFieldServerDateTime').val();

または、cssクラスルートを使用する場合は、通常のASP：TextBox（CssClass属性があります）を使用しますが、表示はしません。

<asp:TextBox ID="HiddenFieldServerDateTime" runat="server" style="display:none" CssClass="MyStyle"></asp:TextBox>

これを行うことができます：

var serverDateTime = $('.MyStyle').val();

使用するcssクラスは、実際にどこでも宣言する必要がないことに注意してください。マーカーとして使用できます。

20
CodeClimber

私は同様の問題に遭遇しましたが、私の答えはHiddenFieldから継承してCssClassプロパティを与える新しいコントロールを作成することでした：

public class HiddenFieldWithClass : HiddenField
{
    [CssClassProperty]
    [DefaultValue("")]
    public virtual string CssClass 
    {
        get
        {
            string Value = this.ViewState["CssClass"] as string;
            if (Value == null)
                Value = "";
            return Value;
        }
        set
        {
            this.ViewState["CssClass"] = value;
        }
    }

    protected override void Render(HtmlTextWriter writer)
    {
        if (this.CssClass != "")
        {
            writer.AddAttribute(HtmlTextWriterAttribute.Class, this.CssClass);
        }
        base.Render(writer);
    }
}

クラスを非表示フィールドに割り当て、クラス値を使用してクライアント側で正しいフィールドを見つけることができるようになりました。

また、私の場合、隠しフィールドはコードビハインドで動的に作成されているため、デザイナーで使用するには上記の拡張機能が必要になる場合があることに注意してください。

これが途中で他の誰かを助けることを願っています。

10
Rozwel

これは、jQueryを使用して、_HiddenFieldServerDateTimeで終わるすべてのIDを選択することによっても機能します。

var myVal = $("[id$='_HiddenFieldServerDateTime']").val();
7
developerdoug

<input type="hidden" ID="HiddenFieldServerDateTime" runat="server" class="HiddenFieldServerDateTime" />

4
Matthew O'Leary

クラス属性「.myHiddenValue」をタグに追加してから使用します

var myVal = $(".myHiddenValue").val()

またはこれはドキュメントをロードした後にレンダリングされるため、私のアドバイスはこれを使用します

$(document).ready(function(){
   var myVal = $("input[name='ctl00$cph_main$HiddenFieldServerDateTime']").val();
 }
);

Note: also applies for the first example as well
1
Joberror