Как сделать идентификаторы компонентов (Div, a, h1 и т. Д.) Веб-страницы динамическими (переменными?) С использованием MVC2?

Question

Я пытаюсь сделать следующее: У объекта, который я передаю на страницу просмотра, есть список, я делаю foreach в HTML и создаю несколько компонентов. Теперь я хочу, чтобы идентификаторы этих компонентов были как-то связаны с объектом из Списка.
(Причина, по которой я пытаюсь это сделать, заключается в том, что я хочу показать кнопку, когда они нажимают эту кнопку, показанный контент изменится, и они должны увидеть что-то другое, для этого я буду использовать javascript)

Поэтому я пытаюсь сделать идентификатор этих компонентов динамическим, например, указав
id="button <%= item.id%> "однако это, похоже, не работает. Я много искал в Google, но пока не нашел решения, поэтому обращаюсь к вам, ребята.

Я тоже свяжу свой код, я удалил некоторые ненужные части (но добавил javascript):

<script type="text/javascript">
    function AlterPanel(thePanel) {
    var panel = document.getElementById("region"+thePanel);
    panel.style.display = 'block';
    var button = document.getElementById("button"+thePanel);
    button.style.display = 'none';}
</script>
<%foreach (TeamDTO team in Model.List.Teams)
     { %>
    <a id="button<%= team.Number %>" onclick="AlterPanel(<% team.Number%>)">
    Add member</a>
    <div Visible="false" id='region<%= team.Number %>' runat="server">
        Please select one: 
        <%: Html.DropDownListFor(V => V.memberID, new SelectList(Model.members, "ID","Name")) %>
    </div>
<% } %>

Я с нетерпением жду ответа и заранее благодарю.

Answer 1

Полагаю, ваш вопрос: - у вас есть пара «button DropDownList», кнопка видима, DropDownList невидим, теперь, если пользователь нажимает кнопку, DropDownList будет отображаться.

ОК, теперь ваш вид может быть:

<%foreach (TeamDTO team in Model.List.Teams)
     { %>
    <a onclick="AlterPanel(<% team.Number%>)">
    Add member</a>
    <div id="region<%= team.Number %>" style="display:none">
        Please select one: 
        <%: Html.DropDownListFor(V => V.memberID, new SelectList(Model.members, "ID","Name")) %>
    </div>
<% } %>

Я использую JQuery в части JavaScript, как это:

<script type="text/javascript">
    function AlterPanel(thePanel) {
        $("#region" + thePanel.toString()).css("display", "block");
    }
</script>

Не забудьте включить следующий файл в View ():

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>"></script>

если ответ не тот, который вы хотите, дайте знать, и я могу вам помочь ~:)