Здравствуйте. Вопрос такой. Есть кнопка и тег со своими . При нажатии на кнопку появляется новый . При выборе определенного справа select'a появляется определенный тип input'a, указанный в option. Получается список из селектoв и инпутов.
Теперь вопрос. Как сделать так чтобы при изменении старого выбранного селекта, менялся нужный инпут, который справа него? А то вместо этого инпут добавляется в самом верху.
function addField() {
$('#props').prepend('<div id=\"fields\">\
<select onchange=\"addchange()\" class=\"options\" name=\"Tovar[name]\" id=\"Tovar_name\">\
<option selected=\"true\" disabled=\"disabled\">Выберите свойство</option>\
<option data-type=0>Первое</option>\
<option data-type=1>Второе</option>\
<option data-type=2>Третье</option>\
</select>\
</div>\
<div id=\"change\" ></div><br>');
}
function addchange(){
var orange = $('.options option:selected').attr('data-type');
switch (orange){
case "0":
$('#change').append('<input type=\"number\" name=\"browser\" value=\"0\" min=\"0\" step=\"1\">');
break;
case "1":
$('#change').append('<input type=\"text\" name=\"browser\" >');
break;
case "2":
$('#change').append('<input type=\"checkbox\" name=\"browser\" >');
break;
default :
$('#change').append('<p>Нет типа свойства</p>');
break;
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="required">Свойства</label>
<div id="props">
</div>
<a href="#" onclick="addField()">Добавить поле</a>