0

у меня есть форма:

<form id="search" method="GET" action="">
     <nav class="navbar navbar-dark bg-light">
        {% csrf_token %}
     <input id="superSearch" class="form-control form-control-sm btn-block" type="text" placeholder="Поиск">

     </nav>
</form>

Это поисковая форма. К ней подвязан Js. Через Ajax обращаюсь к урлу и втаскиваю Json с данными. Консоль лог все отображает и видит. С подгрузкой проблем нет. Проблема вот в чем:

autoFillBar.append('<div class="item">' +
    '<span>' + '<a href="{% url 'index-to-view' '+id+' %}">' + name + '</a>' + '</span>' + '</div>');

Этот кусок JS кода возвращает в HTML прямо под поисковым полем результаты совпадений. и мне нужно каким-то образом вместе с текстом (переменная name) отдать url джанго шаблонизации и передать в этот урл аргумент id, который является переменной внутри js.

и в этом и проблема! у меня четвертый час не получается передать аргумент из js в джанго шаблонизатор. трасса говорит, что такого урл представления нет, хотя пытается отработать тот, что нужно

вот мой урл:

path('index-to-view/<str:id>/', search_views.index_to_view,
         name = 'index-to-view'),

вот полный js код:

function searchCheck(){

            if (input.val().length >= 2){

                var data = {};
                data.action = 'search';
                data.request = input.val();

                var endpoint = '{% url 'indexes' %}'

                $.ajax({
                    url: endpoint,
                    type: 'GET',
                    dataType: 'json',
                    data: data
                }).done(function(data){

                        autoFillBar.children().remove();
                                    // следующая строчка читает результат ajax-запроса, откомментируй ее, когда будет готов бэкэнд
                                    // var articlesArray = data.result;
                                    // Здесь я описываю фейковый поиск, чтобы продемонстрировать работу плагина
                                    // строки 241 - 262 можно выпилить несчадно
                                    // поиск ведется только по одному слову, но твоя база точно может лучше ;)
                                    var articlesArray = [];
                                    var dbArticles = data;
                                    console.log(dbArticles)
                                    for (var j=0; j<dbArticles.length; j++){
                                        var searchRequestStart = new RegExp('^' + input.val() + '.*', 'i');
                                        var searchRequestMiddle = new RegExp(' ' + input.val() + '.*', 'i');
                                        if ( (searchRequestStart.test(dbArticles[j].title)) || (searchRequestMiddle.test(dbArticles[j].title)) ) {
                                            articlesArray.push(dbArticles[j]);
                                        }
                                    }
                                    // Здесь фейк заканчивается и начинаются чудеса
                                    for (var i=0; i <= articlesArray.length - 1; i++){
                                        var name = articlesArray[i].title;
                                        var id = parseInt(articlesArray[i].id);
                                        console.log(id);

                                        var regex = input.val();
                                        if (regex.indexOf(' ') == -1){
                                            var searchMask = regex;
                                            var regEx = new RegExp(searchMask, "ig");
                                            var num = name.toLowerCase().indexOf(regex.toLowerCase());
                                            var strname = name.substr(num, regex.length);
                                            var replaceMask = '<b class="highlighted">' + strname + '</b>';
                                            name = name.replace(regEx, replaceMask);
                                        } else {
                                            var regexArr = regex.split(' ');
                                            for(var n=0; n<regexArr.length; n++){
                                                if (regexArr[n].length > 0){
                                                    var searchMask = regexArr[n];
                                                    var regEx = new RegExp(searchMask, "ig");
                                                    var num = name.toLowerCase().indexOf(regexArr[n].toLowerCase());
                                                    var strname = name.substr(num, regexArr[n].length);
                                                    var replaceMask = '<b class="highlighted">' + strname + '</b>';
                                                    var stopWords = '<b class="highlighted"></b>';
                                                    if (stopWords.indexOf(strname.toLowerCase()) == -1){
                                                        name = name.replace(regEx, replaceMask);
                                                    }
                                                }
                                            }
                                        }



                                        autoFillBar.append('<div class="item">' +
                                                '<span>' + '<a href="{% url 'index-to-view' '+id+' %}">' + name + '</a>' + '</span>' +
                                                '</div>');

                                    }
                                    autoFillBar.slideDown('fast');


                                  // конец ajax-запроса, ты знаешь, что делать ;)


                })
            }
        }

        return input;
    };

Помогите! я в тупике! ничего не нагуглил :(

1
  • p.s это поисковая строка с автодополнением. аргумент, который нужно передать в урл, берется из json, который в свою очередь успешно подгружается. Commented 17 февр. 2019 в 20:38

1 ответ 1

0

Так в принципе не заработает, так как шаблонизатор работает на сервере, а js, и соотв. этот код работает на клиенте:

autoFillBar.append('<div class="item">' +
'<span>' + '<a href="{% url 'index-to-view' '+id+' %}">' + name + '</a>' + '</span>' + '</div>');

С ходу вижу пару вариантов:

  1. Захардкодить урл, заменив {% url 'index-to-view' '+id+' %} на '/index-to-view/' + id

  2. Формировать нужный урл на сервере, там где вы генерируете json, добавив в json уже сформированный.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.