Foros del Web » Programando para Internet » Jquery »

[SOLUCIONADO] Cambiar combo desde input

Estas en el tema de Cambiar combo desde input en el foro de Jquery en Foros del Web. Hola a todos, necesito una manita por favor tengo el siguiente codigo: <input type="text" id="fecha1" name="fecha1" value=""/> <input type="text" id="fecha2" name="fecha2" value=""/> <div class="selector-chofer"> <strong>Chofer:</strong> ...
  #1 (permalink)  
Antiguo 05/08/2016, 14:19
 
Fecha de Ingreso: noviembre-2015
Mensajes: 19
Antigüedad: 8 años, 5 meses
Puntos: 1
Exclamación Cambiar combo desde input

Hola a todos, necesito una manita por favor tengo el siguiente codigo:

<input type="text" id="fecha1" name="fecha1" value=""/>
<input type="text" id="fecha2" name="fecha2" value=""/>
<div class="selector-chofer">
<strong>Chofer:</strong>
<select></select>
<script type="text/javascript">
$(document).ready(function() {
var form_data = {
fp:+$("#fecha1").val(),
ff:+$("#fecha2").val(),
};
$.ajax({
type: "POST",
url: "vchoferes.php",
data: form_data,
success: function(response)
{
$('.selector-chofer select').html(response).fadeIn();
}
});

});
</script>
</div>

y en mi script php de llenado para el combo:

$query= "select id, nombre from choferes where fecha between $_REQUEST['fp'] and $_REQUEST['ff']";
$rs = mysqli_query($cn, $query);
echo '<option value="">Seleccionar</option>';
while ($fila = mysqli_fetch_row($rs)) {
echo '<option value="'.$fila['id'].'">'.$fila['nombre'].'</option>';
}
mysqli_close($cn);

resulta que quiero que el combobox cambie segun las fechas que ingreso en los input sin tener que hacer submit o recargar la pagina, y el problema es que no recibe las variables en la query... algo esta fallando porfa una manita
  #2 (permalink)  
Antiguo 05/08/2016, 21:20
Avatar de Alexis88
Philosopher
 
Fecha de Ingreso: noviembre-2011
Ubicación: Tacna, Perú
Mensajes: 5.552
Antigüedad: 12 años, 5 meses
Puntos: 977
Respuesta: Cambiar combo desde input

El error es evidente: no estás cargando la información en el momento en el que se produce el cambio de valores en las cajas de texto; solo capturas el contenido de ambas luego de la carga la página y, lógicamente, obtienes valores nulos porque estas aún no poseen contenido.

La idea es que ejecutes la captura de los valores y el envío de los mismos mediante una petición asíncrona (AJAX) cuando se produzca alguno de los eventos del teclado mientras cualquiera de las cajas de texto tenga el enfoque. Sabiendo esto, podrías hacer algo así:
Código Javascript:
Ver original
  1. $(document).ready(function(){
  2.     $("#fecha1, #fecha2").on("keypress", function(){
  3.         //Tus instrucciones
  4.     });
  5. });

Y ya que usas jQuery, podrías utilizar el widget datepicker (de jQuery UI) para seleccionar fechas de un calendario y así ya no sería necesario que utilices el evento keypress, sino el evento change.

__________________
«Juro por mi vida y mi amor por ella, que jamás viviré para el provecho de otro hombre, ni le pediré a otro hombre que viva para el mío».

Ayn Rand

Última edición por Alexis88; 05/08/2016 a las 21:57 Razón: Corrección gramatical
  #3 (permalink)  
Antiguo 08/08/2016, 08:43
 
Fecha de Ingreso: noviembre-2015
Mensajes: 19
Antigüedad: 8 años, 5 meses
Puntos: 1
Respuesta: Cambiar combo desde input

Hola Alexis, disculpa pero esque inicio en esto de js que me parece muy interesante, te refieres a que haga esto?

$(document).ready(function(){
$("#fecham").on("blur", function(){
var ab = document.getElementById('fecha1').value;
var cd = document.getElementById('fecha2').value;
var form_data = {
fp:ab
ff:cd
};
$.ajax({
type: "POST",
url: "vchoferes.php",
data: form_data,
success: function(response)
{
$('.selector-chofer select').html(response).fadeIn();
}
});
});

una vez mas lamento la insitencia pero lo probe y para cambiar el contenido del combo tengo que actualizar la pagina, se podra sin tener que actualizar la pagina? osea que cambie el contenido del combo sin recargar la pagina...

Última edición por kalper; 08/08/2016 a las 10:15
  #4 (permalink)  
Antiguo 08/08/2016, 10:43
 
Fecha de Ingreso: noviembre-2015
Mensajes: 19
Antigüedad: 8 años, 5 meses
Puntos: 1
Respuesta: Cambiar combo desde input

Hola al fin lo solucione... dejo como lo hice por si le sirve a alguien...

<div class="selector-chofer">
<strong>Chofer:</strong>
<select id="vch">
<option value="">- Seleccione chofer -</option>
</select>
<script type="text/javascript">
$(document).ready(function() {
$("#fecha2").on("click", function(){
var ab = document.getElementById('fecha1').value;
var cd = document.getElementById('fecha2').value;
var form_data = {
fp:ab,
ff:cd,
};
$.ajax({
type: "POST",
url: "vchoferes.php",
data: form_data,
success: function(response)
{
$('.selector-chofer select').html(response).fadeIn();
}
});
});
});
</script>
</div>

Lo último seria cambiar esa parte de - $("#fecha2").on("click", function(){ - porque tendria que dar click para actualizar el combo probé usando un calendario en js pero tengo que dar click luego de seleccionar la fecha lo cual lo hace un tanto repetitivo (por los click) si alguien lo logra hacer sin dar click en ningun lugar antes agradecería lo coloque =)
Gracias por tu aporte Alexis... suerte a todos.

Última edición por kalper; 08/08/2016 a las 13:02
  #5 (permalink)  
Antiguo 08/08/2016, 22:38
Avatar de Alexis88
Philosopher
 
Fecha de Ingreso: noviembre-2011
Ubicación: Tacna, Perú
Mensajes: 5.552
Antigüedad: 12 años, 5 meses
Puntos: 977
Respuesta: Cambiar combo desde input

En realidad, por lo que entendí del mensaje inicial, creo que la idea es hacer algo como esto. Una vez que hayas elegido o digitado una fecha en ambas cajas de texto, realizarías la petición asíncrona (AJAX), obtendrías una respuesta y la añadirías al combo.

__________________
«Juro por mi vida y mi amor por ella, que jamás viviré para el provecho de otro hombre, ni le pediré a otro hombre que viva para el mío».

Ayn Rand

Etiquetas: combo, input, javascript, php, text
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 07:58.