Повторите частичное представление Jquery + MVC 5 - PullRequest
Новая
       11

Повторите частичное представление Jquery + MVC 5

0 голосов
/ 25 мая 2018

У меня есть кнопка, которая вызывает частичное представление, в котором таблица загружается со всеми категориями моей системы 

 <input type="button" value="Cargar Categorias" id="btnCargarCategorias" />

Эта загрузка выполняется через частичное представление, которое я взимаю внутри <div>

 <div id="divTabla">

    </div>

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

 <script>
        $("#btnCargarCategorias").click(function () {

            $(this).prop("disabled", "disabled");

            var url = '@Url.Action("CargarCategorias","Categorias")';

            $.get(url).done(function (data) {
                $("#divTabla").append(data);
            })

            $("#btnCargarCategorias").removeAttr("disabled");
        })
    </script>

Мое действие в контроллере: 

 public PartialViewResult CargarCategorias()
        {
            var categorias = db.Categorias.ToList();

            return PartialView("_TablaCategorias", categorias);
        }

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

TableRepeat

Ожидаемое поведение: независимо от того, сколько раз вы нажимаете кнопку, таблица загружается в одно и то же место.

Полученное поведение: каждый раз, когда нажимается кнопка, новая таблица загружается ниже предыдущей.one

Что я должен сделать в своем коде, чтобы получить желаемое поведение?Я должен заняться технологией Ajax?любая помощь для меня?

1 Ответ

0 голосов
/ 25 мая 2018

Потому что вы не очистили свой div перед добавлением данных в него.

Вы можете сделать следующее 

$.get(url).done(function (data) {
    $("#divTabla").html(data);
})

, которое очистит внутреннюю часть div, а затем поместит данные внутрь.

...