Показать сообщение отдельно
  #18 (permalink)  
Старый 19.09.2016, 13:24
Новичок на форуме
Отправить личное сообщение для Amnesia Посмотреть профиль Найти все сообщения от Amnesia
 
Регистрация: 19.09.2016
Сообщений: 3

Ребят, уже 3 день пытаюсь реализовать идею и она очень схожа с названием темы. В краце ситуация следующая:
Пишу на Python с фреймворком Django сайт- тестовый.
И столкнулся с такой проблемой.
Есть страница с таблицей(5 полей).
В нее по форме можно добавлять значение на этой же странице.
С помощью Jquery и Java Script, сделал автодобавление форм(чтобы добавить допустим сразу 6 значений за раз). Это все отрабатывает и формы появляются по кнопке "Добавить поле".

Теперь задача связать в каждой форме первое поле селект с зависимым вторым c Id=Title.
Грубо говоря первое поле Марка, а второе поле Модели(они подгружаются из базы жава скриптом).
На данный момент проблема в том, что при добавлении форм, все поля ее добавляются автоматический с id="id_form-0-buy_tabako_brand" name="form-0-buy_tabako_brand", естественно они инкременты.
Как мне написать Java-script, который будет следить за точным названием ид, и при его изменении(Смена Марки), подгрузить в нужную зависимую форму все Модели..
Сейчас это работает только с первой формой, а остальные формы, подгружаются лишь по Марке первой формы.
Код:
<div class="item row">
                <div class="large-2 columns">
                    <label>Бренд</label>
                    <select id="id_form-0-buy_tabako_brand" name="form-0-buy_tabako_brand">
<option value="" selected="selected">---------</option>
<option value="1">Alfakher</option>
<option value="2">Habibi</option>
</select>
                </div>
                <div class="large-2 columns">
                    <label>Тип</label>
                    <select id="title">
                        <option value="" selected="selected">---------</option>
                    </select>
                </div>
            </div>
<div class="item row">
                <div class="large-2 columns">
                    <label>Бренд</label>
                    <select id="id_form-1-buy_tabako_brand" name="form-1-buy_tabako_brand">
<option value="" selected="selected">---------</option>
<option value="1">Alfakher</option>
<option value="2">Habibi</option>
</select>
                </div>
                <div class="large-2 columns">
                    <label>Тип</label>
                    <select id="title">
                        <option value="" selected="selected">---------</option>
                    </select>
                </div>
            </div>

Сейчас есть вот такой код, который отслеживает состояние:
$(document).ready(function() {
    $("#id_form-0-buy_tabako_brand").on('change', function title() {
        var id = $(this).val();
        $.ajax({
            data: {'id': id},
            url: '/tabako/add_cart/brand/',
            type: 'get',
            success: function (data) {
                var html = ""
                for (var i = 0; i < data.length; i++) {
                    html += '<option value="'+i+'">' + data[i].fields.tabako_titles_title + '</option>'
                }
                $('#title').html(html);
            }
        });
    });
})

И проблема здесь, как указать id_form-0-buy_tabako_brand, чтобы скрипт автоматический отслеживал инкремент первого поля селекта, и подгружал второй селект необходимой формы..
Ответить с цитированием