Как перехватить событие нажатия кнопки «Обновить» в ASP.NET GridView с помощью jQuery

Question

Мне нужно захватить событие нажатия кнопки «Обновить» с помощью jQuery в asp.net GridView, и у меня нет возможности узнать, с чего начать.Я все еще довольно плохо знаком с JQuery.Мой GridView подключен к источнику SQLDataSource и, естественно, имеет все навороты, которые дает эта комбинация.Любая помощь будет принята с благодарностью.

Answer 1

Просто добавьте блок скрипта в любом месте после объявления GridView, и он должен работать со стандартным столбцом GridView без шаблонов.В коде нет кода, так как это чисто решение Javascript.

Используйте это, если вы используете столбец GridView типа Link:

<script type="text/javascript">
    // a:contains(The text of the link here)
    $('#<%= theGridViewID.ClientID %> a:contains(Update)').click(function () {
        alert('Update click event captured from the link!');
        // return false: stop the postback from happening
        // return true or don't return anything: continue with the postback
    });
</script>

Используйте это, если вы используете Button-введите столбец GridView, и вы не хотите, чтобы ваш Javascript блокировал обратную передачу:

<script type="text/javascript">
    // :button[value=The text of the button here]
    $('#<%= theGridViewID.ClientID %> :button[value=Update]').click(function () {
        alert('Update click event captured from the button!');
    });
</script>

Используйте это, если вы используете столбец типа GridView типа Button, и вы хотите иметь контроль, продолжать ли обратную передачуnot:

<script type="text/javascript">
    // :button[value=The text of the button here]
    var updateButtons = $('#<%= theGridViewID.ClientID %> :button[value=Update]');
    updateButtons
        .attr('onclick', null)
        .click(function () {
            alert('Update click event captured from the button!');
            var doPostBack = true; // decide whether to do postback or not
            if (doPostBack) {
                var index = updateButtons.index($(this));
                // 'Update$' refers to the GridView command name + dollar sign
                __doPostBack('<%= theGridViewID.UniqueID %>', 'Update$' + index);
            }
        });
</script>

---

Обновление: Я думаю, что это было бы лучшим решением вместо последнего (третьего) блока скриптов, который я представил выше, так как вам не нужнообновлять вызов функции __doPostBack вручную на основе имени команды, и поэтому оно должно быть менее подвержено ошибкам:

<script type="text/javascript">
    // :button[value=The text of the button here]
    var updateButtons = $('#<%= theGridViewID.ClientID %> :button[value=Update]');
    updateButtons.each(function () {
        var onclick = $(this).attr('onclick');
        $(this).attr('onclick', null).click(function () {
            alert('Update click event captured from the button!');
            var doPostBack = true; // decide whether to do postback or not
            if (doPostBack) {
                onclick();
            }
        });
    });
</script>

Благодарим Аристоса за эту идею.:)

Answer 2

Хорошо, вот мое решение для захвата только одного обновления (или более) с кнопки.

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

<script type="text/javascript">         
  function NowRunTheUpdate(){
      alert("ok I capture you");
  } 
</script>

и воткод страницы

    `<asp:GridView ID="MyGridView" runat="server" OnRowDataBound="MyGridView_RowDataBound" ... >`

    <asp:ButtonField Text="update" CommandName="Update" ButtonType="Button" />  
  ...

Вот код, который запускается и устанавливает JavaScript.

protected void MyGridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // loop all data rows
        foreach (DataControlFieldCell cell in e.Row.Cells)
        {
            // check all cells in one row
            foreach (Control control in cell.Controls)
            {
                // I go to get the button if exist
                Button button = control as Button;
                if (button != null && button.CommandName == "Update")
                    // Add delete confirmation
                    button.OnClientClick = "NowRunTheUpdate();";
            }
        }
    }
}

Answer 3

Gridview - это не что иное, как таблица с кучей "tr" и "td". Если вы понимаете эту концепцию, вам будет легко справиться с чем-либо на стороне клиента. Если вы активировали auto all, то это будет ссылка, которая приведет к редактированию, удалению, обновлению или отмене (проверка просмотра источника). Приведенный ниже код должен зафиксировать событие нажатия кнопки обновления:

    $("a:contains(Update)").live("click", function() { 
   //alert("hi"); do what needs to be done
    return false;//would not sent the control back to server 
    });

НТН

Answer 4

Добавление столбца обновления в шаблоны столбца. Преобразуйте его в пользовательский столбец и измените его таким образом, чтобы к нему можно было подключиться с помощью jquery, например, добавив в него класс css.

Answer 5

Необходимо подключить прослушиватель событий на стороне клиента к событию click кнопки Update [link].Я не думаю, что это можно сделать с помощью AutoGenerateEditButton = "true", если вы делаете это таким образом.Вам нужно будет использовать TemplateField, чтобы вы могли манипулировать кнопкой.Затем вы можете использовать jQuery для привязки к событию нажатия кнопки.