Jquery скрытое поле

Question

Почему я не могу получить значение этого скрытого поля?

У меня есть контроль ...

<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();

Answer 1

Потому что jQuery ничего не знает о asp:HiddenField. Это выглядит в структуре HTML, где у вас есть <input type="hidden" name="ctl00$cph_main$HiddenFieldServerDateTime" id="ctl00_cph_main_HiddenFieldServerDateTime" .... Так что нет ввода с 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();
  

Answer 2

Я знаю, что это уже было решено, но есть две лучшие (на мой взгляд) и более простые альтернативы. Если вы используете .NET4 (или выше), вы можете использовать ClientIDMode = "Static", чтобы ваш идентификатор использовался в сгенерированном HTML:

<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, который вы используете, фактически нигде не должен быть объявлен. Вы можете просто использовать его как маркер.

Answer 3

Я только что столкнулся с подобной проблемой, и мой ответ заключался в создании нового элемента управления, который наследуется от 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);
    }
}

Теперь я могу назначить класс своим скрытым полям и использовать значение класса, чтобы найти правильное поле на стороне клиента.

Стоит также отметить, что в моем случае скрытые поля динамически создаются в коде позади, приведенному выше могут потребоваться некоторые улучшения для использования в конструкторе.

Надеюсь, это поможет кому-то еще на этом пути.

Answer 4

Это также будет работать при использовании jQuery для выбора всех идентификаторов, заканчивающихся на _ HiddenFieldServerDateTime .

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

Answer 5

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

Answer 6

Добавьте атрибут класса ".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