Как предотвратить потерю данных в моей HTML-таблице при нажатии кнопки?

Question

Я занят проектом ASP.net, который написан на VB, и мы используем Dev Express 16.1 для некоторых из этих элементов пользовательского интерфейса.

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

Итак, краткий обзор.

Сначала список с возможностью прокрутки заполняется со стороны сервера.здесь нет проблем, в списке есть прослушиватель кликов на стороне клиента, который срабатывает при нажатии на продукт, он использует ajax для вызова веб-метода, который получает дополнительную информацию о продукте, возвращает ее как json, а затем отображает ее на клиентебоковая сторона.

$.ajax({
                type: "POST",
                url: "ClassName.aspx/DisplayProductInfo",
                data: '{productCode: "' + values + '"}',
                contentType: "application/json; charset=utf-8",
                dataType: 'json',
                success: ReceiveResponse,
                failure: function (response) {
                    console.log(response.d);
                    alert(response.d);
                }
            });

Затем информация отображается в виде таблиц, которые я строю на основе того, что я получаю в ответ.

    function ReceiveResponse(response) {
                var jsonResponse = JSON.parse(response.d)

document.getElementById('<%= hiddenButton.ClientID %>').click();

                if (jsonResponse.ProductPrice.length > 0) {
                    var priceTable = "<tr id=\"suppNameRow\">";
                    for (var x = 0; x < jsonResponse.ProductPrice.length; x++) {
                        priceTable += "<td>" + jsonResponse.ProductPrice[x].SupplierName + "</td>";
                    }
                    priceTable += "</tr>";
                    priceTable += "<tr id=\"suppPriceRow\">";
                    for (var y = 0; y < jsonResponse.ProductPrice.length; y++) {
                        priceTable += "<td>" + jsonResponse.ProductPrice[y].SupplierPrice + "</td>";
                    }
                    priceTable += "</tr>";

                    document.getElementById('productPriceTableBody').innerHTML = priceTable;
                } else {
                    var suppPriceRow = document.getElementById('suppPriceRow').getElementsByTagName("td");
                    for (var z = 0; z < suppPriceRow.length; z++) {
                        suppPriceRow[z].innerText = "N/A"
                    }
                }

                var monthCells = document.getElementById('monthRow').getElementsByTagName("td");
                var historyTable = document.getElementById('productHistoryTable')

                if (jsonResponse.ProductHistory.length > 0) {
                    for (var z = 0; z < jsonResponse.ProductHistory.length; z++) {
                        for (var a = 1; a <= 12; a++) {
                            if (monthCells[a].innerText == jsonResponse.ProductHistory[z].Month) {
                                historyTable.rows[0].cells[a].innerText = jsonResponse.ProductHistory[z].MyQty;
                                historyTable.rows[2].cells[a].innerText = jsonResponse.ProductHistory[z].CompQty;
                            }
                        }
                    }
                } else {
                    for (var a = 1; a <= 12; a++) {
                        historyTable.rows[0].cells[a].innerText = "0";
                        historyTable.rows[2].cells[a].innerText = "0";
                    }
                }
            }

Я прошел этот путь, так как таблица должна бытьдинамичный.Одна проблема, с которой я столкнулся, - это попытка вызова стандартного метода на стороне сервера из javascript. Обходной путь - использовать нажатие кнопки для вызова этого метода, как видно во второй строке функции ответа.Вот где возникает проблема.

Protected Sub loadProductPrices(ByVal sender As Object, ByVal e As EventArgs)
        If Not productKeyHolder.Value = "" Then

            Dim dtProdPrices As DataTable = pc.GetListedPrices(productKeyHolder.Value)
            gvListedPrices.DataSource = dtProdPrices
            gvListedPrices.KeyFieldName = "barcode"
            gvListedPrices.DataBind()
        End If
    End Sub

gvListedPrices - это dx: ASPxGridView, который я использую для отображения цен, здесь возникает проблема, кажется, что страница перезагружается, и я теряю данные, которыеЯ отображаю из ответа JSON.

У меня есть кнопка и Gridview на панели обновлений, но это не решило проблему.

Быстрый обзор. При нажатии на продукт запускается ajax-запрос, получает информацию о продукте, которая отображается в HTML-таблице, затем нажимается скрытая кнопка и заполняется сетка, затем страница обновляется, и я теряюинформация в таблице.

Я бы хотел предотвратить потерю данных таблицей.Скрытая кнопка - это просто обходной путь.