Обновление только части HTML страницы с использованием Django - PullRequest
0 голосов
/ 14 февраля 2020

У меня есть страница HTML (аннотатор. html), где верхняя половина содержит таблицу. У меня есть код JavaScript, который извлекает данные из модели данных, когда пользователь выбирает строку в таблице и отображает эти данные в div под таблицей.

My Javascript выглядит следующим образом:

$('#radiological tbody').on( 'click', 'tr', function () {
    if ( $(this).hasClass('selected') ) {
        $(this).removeClass('selected');
    }
    else {
        //first unselect any other selected row
        dt_table.$('tr.selected').removeClass('selected');

        //then select row of interest
        $(this).addClass('selected');

        var rowIndex = dt_table.row('.selected')[0];
        var row = dt_table.rows(rowIndex);
        var id = row.data()[0]['id'];
        var url = '/report/' + id + '/';
        //window.location = url;

        $.ajax({
            url: url,
            type: 'get', // This is the default though, you don't actually need to always mention it
            success: function(data) {
            },
            failure: function(data) {
                alert('Got an error dude');
            }
        });

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

Мой отчет выглядит так:

def report_page(request, id):   
    template_name = "annotator.html"
    data = Radiology2.objects.get(id=id)
    context = {"data": data}
    context["title"] = title
    context["version"] = version
    context["id"] = id

    if (request.is_ajax()):
        # return render(request, template_name, context)
        return JsonResponse(context)
    else:
        return render(request, template_name, context)

Я добавил поддержку AJAX. Я просто не уверен, как правильно вернуться из вида при использовании AJAX. Очевидно, я чего-то не понимаю.

Ответы [ 2 ]

0 голосов
/ 17 февраля 2020

Вместо Ajax я заменил window.location=url; на $('#divIdToRefresh').load(url + ' #divIdToRefresh');

0 голосов
/ 16 февраля 2020

Вы можете легко использовать Ajax - jQuery или нативный JS, для этого лучше

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