2017-05-23 8 views
0

Ich habe viele Fragen zu diesem Thema gesehen, aber ich habe keine Antwort auf meine Frage gefunden.JSON-Objekt über AJAX an PHP senden löst XML-Lesefehler aus

Ich mache eine Website mit einem Formular, wo man einen Studenten registrieren und senden Sie es als JSON-Objekt zu einem PHP-Skript über AJAX, aber aus welchem ​​Grund es nicht in den Ajax-Teil eingeben.

das ist mein HTML-Code

<!DOCTYPE html> 
<html lang='es'> 
<!-- Cabecera --> 
<head> 
    <meta charset="utf-8"> 
    <title>Página de registro de alumnos</title> 
    <!-- CSS, tanto del bootstrap principal como el custom en general --> 
    <link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet"> 
    <link href="./bootstrap/css/bootstrap-theme.min.css" rel="stylesheet"> 
    <link rel="stylesheet" type="text/css" href="prueba.css"> 

</head> 
<!-- cuerpo en general --> 
<body> 

<nav class="navbar navbar-inverse navbar-fixed-top"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">Front-End Test</a> 
    </div> 
    <div id="navbar" class="collapse navbar-collapse"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#">Registo</a></li> 
     <li><a href="consulta.html">Consulta</a></li> 
     </ul> 
    </div> 
    </div> 
</nav> 

<div class="container theme-showcase" role="main"> 
    <!-- descripción general --> 
    <div class="jumbotron"> 
     <h1>REGISTRO DE ALUMNOS</h1> 
     <p>Por favor, rellene el siguiente formulario para el registro de alumnos</p> 
    </div> 
</div> 
<!-- la parte del formato del formulario --> 

<div class="container"> 
    <div class="col-md-4"> 
     <form enctype='application/json' name="alumno" id="alumno"> 
      <h2>Nombre:</h2> 
      <input type="text" id="nombre" name="nombre"> </input> 
      <h2>Apellido Paterno:</h2> 
      <input type="text" id="ap_pat" name="ap_pat"> </input> 
      <h2>Apellido Materno:</h2> 
      <input type="text" id="ap_mat" name="ap_mat"> </input> 
      <h2>Carrera:</h2> 
      <select id="carrera" name="carrera"> 
       <option selected value="1">SISTEMAS COMPUTACIONALES</option> 
       <option value="2">QUIMICA</option> 
       <option value="3">MECATRONICA</option> 
       <option value="4">ELECTRONICA</option> 
       <option value="5">ELECTROMECANICA</option> 
       <option value="6">INDUSTRIAL</option> 
       <option value="7">LOGISTICA</option> 
       <option value="8">GESTION EMPRESARIAL</option> 
       <option value="9">TICS</option> 
       <option value="10">MAESTRIA EN CIENCIAS DE LA INGENIERIA</option> 
       <option value="11">MAESTRIA EN CIENCIAS DE LA INGENIERIA AMBIENTAL</option> 
       <option value="12">DOCTORADO EN CIENCIAS AMBIENTALES</option> 
      </select> 
      <h2>Genero:</h2> 
      <input type="checkbox" id="genero" name="genero"> <label for="genero">Haz click en el recuadro si es hombre</label> </input> 
     </form> 
    </div> 
</div> 

<div id="loader"> 
</div> 

<div class="container"> 
    <p><a class="btn btn-primary btn-lg" role="button" id="boton">Registrar alumno &raquo;</a></p> 
</div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script>window.jQuery || document.write('<script src="jquery-3.2.1.min.js"><\/script>')</script> 
<script src="./bootstrap/js/bootstrap.min.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js" ></script> 
<script type="text/javascript" src="./registroscript.js"> </script> 
</body> 
</html> 

das ist mein JavaScipt registroscript.js

$(document).ready(function(){ 
$("#boton").click(function(){ 
    //validaciones 
    var specialChars = "<>@!#$%^&*()_+[]{}?:;|'\"\\,./~`-=1234567890¬°~`¨¡¿´¨" 
    var check = function(string){ 
     if(string.length > 0){ 
      for(i = 0; i < specialChars.length;i++){ 
       if(string.indexOf(specialChars[i]) > -1){ 
        return true; 
       } 
      } 
      return false; 
     } else { 
      alert("Por favor, rellene todos los campos"); 
      return true; 
     } 
    } 

    if(!check($('#nombre').val()) && !check($('#ap_pat').val()) && !check($('#ap_mat').val())){ 
     //ajax 
     var formData = JSON.stringify($("#alumno").serializeArray()); 
     function myFunction() { 
      document.getElementById("loader").style.display = "inline"; 
     } 
     $.ajax({ 
      url: "alumnos.php", 
      data: $("#alumno").serialize(), 
      type:"POST", 
      dataType:"json",  
     }) 
     .done(function (json) { 
      alert("El alumno ha sido agregado"); 
     }) 
     //en caso de fallo 
     .fail(function(xhr, status, errorThrown){ 
      alert("Ha ocurrido un problema al momento de enviar el pedido"); 
     }) 
     .always(function(xhr, status){ 
      document.getElementById("loader").style.display = "none"; 
     }); 
    } else { 
     alert("no se pudo enviar el pedido"); 
    } 
}); 
}); 

und schließlich das ist das PHP-Skript i für den Test verwendet wurde

<?php 
$usuario = $_POST['nombre']; 
$ap_pat = $_POST['ap_pat']; 
$ap_mat = $_POST['ap_mat']; 
$carrera = $_POST['carrera']; 
$genero = $_POST['genero']; 

$file = fopen('alumno.json','w+'); 

echo "1: ".$usuario; 
echo "2: ".$ap_pat; 
echo "3: ".$ap_mat; 
echo "4: ".$carrera; 
echo "5: ".$genero; 
?> 

Wenn Ich versuche, den Ajax-Teil in der Firefox-Konsole auszuführen. TypeError: $ .ajax (...). Done ist keine Funktion

Fehler de Lectura XML: no se encuentra el elemento Ubicación: file: /// D: /Proyectos/ITT/Examen%20Front-End/alumnos.php Número de línea 15, Columna 3"

EDIT: die JQuery war in der Tat eine ältere Version, die nicht .done in ajax und korrigiert die doppelte JQuery Quelle

und es scheint, ist das Hauptproblem in der pHP-Code

+0

Ich bin mir nicht sicher ... Aber versuchen Sie, das nachlaufende Koma am Ende von 'dataType:" json ",' zu entfernen. –

+0

Warum laden Sie zwei jquery-Bibliotheken? Verwenden Sie einen, und verschieben Sie ihn an die Ihre aufrufenden jquery-Objekte, ohne zuerst die Bibliothek zu laden. – Canolyb1

+1

Es sieht so aus, als ob du jQuery zweimal eingibst, und die zweite eingeschlossene ist nur v1.4.3. Das jqXHR-Objekt, das von '$ .ajax()' zurückgegeben wurde, begann nicht, '.done()' bis v1.5 zu unterstützen. –

Antwort

0

ich, dass Sie sehen, unterstützen fehlen ein Semikolon:

var specialChars = "<>@!#$%^&*()_+[]{}?:;|'\"\\,./~`-=1234567890¬°~`¨¡¿´¨"; 

Versuchen Sie zunächst, Syntaxfehler zu beheben.

+0

In Wirklichkeit gibt es tatsächlich das Semikolon, und die Firefox-Konsole markiert keine anderen Syntaxfehler – Emenor