Получение идентификатора с сервера runat asp.net в jQuery - PullRequest
Новая
       44

Получение идентификатора с сервера runat asp.net в jQuery

7 голосов
/ 22 марта 2011

Я пытаюсь сделать некоторые вещи в jQuery с помощью ASP.NET.Но идентификатор из runat="server" не совпадает с идентификатором, используемым в HTML.

Я использовал его для получения идентификатора из этой ситуации: 

$("#<%=txtTest.ClientID%>").val();

Но в этом случае, это не работает.Я не знаю, почему.

Javascript 

/* Modal */
function contatoModal() {
    //alert("Test");
    alert($("#<%=txtTest.ClientID%>").val());
}

HTML 

< input runat="server" id="txtTest" value="test" />

Есть советы?

Ответы [ 7 ]

19 голосов
/ 22 марта 2011

<%= txtTest.ClientID %> должно работать, но не в отдельном файле javascript, где серверные сценарии не выполняются.Другая возможность заключается в использовании селектора класса: 

<input runat="server" id="txtTest" value="test" class="txtTest" />

, а затем: 

var value = $('.txtTest').val();
5 голосов
/ 25 августа 2014

Как уже упоминалось, вы можете передать селектор класса в jQuery, но это немного грязно.Я предпочитаю использовать атрибут jQuery, заканчивающийся селектором .Учитывая, что сгенерированный идентификатор представляет собой сплющенную иерархию элементов управления, вы можете использовать селектор «заканчивается с», чтобы найти ваш элемент. 

<input runat="server" id="txtText" />

При визуализации сгенерированный идентификатор становится примерно таким (если внутри главной страницызаполнитель содержимого): 

<input id="ctl00_contentplaceholder_txtText" />

Чтобы найти этот элемент управления: 

$("input[id$='txtText']")

Будьте осторожны при использовании этого в повторителе.

4 голосов
/ 20 августа 2016

В WebForm / HTML-странице .... 

<asp:TextBox ID="txtUserName" runat="server" Class="form-control"></asp:TextBox>

В Jquery 

var UserName = $("[id*=txtUserName]").val();
alert(UserName);

100% уверен, что это работает для меня ....

2 голосов
/ 13 марта 2014

Как Дарин Димитров сказал в своем ответе:

<%= txtTest.ClientID %> должно работать, но не в отдельном JavaScript файл, в котором сценарии на стороне сервера не выполняются .

Решения, которые я мог бы найти для них: 

<input runat="server" id="txtTest" value="test" class="txtTest" />
  • Используйте class вместо ID

Используя класс, вы можете получить значение в любом месте. Это одно из лучших решений (как правило, лучшее) 

var value = $('.txtTest').val();
  • Используйте ClientID код в aspx

Вы всегда можете позвонить ClientID в aspx, но если вы работаете с какой-то структурой, это не лучшее решение. Мне нравится использовать этот метод, когда я что-то тестирую. 

var value = $('#<%=txtTest.ClientID%>').val();

Вы также можете использовать ClientID во внешнем js-файле с обходным решением. ЭТО НЕ ХОРОШО , используйте, только если вам это действительно нужно. Я обычно делаю это, когда использую Telerik.

В aspx: 

var id = <%=txtTest.ClientID%>;

В файле js: 

var value = $('#'+id).val();

так что HTML становится 

<input runat="server" id="txtTest" value="test" ClientIDMode="Static" />

и js может назвать его так, как он назван 

var value = $('#txtTest').val();

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

Как говорится в MSDN:

Значение ClientID установлено равным значению свойства ID. Если Элемент управления является контейнером именования, элемент управления используется как верх иерархия именования контейнеров для любых элементов управления, которые она содержит.

Ссылка shaans's answer - отличное место для проверки дополнительной информации о ClientIDMode.

Очистка HTML-разметки с помощью ASP.NET 4 Web Forms - идентификаторы клиентов (VS 2010 и .NET 4.0 Series)

2 голосов
/ 22 марта 2011

Когда используется ASP.NET 4 и ClientIDMode установлен в «Предсказуемый», вы можете прогнозировать идентификатор на основе иерархии.Или установите для него значение «Static», чтобы asp.net не испортил его.

Статья ScottGu об этом http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx

И это чрезвычайно полезно при использовании сценариев с внешними JS-файлами.

2 голосов
/ 22 марта 2011

Попробуйте поместить его в имя переменной: 

var txtTestID = '#' + '<%=txtTest.ClientID %>';

$(txtTestID).val();

Я не уверен, нравится ли <%= в двойных кавычках. У меня всегда было смешанное поведение, когда я не использовал одинарную кавычку.

0 голосов
/ 22 марта 2011

Чтобы избежать проблем с визуализированными идентификаторами, используйте вместо этого класс. Это не изменится во время рендеринга: 

function contatoModal() {

//alert("Test");

alert($(".txtTest").val());

}

HTML: 

< input runat="server" id="txtTest" value="test" class="txtText" />
...