Uncaught ReferenceError: VerSolInfo is not defined at onload

0

Good afternoon,

I am doing (rather, re-doing) a CRUD of information and it gives me the error of the title. I have on one side the view, with this in the body:

<body onload="VerSolInfo()">

Then I have an ajax.js file with this function:

function VerSolInfo() {
    $.ajax({
        type: "GET",
        url: "../assets/webla/solicitudinfo.php",
        success: function(data){
            $('tbody').html(data);
        }
    })
}

And a requestinfo.php file with this code:

 else {
        $solicitudes = $solicitud->getSolicitudes();
        $totalsolicitudes = count($solicitudes);
        if ($totalsolicitudes > 0){
            //foreach ($solicitudes as $solinfo){ 

            while($solinfo = $solicitudes->fetch()){
    ?>
        <tr>
            <td><?php echo $solinfo['IDSolicitud']; ?></td>
            <td><?php echo $solinfo['DiaSolicitud']; ?><br><?php echo $solinfo['HoraSolicitud']; ?></td>
            <td><?php echo $solinfo['Centro']; ?></td>
            <td><?php echo $solinfo['Nombre']; ?>  <?php echo $solinfo['Apellidos']; ?></td>
            <td><?php echo $solinfo['CursoEscolar']; ?></td>
            <td><?php echo getAge($solinfo['FechaNacimiento']); ?> años</td>
            <td><i class="fa fa-phone-square" aria-hidden="true"></i> <?php echo $solinfo['MovilContacto']; ?><br><i class="fa fa-envelope" aria-hidden="true"></i> <?php echo $solinfo['EmailContacto']; ?></td>
            <td><span class="label label-default green" style="background-color:#32C5D2;border-radius: 5px !important;">Nueva Solicitud</span></td>
            <td>
                <a class="btneliminarsolinfo btn" data-id="<?php echo $solinfo['IDSolicitud']; ?>" data-action="remove" style="background-color:#FF0206;border: 0px !important;color:white;" data-toggle="confirmation" title="¿Eliminar Solicitud?" data-singleton="true"> <i class="fa fa-trash" aria-hidden="true"></i> </a>
                <a class="btnversolinfo btn" data-id="<?php echo $solinfo['IDSolicitud']; ?>" data-action="ver" style="background-color:#1b9e1d;border: 0px !important;color:white;"> <i class="fa fa-eye" aria-hidden="true"></i> </a>
                <a class="btneditarsolinfo btn" data-id="<?php echo $solinfo['IDSolicitud']; ?>" data-action="editar" style="background-color:#5172F3;border: 0px !important;color:white;"> <i class="fa fa-pencil-square-o" aria-hidden="true"></i> </a>
                <a class="btnetiquetarsolinfo btn" data-id="<?php echo $solinfo['IDSolicitud']; ?>" data-action="etiquetar" style="background-color:#EDC30F;border: 0px !important;color:white;"> <i class="fa fa-tags" aria-hidden="true"></i> </a>
                <div id="resultado-mi-formulario"></div>
            </td>
        </tr>
    <?php   
            }
        }
    }

?>

The problem is that the table does not load any data and in the console I get the error of the title.

Could someone tell me what I'm doing wrong?

Ajax code errors:

function NuevaSolInfo() {     
    var data = $(this).serialize();

    $.ajax({            
        type : 'POST',
        url  : '../assets/webla/solicitudinfo.php',
        data : data,
        success :  function(data) {                 
            $("#resultado-mi-formulario").html(data).fadeIn();
            $('#nuevasolicitud').modal('hide');

        },
        complete: function(){
            setTimeout(function() {
        }, 15000);    
        }
    });         
    return false;           
}

function VerSolInfo() {
    $.ajax({
        type: "GET",
        url: "../assets/webla/solicitudinfo.php",
        success: function(data){
            $('tbody').html(data);
        }
    });
}

It is giving me several errors in this part of the code and I do not know what is really wrong, since I see it well. Before, the function of NuevaSolInfo worked and now I do not know what I've done that does not work.

In NuevaSolInfo function I get "is defined but never used", in var data = $ (this) .serialize (); It says "Missing use strict statement", in VerSolInfo function the same, "is defined but never used" and in $ .ajax below (the one above does not) I get "Missing use strict statement".

Could someone tell me what the problem is?

Code for new request

This is the modal, with the function in the button submit of onclick="NewSolInfo ()"

<form name="form" method="post" id="solicitudinfo">
<input type="hidden" name="action" value="insert"/>
<div class="title" style="margin-top:15px;margin-bottom: 15px;">
    <p>Información del Alumno</p>
</div>
<div class="row">
    <div class="col-md-6">
        <label> Centro:</label>
        <div class="input-group">
          <span class="input-group-addon"><i class="fa fa-map-marker" aria-hidden="true"></i></span>
          <select id="centro" name="centro" class="selectpicker form-control" data-live-search="true" >
            <option value="" selected disabled>Centro</option>
            <option value="Bormujos">Bormujos</option>
            <option value="Bollullos">Bollullos de la Mitación</option>
            <option value="Bol/Bor">Bol/Bor Pendiente de asignar</option>
            <option value="Summer School">Summer School</option>
          </select>
        </div>
    </div>
    <div class="col-md-6">
        <label> Curso:</label>
        <div class="input-group">
          <span class="input-group-addon"><i class="fa fa-graduation-cap" aria-hidden="true"></i></span>
          <select id="curso" name="curso" class="selectpicker form-control" data-live-search="true" >
            <option value="" selected disabled>Curso a Inscribir</option>
            <option value="Nursery 1">Nursery 1</option>
            <option value="Nursery 2">Nursery 2</option>
            <option value="Playway 1">Playway 1</option>
            <option value="Playway 2">Playway 2</option>
            <option value="Starters 1">Starters 1</option>
            <option value="Starters 2">Starters 2</option>
            <option value="Movers 1">Movers 1</option>
            <option value="Movers 2">Movers 2</option>
            <option value="Flyers 1">Flyers 1</option>
            <option value="Flyers 2">Flyers 2</option>
            <option value="Pre PET">Pre PET</option>
            <option value="KET">KET</option>
            <option value="PET">PET</option>
            <option value="FIRST">FIRST</option>
            <option value="CAE">CAE</option>
            <option value="CPE">CPE</option>
            <option value="Intensivo PET">Intensivo PET</option>
            <option value="Intensivo FIRST">Intensivo FIRST</option>
            <option value="Intensivo CAE">Intensivo CAE</option>
            <option value="Intensivo CPE">Intensivo CPE</option>
            <option value="Starter Adults">Starter Adults</option>
            <option value="Conversación">Conversación</option>
            <option value="Business">Business</option>
            <option value="One to one">One to one</option>
            <option value="English Support">English Support</option>
            <option value="French Support">French Support</option>
            <option value="German Support">German Support</option>
            <option value="Francés Iniciación">Francés Iniciación</option>
            <option value="Francés Primaria">Francés Primaria</option>
            <option value="Francés Secundaria">Francés Secundaria</option>
            <option value="Francés A1">Francés A1</option>
            <option value="Francés A2">Francés A2</option>
            <option value="Francés B1">Francés B1</option>
            <option value="Francés B2">Francés B2</option>
            <option value="Francés C1">Francés C1</option>
            <option value="Alemán Iniciación">Alemán Iniciación</option>
            <option value="Alemán Primaria">Alemán Primaria</option>
            <option value="Alemán Secundaria">Alemán Secundaria</option>
            <option value="Alemán A1">Alemán A1</option>
            <option value="Alemán A2">Alemán A2</option>
            <option value="Alemán B1">Alemán B1</option>
            <option value="Alemán B2">Alemán B2</option>
            <option value="Alemán C1">Alemán C1</option>
            <option value="Pendiente de Nivel">Pendiente de Nivel</option>
          </select>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label> Nombre Alumno:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></div>
                <input type="text" class="form-control" name="nombre" placeholder="Nombre"  maxlength="50">
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label> Apellidos Alumno:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></div>
                <input type="text" class="form-control" name="apellidos" placeholder="Apellidos"  maxlength="50">
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label> Fecha de Nacimiento:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-calendar" aria-hidden="true"></i></div>
                <input type="date" class="form-control" name="fechanacimiento" >
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label>Población:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-home" aria-hidden="true"></i></div>
                <input type="text" class="form-control" name="pueblo" placeholder="Población">
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label>Código Postal:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-location-arrow" aria-hidden="true"></i></div>
                <input type="number" class="form-control" name="codpostal" placeholder="Código Postal">
            </div>
        </div>
    </div>
</div>
<div class="title" style="margin-top:30px;margin-bottom: 15px;">
    <p>Información del Primer Tutor</p>
</div>
<div class="row">
    <div class="col-md-6">
        <div class="form-group">
            <label>Nombre Tutor:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></div>
                <input type="text" class="form-control" name="nombretutor" placeholder="Nombre">
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label>Apellidos Tutor:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></div>
                <input type="text" class="form-control" name="apellidostutor" placeholder="Apellidos">
            </div>
        </div>
    </div>
</div>
<div class="title" style="margin-top:30px;margin-bottom: 15px;">
    <p>Información General</p>
</div>
<div class="row">
    <div class="col-md-6">
        <div class="form-group">
            <label> Correo de Contacto:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-envelope" aria-hidden="true"></i></div>
                <input type="email" class="form-control" name="email" placeholder="Correo Electrónico" >
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <label> Movil de Contacto:</label>
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-phone" aria-hidden="true"></i></div>
                <input type="tel" class="form-control" name="movil" placeholder="Movil" >
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <label> Atendido por:</label>
        <div class="input-group">
          <span class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></span>
          <select id="atendido" name="atendido" class="selectpicker form-control" data-live-search="true" >
            <option value="" selected disabled>Atendido por...</option>
            <option value="Mari Carmen Puerta Clewer">Mari Carmen Puerta Clewer</option>
            <option value="Charlie Clewer">Charlie Clewer</option>
            <option value="Samantha Clewer">Samantha Clewer</option>
            <option value="Lupe Barba">Lupe Barba</option>
            <option value="Sandra Álvarez">Sandra Álvarez</option>
          </select>
        </div>
    </div>
    <div class="col-md-12">
        <div class="form-group">
          <label>Observaciones:</label>
          <textarea class="form-control" rows="5" name="observaciones" style="height: auto !important;"></textarea>
        </div>
    </div>
    <div id="resultado-mi-formulario"></div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button>
<button type="reset" class="btn btn-warning">Limpiar</button>
<button type="submit" id="btsubmit" class="btn btn-info" onClick="NuevaSolInfo()">Enviar Solicitud de Información</button>
</form>

The part of AJAX that I have (without modifying it with the new thing that you have put in the answer:

function NuevaSolInfo() {     
    var data = $(this).serialize();

    $.ajax({            
        type : 'POST',
        url  : '../assets/webla/solicitudinfo.php',
        data : data,
        success :  function(data) {
            $('#nuevasolicitud').modal('hide');
            VerSolInfo();
        },
        complete: function(){
            setTimeout(function() {
        }, 15000);    
        }
    });         
    return false;           
}

And the part of the php that inserts it in the BDD

if ($_POST['action'] == "insert") {
    $centro = secure($_POST['centro']);
    $curso = secure($_POST['curso']);
    $nombre = ucwords(strtolower(secure($_POST['nombre'])));
    $apellido = ucwords(strtolower(secure($_POST['apellidos'])));
    $fechanacimiento = secure($_POST['fechanacimiento']);
    $poblacion = ucwords(strtolower(secure($_POST['pueblo'])));
    $codpostal = secure($_POST['codpostal']);
    $nombretutor = ucwords(strtolower(secure($_POST['nombretutor'])));
    $apellidostutor = ucwords(strtolower(secure($_POST['apellidostutor'])));
    $email = strtolower(secure($_POST['email']));
    $movil = secure($_POST['movil']);
    $conocen = "Not Answered";
    $atendido = secure($_POST['atendido']);
    $observaciones = ucfirst(strtolower(secure($_POST['observaciones'])));
    $dia = date("d") . "/" . date("m") . "/" . date("Y");
    $hora = date("G") . ":" . date("i") . ":" . date("s");

    $solicitud->addSolicitud($dia, $hora, $centro, $curso, $nombre, $apellido, $fechanacimiento, $poblacion, $codpostal, $nombretutor, $apellidostutor, $email, $movil, $conocen, $observaciones, $atendido);

    if ($solicitud == true) {
        echo "<script>swal('Confirmación', 'Se ha añadido la nueva solicitud.', 'success')</script>";
    } else {
        echo "<script>swal('Error', 'Ha ocurrido un problema al enviar la solicitud de información. Inténtelo de nuevo o llame al 902 024 890.', 'error')</script>";
    }
}
    
asked by Charlie Clewer 05.10.2017 в 18:47
source

1 answer

0

It would be something like that, look at the comments.

$(document).ready(function(){
  //VerSolInfo();
  
  var $form = $('#form');
  
  $form.on('submit', function(e) {
    e.preventDefault();
    e.stopPropagation();
    
    var datosDelFormulario = $(this).serialize();
    
    console.log(datosDelFormulario);
    
    return false; // para que no se recargue la página
  });
  
  
});

function VerSolInfo() {

  $.ajax({
    url:'/solicitudes'
  }).done(function(response){
    $('#tBody').html(response);
  })
  .fail(function(error) {
    console.log(error);
  })
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!--Esto sería sin jQuery --->
<script>
function myFunc() {
	alert("asdasd");
}
</script>



<body onload="myFunc()"></body>

<!-- Con jQuery no haría falta onload=myFunc()-->

<!--Con jquery tendrías tú tabla -->

<table>
  <tbody id="tBody"></tbody>
</table>

<form id="form">
  <input name="nombre">
  <button>Insertar</button>
</form>
    
answered by 05.10.2017 / 20:31
source