Ребят, уже 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, чтобы скрипт автоматический отслеживал инкремент первого поля селекта, и подгружал второй селект необходимой формы..