Как использовать традиционный атрибут HTML id с тегом ASP.net runat = 'server'?

Question

Я рефакторинг некоторых CSS на веб-сайте. Я работал над этим и заметил отсутствие в коде традиционных HTML-идентификаторов.

Широко используется CssClass='…', а иногда просто class='…', но я не могу найти способ сказать id = '& hellip;' и не выгружается сервером.

Вот пример:

<span id='position_title' runat='server'>Manager</span>

Когда ответ возвращается с сервера, я получаю:

<span id='$aspnet$crap$here$position_title'>Manager</span>

Любая помощь здесь?

Answer 1

Используйте jQuery, чтобы выбрать элемент:

$("span[id$='position_title']")....

Гибкие селекторы jQuery, особенно его «начинается с» / «заканчивается селекторами» (селектор «заканчивается с», как показано выше), обеспечивают отличный способ решения dom id munge в ASP.NET.

гр

Answer 2

«Дерьмо», помещенное перед идентификатором, связано с контейнером (ами) элемента управления, и, насколько я знаю, нет способа предотвратить это поведение, кроме как не помещать его в какой-либо контейнер.

Если вам нужно обратиться к идентификатору в скрипте, вы можете использовать ClientID элемента управления, например так:

<script type="text/javascript">
    var theSpan = document.getElementById('<%= position_title.ClientID %>');
</script>

Answer 3

Большинство исправлений подсказывают, что она излишня из-за очень простой проблемы. Просто используйте отдельные элементы div и span, на которые вы ориентируетесь с помощью CSS. Не используйте целевой элемент управления ASP.NET напрямую, если хотите использовать идентификаторы.

  <span id="FooContainer">
     <span runat="server" id="Foo" >
         ......
     <span>
  </span>

Answer 4

Вы можете встроить свой CSS в страницу, обсыпанную некоторыми серверными тегами, чтобы решить эту проблему. Во время выполнения блоки кода будут заменены на идентификаторы, сгенерированные ASP.NET.

Например:

[style type = "text / css"] # <% = AspNetId.ClientID%> { ... стили идут сюда ... } [/ Стиль]

[script type = "text / javascript"] document.getElementById ("<% = AspNetId.ClientID%>"); [/ Скрипт]

Вы можете пойти немного дальше и получить несколько файлов кода, которые также генерируют CSS, если вы хотите, чтобы ваш CSS содержался в отдельном файле.

Кроме того, я могу немного попрыгать здесь, но вы можете использовать материал ASP.NET MVC (еще не выпущенный официально на момент написания этой статьи), который убирается из веб-форм и дает вам полный контроль над разметкой генерируется.

Answer 5

.Net всегда будет заменять ваши значения идентификаторов каким-либо искаженным (немного предсказуемым, но все же не рассчитанным на это) значением. Вы действительно должны иметь этот идентификатор runat = server? Если вы не введете runat = server, то он не будет портить его ...

ДОБАВЛЕНО: Как сказал leddt, вы можете ссылаться на span (или любой runat = сервер с идентификатором), используя ClientID, но я не думаю, что это работает в CSS.

Но я думаю, что у вас есть большая проблема, если ваш CSS использует селекторы на основе ID. Вы не можете повторно использовать идентификатор. Вы не можете иметь несколько элементов на одной странице с одним и тем же идентификатором. .Net будет жаловаться на это.

Итак, учитывая это, ваша работа по рефакторингу CSS становится немного больше по объему?

Answer 6

Я уверен, что это было задано здесь, по крайней мере, один раз раньше. Термин «жонглирование». Рич Штраль написал об этом пост и в 2006 году.

Answer 7

Я обычно делаю свой собственный элемент управления, который расширяет WebControl или HtmlGenericControl, и я перезаписываю ClientID - возвращая свойство ID вместо сгенерированного ClientID. Это приведет к тому, что любое преобразование .NET к ClientID из-за именования контейнеров будет возвращено к исходному идентификатору, который вы указали в разметке тега. Это замечательно, если вы используете клиентские библиотеки, такие как jQuery, и вам нужны предсказуемые уникальные идентификаторы, но это сложно, если вы полагаетесь на viewstate для чего-либо на стороне сервера.

Answer 8

Есть ли конкретная причина, по которой вы хотите, чтобы элементы управления были runat = "server"?

Если это так, я использую . , ,

Это должно сделать всю работу за вас, так как вы все равно сможете редактировать данные в коде позади.

Answer 9

Если вы боитесь classitus, попробуйте использовать идентификатор родительского или дочернего селектора, который содержит элемент, который вы хотите стилизовать. К этому родительскому элементу НЕ должен применяться сервер runat. Проще говоря, это хорошая идея, чтобы планировать свои структурные контейнеры так, чтобы они не выполняли код (то есть не запускали), чтобы вы могли получить доступ к основным частям вашего приложения / сайта, используя неизмененные идентификаторы. Если это слишком поздно, добавьте упаковщик div / span или используйте решение класса, как указано.

Answer 10

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

1 - Пролетные гнезда, один с runat = "server", один без:

<style type="text/css">
#position_title { // Whatever
}
<span id="position_titleserver" runat="server"><span id="position_title">Manager</span></span>

2 - Как предложил Джоэл Кохорн, используйте уникальное имя класса. Уже используете класс для чего-то? Не имеет значения, вы можете использовать более 1! Это ...

<style type="text/css">
.position_title { font-weight: bold; }
.foo { color: red; }
.bar { font-style: italic; }
</style>
<span id="thiswillbemangled" class="foo bar position_title" runat="server">Manager</span>

... отобразит это:

Менеджер

3 - написать функцию Javascript для исправления идентификаторов после загрузки страницы

function fixIds()
{
    var tagList = document.getElementsByTagName("*");
    for(var i=0;i<tagList.length;i++)
    {
        if(tagList[i].id)
        {
            if(tagList[i].id.indexOf('$') > -1)
            {
                var tempArray = tagList[i].id.split("$");
                tagList[i].id = tempArray[tempArray.length - 1];
            }
        }
    }
}