Страница обновляется только один раз из выпадающего списка - PullRequest
0 голосов
/ 08 июля 2019

Я использую ajax для обновления страницы, используя параметр, отправленный из выпадающего списка на мой контроллер. По какой-то причине страница обновляется только один раз, а выпадающий список становится бесполезным, пока я не обновлю страницу вручную из браузера. В контроллере я использую оператор switch в зависимости от параметра, отправляемого для выполнения вызовов на сервер Couchbase для получения элементов базы данных. Как я могу заставить страницу обновляться более одного раза, используя выпадающий список?

// View

@model List<Merchandise>
@{
    ViewData["Title"] = "Variant Summary";
}

<body class="variant" id="load">

    <div class="pageMain">
        <div class="variant-page">
            <div class="container-variant">
                <header>
                    <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-dark ">
                        <div class="container">
                            <h3>
                                <img src="~/images/3bars_menu_header.png" /> Variant Summary
                            </h3>
                            <div id="merchTicker">
                                <div class="inner">
                                    <ul position="absolute"></ul>
                                </div>
                            </div>

                            @Html.DropDownList("Countries", new SelectList(Enum.GetValues(typeof(Countries))), new { @id = "countrylist" })

                            @section Scripts
                                {
                                <script type="text/javascript">

                                        $("#countrylist").change(function () {
                                        var select = $("#countrylist").val();
                                        $.ajax({
                                            type: "get",
                                            url: '@Url.Action("Merchandise", "Home")' + "/" + select,
                                            data: {'selCountry' : select},
                                            success: function (data) {
                                                $('.variant').html(data);
                                            }
                                        });
                                        });

                                </script>
                            }
                        </div>
                    </nav>
                </header>

            </div>
            <table class="merchTable">
                <tr>
                    <th width="75px">SEQ</th>
                    <th width="125px">Item ID</th>
                    <th width="700px">Description</th>
                    <th width="90px">Sold</th>
                    <th width="90px">Sold Today</th>
                    <th width="90px">AFS</th>
                    <th width="65px">P Mins</th>
                    <th width="65px">A Mins</th>
                </tr>
                @foreach (var item in Model)
                {
                    <tr>
                        <td>@item.PlanSeqId</td>
                        <td>@item.ItemId</td>
                        <td>@item.ItemDescription</td>
                        <td align="right">@item.OrderQuantity</td>
                        <td align="right">@item.OrderSldTdy</td>
                        <td align="right">@item.AvaiForSaleQty</td>
                        <td align="right">@item.PlannedMinutesQty</td>
                        <td align="right">@item.ActualMinutesQty</td>
                    </tr>
                }
            </table>
        </div>
    </div>    
</body>

// Метод контроллера

public IActionResult Merchandise(Countries selCountry)
        {          
            switch (selCountry)
            {
                case Countries.USA:
                    var bucket = _bucketProvider.GetBucket("MerchUSA");
                    var n1ql = @"SELECT g.*, META(g).id
                                FROM `MerchUSA` g
                                WHERE g.CompanyId = 0
                                LIMIT 20;";
                    var query = QueryRequest.Create(n1ql);
                    var results = bucket.Query<Merchandise>(query);
                    UpdateMerchSold(results.Rows);
                    return View(results.Rows);
                case Countries.EUR:
                    var bucket2 = _bucketProvider.GetBucket("MerchEUR");
                    var n1ql2 = @"SELECT g.*, META(g).id
                                FROM `MerchEUR` g
                                WHERE g.CompanyId = 1
                                LIMIT 20;";
                    var query2 = QueryRequest.Create(n1ql2);
                    var results2 = bucket2.Query<Merchandise>(query2);
                    UpdateMerchSold(results2.Rows);
                    return View(results2.Rows);
                case Countries.JPN:
                    var bucket3 = _bucketProvider.GetBucket("MerchJPN");
                    var n1ql3 = @"SELECT g.*, META(g).id
                                FROM `MerchJPN` g
                                WHERE g.CompanyId = 2;
                                LIMIT 20;";
                    var query3 = QueryRequest.Create(n1ql3);
                    var results3 = bucket3.Query<Merchandise>(query3);
                    UpdateMerchSold(results3.Rows);
                    return View(results3.Rows);
            }
            return View();
        }

Я все еще изучаю ajax, поэтому любая помощь будет признательна, спасибо.

1 Ответ

1 голос
/ 09 июля 2019

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

Я бы также предложил переместить секцию вашего скрипта из середины html и опустить ее вниз. Легче читать.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...