JavaScript для динамического заполнения раскрывающегося списка массивом из значения, введенного в текстовое поле - PullRequest
Новая
       31

JavaScript для динамического заполнения раскрывающегося списка массивом из значения, введенного в текстовое поле

1 голос
/ 29 марта 2012

Привет, у меня есть пример кода здесь: http://jsbin.com/oxoweh

Моя проблема в том, что я не могу получить значение, которое вводится в текстовое поле, поэтому при нажатии кнопки выбора во втором раскрывающемся списке отображаются только данные, относящиеся к тому, что было введено в текстовое поле. например, если фрукты введены в текстовое поле, я хочу, чтобы в раскрывающемся меню субкадра были все фрукты вместо использования существующего выпадающего меню категории

1 Ответ

0 голосов
/ 30 марта 2012

http://jsfiddle.net/goldentoa11/P3hs8/1/

Я добавил параметр в ваш «SelectSubCat ()» с именем txtValue.Это делается для того, чтобы вы могли передать значение, с которым хотите сравнить.

Вам потребуется вызывать функцию «SelectSubCat ()» со значением текстового поля при его вызове.Я добавил идентификатор в текстовое поле с именем «selectText», и когда я нажал кнопку, я добавил 

onclick="SelectSubCat(document.getElementById('selectText').value)"

, и это вызовет функцию с текстом ввода.Затем вместо использования значения из формы он использует переданное ему значение и создает соответствующую подкатегорию.Наконец, вам нужно изменить функцию onchange категории, чтобы просто пропустить пустую строку. 

function SelectSubCat(txtValue) {

if(txtValue == "") txtValue = document.drop_list.Category.value;
// This line is to set txtValue to Category's value if the current value is blank. 
// In other words, if it was called by changing the dropdown, 
// give it the drop down's value.

// ON selection of category this function will work
removeAllOptions(document.drop_list.SubCat);
addOption(document.drop_list.SubCat, "", "SubCat", "");

if (txtValue == 'Fruits') {
    addOption(document.drop_list.SubCat, "Mango", "Mango");
    addOption(document.drop_list.SubCat, "Banana", "Banana");
    addOption(document.drop_list.SubCat, "Orange", "Orange");
}
if (txtValue == 'Games') {
    addOption(document.drop_list.SubCat, "Cricket", "Cricket");
    addOption(document.drop_list.SubCat, "Football", "Football");
    addOption(document.drop_list.SubCat, "Polo", "Polo", "");
}
if (txtValue == 'Scripts') {
    addOption(document.drop_list.SubCat, "PHP", "PHP");
    addOption(document.drop_list.SubCat, "ASP", "ASP");
    addOption(document.drop_list.SubCat, "Perl", "Perl");
}

}
...