Como capturar el valor de un SELECT rellenado mediante AJAX
Publicado por Pablo (5 intervenciones) el 16/08/2017 11:31:07
Amigos programadores.
Tengo un formulario que contiene varios elementos, entre estos elementos hay un SELECT y un INPUT que se rellenan desde una base de datos utilizando Ajax.
Una vez que todo el formulario esta lleno, lo voy a enviar al archivo php que recibe y procesa los datos del formulario mediante el método POST.
al hacer click en el respectivo boton tipo submit, se deberían enviar los datos introducidos en el formulario pero resulta que todos los elementos son recibidos en el archivo php menos el SELECT y el INPUT que se rellenaron utilizando AJAX.
El SELECT y el INPUT a pesar de que se relllenan correctamente en el formulario, al parecer no dejan un valor para capturar por medio del atributo NAME y así tener algo que recojer en el archivo php como normalmente es el procedimiento.
¿Como hago para capturar el valor de este SELECT y este INPUT para enviarlos junto con todos los elementos del formulario?
IMPORTANTE, no quiero usar JQuery, solo código javascript, php, html o AJAX, nada de atajos porque no se aprende.
Hice un resumen del código para que vean el problema, no esta muy bonito de Fron-End pero ese no es el punto.
Archivo donde están las peticiones AJAX y el formulario
Archivo donde se ejecuta la petición AJAX para rellenar el SELECT
Archivo donde se ejecuta petición AJAX para rellenar el INPUT
Archivo donde se reciben los datos del formulario
Tengo un formulario que contiene varios elementos, entre estos elementos hay un SELECT y un INPUT que se rellenan desde una base de datos utilizando Ajax.
Una vez que todo el formulario esta lleno, lo voy a enviar al archivo php que recibe y procesa los datos del formulario mediante el método POST.
al hacer click en el respectivo boton tipo submit, se deberían enviar los datos introducidos en el formulario pero resulta que todos los elementos son recibidos en el archivo php menos el SELECT y el INPUT que se rellenaron utilizando AJAX.
El SELECT y el INPUT a pesar de que se relllenan correctamente en el formulario, al parecer no dejan un valor para capturar por medio del atributo NAME y así tener algo que recojer en el archivo php como normalmente es el procedimiento.
¿Como hago para capturar el valor de este SELECT y este INPUT para enviarlos junto con todos los elementos del formulario?
IMPORTANTE, no quiero usar JQuery, solo código javascript, php, html o AJAX, nada de atajos porque no se aprende.
Hice un resumen del código para que vean el problema, no esta muy bonito de Fron-End pero ese no es el punto.
Archivo donde están las peticiones AJAX y el formulario
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo1</title>
<script>
var http_request = false;
var http_request = conexionAJAX();
function conexionAJAX(){
http_request = false;
if (window.XMLHttpRequest){ // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType){
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject){ // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e){
try{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request){
alert('No es posible crear una instancia XMLHTTP');
return false;
}
/*else{
alert("Instancia creada exitosamente ok");
}*/
return http_request;
}
//-------------------------------------------------------------------------------------------------
function llamar_empleados(){
var aleatorio = parseInt(Math.random()*999999999);
insercion1 = document.getElementById("Departamento").value;// se introduce el ID_Departamento desde este archivo
var url="Empleados_AJAX._GET.php?val=" + insercion1 + "&r="+aleatorio;
http_request.open('GET',url,true);
http_request.onreadystatechange= respuesta_empleados;
http_request.setRequestHeader("content-type","application/x-www-form-urlencoded");
http_request.send();
}
function respuesta_empleados(){
if (http_request.readyState == 4){
if (http_request.status == 200){
document.getElementById('respuestaA').innerHTML=http_request.responseText;//Se recibe el nombre del empleado desde Empleados_AJAC_GET.php
return;
}
else{
alert('Hubo problemas con la petición.');
}
}
}
//--------------------------------------------------------------------------------------------------
function llamar_salario(){
var aleatorio = parseInt(Math.random()*999999999);
insercion2 = document.getElementById("prueba").value;// se introduce el ID_Empleado desde EMpleados_AJAX_GET.php
var url= "Salarios_AJAX_GET.php?valor=" + insercion2+ "&r="+aleatorio;
http_request.onreadystatechange = respuesta_salario;
http_request.open('GET',url, true);
http_request.setRequestHeader("content-type","application/x-www-form-urlencoded");
http_request.send(null);
}
function respuesta_salario(){
if (http_request.readyState == 4){
if (http_request.status == 200){
document.getElementById('respuestaB').innerHTML=http_request.responseText;
return;
}
else{
alert('Hubo problemas con la petición.');
}
}
}
//-------------------------------------------------------------------------------------------------------------------------
</script>
</head>
<body>
<h1>Ver archivo con ajax</h1>
<form method="POST" action="Datos_Empleado.php">
<label>Departamento</label>
<select id="Departamento" name="departamento" onchange="llamar_empleados()">
<option value="">seleccione</option>
<?php
include("Conexion_BD.php");
$departamento = mysql_query("SELECT * FROM departamentos ORDER BY departamento ASC");
while($consulta= mysql_fetch_array($departamento)){
?>
<option value='<?php echo $consulta["ID_Departamento"];?>'> <?php echo $consulta["departamento"];?></option>
<?php } ?>
</select>
<br>
<br>
<div id="respuestaA">
<label>Empleado</label><!--este select se rellena utilizando AJAX, desde la función "llamar_empleados" pero no consigo su valor para enviarlo al formulario-->
<select id="RA" name="rA" disabled="disabled">
<option value="">Seleccione empleado</option>
</select>
</div>
<br>
<div id="respuestaB" style="color: red; font-size:26px;">
<input id= "RB" nombre="rB" type="text"> <!--Este input tambien se rellena utilizando AJAX, desde la funcion "llamar_salario" tampoco consigo su valor para enviarlo al formulario-->
</div>
<br>
<input type="submit" name="enivar" value="ENVIAR">
</form>
</body>
</html>
Archivo donde se ejecuta la petición AJAX para rellenar el SELECT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
include("Conexion_BD.php");
$departamento= $_GET['val'];
$consulta = mysql_query("SELECT * FROM empleados INNER JOIN departamentos_empleados ON empleados.ID_Empleado=departamentos_empleados.ID_Empleado WHERE ID_Departamento = '$departamento'");
echo '<select id="prueba" onclick="llamar_salario()">'; //prueba, almacena el ID_Empleado, ese valor es el que necesito mandar junto con el formulario
echo '<option value="0"> Seleccione Empleado </option>';
while($empleado= mysql_fetch_array($consulta)){
echo '<option value="'.$empleado['ID_Empleado'].'"> '.$empleado['nombres'].'</option>';
}
echo '</select>'
?>
Archivo donde se ejecuta petición AJAX para rellenar el INPUT
1
2
3
4
5
6
7
8
9
10
11
<?php
include("Conexion_BD.php");
$empleado=$_GET["valor"];
$consulta = mysql_query("SELECT * FROM empleados WHERE ID_Empleado = '$empleado'");
while($sueldo= mysql_fetch_array($consulta)){
echo '<input type="text" value="'.$sueldo['sueldo'].'">';
}
?>
Archivo donde se reciben los datos del formulario
1
2
3
4
5
6
7
8
9
<?php
$departamento=$_POST["departamento"];
$empleado= $_REQUEST["rA"];
$salario= $_REQUEST["rB"];
echo $departamento;//este valor si llega. Es el ID_Departameto, ubicado en la base de datos.
echo $empleado;//este valor no llega
echo $salario;;;//este valor no llega
Valora esta pregunta
0