Как вытащить clientID кнопки asp: внутри asp: listview для использования с jQuery?

Question

Я пытаюсь сделать что-то, что должно быть относительно простым. Я использую ListView, чтобы показать несколько элементов, используя ItemTemplate. Внутри ItemTemplate у меня есть div, окружающий весь элемент, так что я могу выделить событие hover (которое уже обрабатывается jQuery).

То, что я хотел бы сделать, это вызвать событие нажатия кнопки div, чтобы открыть подробное представление для этого конкретного элемента. Проблема, с которой я столкнулся, заключается в получении идентификатора клиента для этой кнопки при использовании jQuery. Я попробовал:

$('#<%= Button1.ClientID %>')

route, но это не работает, так как кнопка не существует при загрузке страницы.

Основной код выглядит следующим образом:

<asp:listview>
 <itemtemplate>
  <td runat="server">
   <div class="container">
    <asp:linkbutton id="Button1" runat="server" text="View Details" />
     fun and exciting stuff here...
   </div>
  </td>
 </itemtemplate>
</asp:listview>

Любые предложения или помощь приветствуются!

Answer 1

Почему бы вам просто не дать этим ссылочным кнопкам определенный класс CSS?

<asp:linkbutton id="Button1" runat="server" text="View Details" CssClass="detailsButtons" />

Затем в jquery просто выберите класс, чтобы назначить их всех за один вызов.

$(".detailsButtons").click( function() { .... } );

Если это не сработает, потому что объекты не созданы в то время, вы можете использовать новый метод live() в jquery . Он также назначит события любым динамически добавляемым элементам.

Надеюсь, это поможет

Answer 2

Вместо использования скриптлета:

$('#<%= Button1.ClientID %>')

используйте связующее выражение:

$('#<%# Button1.ClientID %>')

Обратите внимание, что разница составляет # вместо = .

Выражения связывания оцениваются, когда данные связаны, и, следовательно, ваше выражение будет оцениваться в контексте текущего элемента данных. Скриплеты оцениваются при визуализации страницы (в самом конце жизненного цикла страницы) и оцениваются в контексте страницы, а не в отдельном элементе данных.

Answer 3

вы можете использовать cssclass, чтобы вызвать клик даже ..

<a class="confirm" id="alert" onmouseover="got('<%# Eval("Gift_ID") %>','<%= Session["member_id"] %>')">Redeem Now</a> 

и используйте jquery для запуска клика даже на основе этого класса.

$(function() {
        $(".confirm").easyconfirm();
        $(".confirm").click(function() {
            var id = document.getElementById("test").value;
            var mem_id = document.getElementById("test1").value;
            document.getElementById("test").setAttribute("value", "");
            document.getElementById("test1").setAttribute("value", "");
            var param = "{'id':'" + id + "','mem_id':'" + mem_id + "'}"
            $.ajax({

                type: "POST",
                url: "Offer.aspx/Hello_World",
                data: param,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async: true,
                cache: false,
                success: function(msg) {
                    alert("hello");
                    $('#myDiv').text(msg.d);

                }
            });

        });

    });

Answer 4

Подключите метод к событию ItemDataBound вашего ListView. Здесь вы можете использовать метод FindControl для свойства Item параметра ListViewItemEventArgs , чтобы получить ссылку на эту LinkButton для каждого элемента в вашем списке. Из этой ссылки вы можете получить ClientID и делать с ним все, что вам нужно.

UPDATE
С точки зрения того, что вы можете делать со ссылкой на кнопку, проще всего, вероятно, просто назначить событие click в событии ItemDataBound, может быть что-то вроде

var button = (Button)e.Item.FindControl("Button1");
button.OnClientClick = "ShowEditDialog(" + Eval("ItemId") + ")";

Если вам нужно подключить его на стороне клиента, возможно, вы могли бы сохранить словарь, сопоставляющий ClientIDs с идентификаторами элементов, и отправить этот словарь клиенту, где вы можете перебрать его и связать события.

Answer 5

Вы можете выбрать кнопки с этим синтаксисом (при условии, что Button1 - это идентификатор сервера кнопки):

$("[id$=Button1]")

, который выберет все элементы DOM, идентификатор которых заканчивается на «Button1».

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

Answer 6

Если вы используете событие click, не можете ли вы использовать свойство OnClientClick кнопки ссылки? или они убрали это в 3.5?