[SOLUCIONADO] Por que no envia correctamente los radio?

franjgg · #1 (**permalink**) 15/09/2015, 14:17

Buenas!!

Vereis tengo un form que envia mediante ajax la información y envia bien todos los campos menos los input es el siguiente:

Código Javascript:

Ver original<script type="text/javascript">
 
function nuevoAjax(){
    var xmlhttp=false;
    try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
    xmlhttp = false;
    }
    }
 
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();
    }
    return xmlhttp;
}
  
function enviarFormulario(url, formid, divrespuesta){
        var Formulario = document.getElementById(formid);
        var longitudFormulario = Formulario.elements.length;
        var cadenaFormulario = "";
        var sepCampos;
        sepCampos = "";
        for (var i=0; i <= Formulario.elements.length-1;i++) {
            cadenaFormulario += sepCampos+Formulario.elements[i].name+'='+encodeURI(Formulario.elements[i].value);
            sepCampos="&";
    }
    peticion=nuevoAjax();
    peticion.open("POST", url, true);
    peticion.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=ISO-8859-1');
    peticion.send(cadenaFormulario);
    peticion.onreadystatechange = function() {
          if (peticion.readyState == 4 && (peticion.status == 200 || window.location.href.indexOf ("http") == - 1)){
                document.getElementById(divrespuesta).innerHTML = peticion.responseText;
          }
    }
}
var vv_1 = 0;
 
function validar(check,grupo) {
 
 
 
    if(document.form_opinion.recomendar[0].checked){
 
        vv_1++;
    }
 
    if(document.form_opinion.recomendar[1].checked){
 
        vv_1++;
    }
 
}  
 
 
function control_validacion (){
enviarFormulario('enviar_comentarios.php','form_opinion', 'opinion_aviso');
}

Código PHP:

 
                     <form id="form_opinion" name="form_opinion"  action="#" > 
                        <ul class="review-f-list"> 
                          <li> 
                              <label>Nombre: *</label> 
                                <input name="nombre" id="nombre" type="text" /> 
                            </li> 
                            <li> 
                              <label>Email: (No se publicará)</label> 
                              <input name="email" type="text" /> 
                            </li> 
                            <li> 
                              <label>Opinión: *</label> 
                                <textarea name="opinion" cols="2" rows="20"></textarea> 
                            </li> 
                            </ul> 
                              <label>Cual es tu calificación para <strong>'.utf8_encode($array_articulo['articulo']).'</strong>*</label> 
                                <div class="rating-list"> 
 
                                  <table width="100%" cellspacing="0" style="margin:10px 0px 10px 0px;">  
                                   
                                  <tr> 
                                  <td style="width:155px; padding-bottom:13px;"> 
                                    <span>¿Lo recomendarías? </span> 
                                  </td> 
                                  <td style=" padding-bottom:13px;"> 
 
                                  Si: <input type="radio" name="recomendar" value="si" id="si" style="margin-right:5px; onclick="validar(form_opinion.si,0)"/> 
                                  No: <input type="radio" name="recomendar" value="no" id="no" onclick="validar(form_opinion.no,0)"/> 
                                  </td> 
                                  </tr> 
 
                                  <tr> 
                                  <td style="width:155px;"> 
                                    <span>Valoración del artículo: </span> 
                                  </td> 
                                    <td valign="top" width=""> 
 
                                     <div class="Clear"> 
                                      <input class="star required" type="radio" name="valoracion" value="1"/> 
                                      <input class="star" type="radio" name="valoracion" value="2"/> 
                                      <input class="star" type="radio" name="valoracion" value="3"/> 
                                      <input class="star" type="radio" name="valoracion" value="4"/> 
                                      <input class="star" type="radio" name="valoracion" value="5"/> 
                                      <input class="star" type="radio" name="valoracion" value="6"/> 
                                      <input class="star" type="radio" name="valoracion" value="7"/> 
                                      <input class="star" type="radio" name="valoracion" value="8"/> 
                                      <input class="star" type="radio" name="valoracion" value="9"/> 
                                      <input class="star" type="radio" name="valoracion" value="10"/>                     
                                     </div> 
                                    
                                    </td> 
                                   </tr> 
                                  </table> 
 
                                  <table width="100%" cellspacing="0">  
                                  <tr> 
                                  <td style="width:155px;"> 
                                    <span>Valoración calidad/precio: </span> 
                                  </td> 
                                    <td valign="top" width=""> 
 
                                     <div class="Clear"> 
                                      <input class="star required" type="radio" name="calidad_precio" value="1"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="2"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="3"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="4"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="5"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="6"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="7"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="8"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="9"/> 
                                      <input class="star" type="radio" name="calidad_precio" value="10"/>                     
                                     </div> 
                                    
                                    </td> 
                                   </tr> 
                                  </table>                                   
                                </div> 
                            </li> 
                        </ul>'; 
                        ?> 
                         
                        <input type="button" name="bot" id="bot"   onclick="control_validacion ();"  value="Insertar opinión" class="btn btn-primary btn-lg" class="grey-btn" style="background:#272325; float:right; width:132px; margin-right:60px;"/> 
<?php 
echo 
                      </form>

No se que puede ser, a ver si alguien ve algo

Un saludo

PHPeros · #2 (**permalink**) 16/09/2015, 09:08

En realidad, serializar es algo más complejo.

http://stackoverflow.com/questions/1...t-no-framework

franjgg · #3 (**permalink**) 17/09/2015, 03:56

Hola he phperos,

He visto este link y varios de los códigos tienen partes que se asemejan al que yo he puesto, antes que nada decir que no tengo demasiados conocimientos de este tema, pero no se si sería posible añadir la parte que creo que se refiere a los radio a mí código, me refiero a está parte:

Código Java:

Ver originalif((field.type != 'checkbox' && field.type != 'radio') || field.checked){
                            query += '&' + field.name + "=" + encodeURIComponent(field.value).replace(/%20/g,'+');
                        }

Un saludo y muchas gracias amigo.

franjgg · #4 (**permalink**) 17/09/2015, 09:42

Para aquel que esté buscando, esta es la solución:

Código Javascript:

Ver originalfunction nuevoAjax(){
    var xmlhttp=false;
    try {xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {try {xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {xmlhttp = false;}}
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();}
    return xmlhttp;
}
 
function enviarFormulario(url, formid, divrespuesta){
        var Formulario = document.getElementById(formid);
        var longitudFormulario = Formulario.elements.length;
        var cadenaFormulario="";
        for (var i=0; i <= Formulario.elements.length-1;i++) {
        if(Formulario.elements[i].type=="checkbox" || Formulario.elements[i].type=="radio"){
            if(Formulario.elements[i].checked==true){cadenaFormulario += "&"+Formulario.elements[i].name+'='+encodeURIComponent(Formulario.elements[i].value);}
        }else{cadenaFormulario += "&"+Formulario.elements[i].name+'='+encodeURIComponent(Formulario.elements[i].value);}
        }
    peticion=nuevoAjax();
    peticion.open("POST", url, true);
    peticion.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
    peticion.send(cadenaFormulario);
    peticion.onreadystatechange = function() {
        if (peticion.readyState == 4 && (peticion.status == 200 || window.location.href.indexOf ("http") == - 1)){
            RESPUESTA=peticion.responseText;
                document.getElementById(divrespuesta).innerHTML =RESPUESTA;
        }
    if (peticion.readyState == 4 && peticion.status != 200){
        document.getElementById(divrespuesta)="FALLA EN LA COMUNICACION... SI EL PROBLEMA CONTINUA, FAVOR DE REPORTARLO";
    }
    }
}

Alexis88 · #5 (**permalink**) 17/09/2015, 10:24

Como una manera de evitar repetir las mismas instrucciones, la sección del bucle podría quedar así:

Código Javascript:

Ver originalfor (var i=0, elems=Formulario.elements, l=elems.length, cadenaFormulario = []; i < l; i++) {
    if (!("checked" in elems[i]) || elems[i].checked){
        cadenaFormulario.push(elems[i].name+'='+encodeURIComponent(elems[i].value));
    }
}

En cada iteración, comprobamos que el elemento no posea la propiedad checked, es decir, que no sea un radiobutton o un checkbox, o que se encuentre marcado, algo que solo puede ocurrir con los radiobutton y checkbox. Si la condición se cumple, procedemos a ejecutar la instrucción que, como estaba en tu código, era la misma para cuando se trataba de un radiobutton o checkbox y estaba marcado como para cuando no era otro tipo de elemento.

Como también podrás apreciar, en lugar de añadir el par clave-valor como parte de una cadena, lo hago como elemento de un array. Esto es porque, de la forma en la que estaba, se iba a añadir un & innecesario al inicio. Mejor forma un array con los pares clave-valor y, en el método .send(), los unes con un & usando el método .join().

Código Javascript:

Ver originalpeticion.send(cadenaFormulario.join("&"));

Un saludo