Solo me falta algo.
Muy simple o así lo pensé, usando jquery: en función del valor seleccionado en el menú desplegable Trabajadores , quiero mostrar solo ciertos valores en el menú desplegable Opciones de fruta .
Así, por ejemplo, si se selecciona Roy en el menú desplegable Trabajadores , solo quiero que aparezcan las manzanas y los duraznos como opciones dentro del menú desplegable de Opciones de fruta. El menú desplegable de opciones de fruta .
¿Cómo puedo, correctamente, usar jquery, filtrar el menú de Opciones de fruta en función de la selección del menú desplegable Trabajador?
Mi jfiddle está aquí : http://jsfiddle.net/justmelat/BApMM/1/
Mi código:
Worker: Roy John Dave
Fruit Options: Apples Oranges Pears Peaches Grapes Melons Nut Jelly Necesita una estructura de datos para mapear la relación entre el trabajador y la fruta. Algo como abajo,
var workerandFruits = { Roy: ["Apples", "Peaches"], John: ["Oranges", "Pears", "Peaches", "Nut"] }
Luego, debe escribir un controlador onchange para $('select[name=Select1') dentro del cual necesita filtrar las opciones $('select[name=Select2]) según el texto de las opciones seleccionadas en Select1 ( $(this).find('option:selected').text(); ).
Ahora, utilizando la Select2 puede determinar las frutas que el trabajador seleccionado prefiere y llenar el Select2 basándose en eso.
$workers.change(function () { var $selectedWorker = $(this).find('option:selected').text(); $fruits.html($fruitsList.filter(function () { return $.inArray($(this).text(), workerandFruits[$selectedWorker]) >= 0; })); });
Haz algo como esto:
var data = [ // The data ['Roy', [ 'Apples','Peaches' ]], ['John', [ 'Oranges', 'Pears', 'Peaches', 'Nuts' ]] ]; $a = $('#worker'); // The dropdowns $b = $('#fruits'); for(var i = 0; i < data.length; i++) { var first = data[i][0]; $a.append($("
Usar AJAX es una excelente manera de hacer lo que estás pidiendo.
Por favor, perdóneme si ya lo sabe, pero en jQuery / javascript, usted:
tomar el valor del primer cuadro de selección
use el código AJAX para enviarlo a un archivo PHP secundario, que usa los datos que recibe para escribir un código HTML basado en lo que el usuario eligió
el HTML recién creado se devuelve a la rutina ajax, donde se recibe dentro de una función de success
Dentro de la función de success , puede usar jQuery para reemplazar el contenido del segundo menú desplegable
Aquí hay un ejemplo detallado , con explicaciones.