Retrieve Mysql values with PHP and JS in Modal Window Bootstrap

0

Good evening, I tried to fill a modal window with values of table fields, with jquery , and it recovers all fields except the last 3 and I do not see why. These are the files: the html modal window, the jquery file to fill in and the button that triggers the window.

		$('#alumUpdate').on('show.bs.modal', function (event) {
		  var button = $(event.relatedTarget)
		  var matricula = button.data('matricula') 
		  var id = button.data('id') 
		  var nombre = button.data('nombre')
		  var apellidos = button.data('apellidos') 
		  var curp = button.data('curp') 
		  var genero = button.data('genero') 
		  var grupo = button.data('grupo')
		  var semestre = button.data('semestre')
		  var taller = button.data('taller')
		  var status = button.data('status') 
		  var beca = button.data('beca')   
		  var correo = button.data('correo')
		  var direccion = button.data('direccion')
		  var nombreTut = button.data('nombreTut')  
		  var apeTut = button.data('apeTut')
		  var telTut = button.data('telTut')
		  
		  var modal = $(this)
		  modal.find('.modal-title').text('Modificar Alumno: '+matricula)
		  modal.find('.modal-body #id').val(id)
		  modal.find('.modal-body #matricula').val(matricula)
		  modal.find('.modal-body #nombre').val(nombre)
		  modal.find('.modal-body #apellidos').val(apellidos)
		  modal.find('.modal-body #curp').val(curp)
		  modal.find('.modal-body #genero').val(genero)
		  modal.find('.modal-body #grupo').val(grupo)
		  modal.find('.modal-body #semestre').val(semestre)
		  modal.find('.modal-body #taller').val(taller)
		  modal.find('.modal-body #status').val(status)
		  modal.find('.modal-body #beca').val(beca)
		  modal.find('.modal-body #correo').val(correo)
		  modal.find('.modal-body #direccion').val(direccion)
		  modal.find('.modal-body #nombreTut').val(nombreTut)
		  modal.find('.modal-body #apeTut').val(apeTut)
		  modal.find('.modal-body #telTut').val(telTut)
		  $('.alert').hide();
		})
<form id="actualizarAlum">
<div class="modal fade" id="alumUpdate" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">Modificar Alumnos</h4>
      </div>
      <div class="modal-body">
      <div id="datos_ajax"></div>
          <div class="form-group">
            <label for="matricula" class="control-label">Matrícula:</label>
            <input type="text" class="form-control" id="matricula" name="matricula" required maxlength="18">
            <input type="hidden" class="form-control" id="id" name="id">
          </div>
      <div class="form-group">
            <label for="nombre" class="control-label">Nombre:</label>
            <input type="text" class="form-control" id="nombre" name="nombre" required required="45">
          </div>
      <div class="form-group">
            <label for="apellidos" class="control-label">Apellidos:</label>
            <input type="text" class="form-control" id="apellidos" name="apellidos" required required="45">
        </div>
       <div class="form-group">
            <label for="curp" class="control-label">CURP:</label>
            <input type="text" class="form-control" id="curp" name="curp" required required="25"> 
        </div>
        <div class="form-group">
            <label for="genero" class="control-label">Genéro:</label>
            <select class="form-control" id="genero" name="genero">
                <option value="Masculino">Masculino</option> 
                <option value="Femenino">Femenino</option> 
            </select>   
       </div>
       <div class="form-group">
            <label for="grupo" class="control-label">Grupo:</label>
            <input type="text" class="form-control" id="grupo" name="grupo" required maxlength="15">
       </div>
            <div class="form-group">
            <label for="semestre" class="control-label">Semestre:</label>
            <input type="text" class="form-control" id="semestre" name="semestre" required maxlength="15">
          </div>
       <div class="form-group">
            <label for="taller" class="control-label">Taller:</label>
            <input type="text" class="form-control" id="taller" name="taller" required maxlength="15">
          </div>
       <div class="form-group">
            <label for="status" class="control-label">Status:</label>
            <select class="form-control" id="status" name="status">
                <option value="Regular">Regular</option>
                <option value="Irregular">Irregular</option>
            </select>   
       </div>
       <div class="form-group">
            <label for="beca" class="control-label">Beca:</label>
            <input type="text" class="form-control" id="beca" name="beca" required maxlength="15">
          </div>
        <div class="form-group">
            <label for="correo" class="control-label">Correo:</label>
            <input type="text" class="form-control" id="correo" name="correo" required maxlength="18">
       </div>
        <div class="form-group">
            <label for="direccion" class="control-label">Dirección:</label>
            <input type="text" class="form-control" id="direccion" name="direccion" required maxlength="37">
       </div>
       <div class="form-group">
            <label for="nombreTut" class="control-label">Nombre Tutor:</label>
            <input type="text" class="form-control" id="nombreTut" name="nombreTut" required maxlength="26">
       </div>
       <div class="form-group">
            <label for="apeTut" class="control-label">Apellido Tutor:</label>
            <input type="text" class="form-control" id="apeTut" name="apeTut" required maxlength="30">
       </div>
       <div class="form-group">
            <label for="telTut" class="control-label">Teléfono Tutor:</label>
            <input type="text" class="form-control" id="telTut" name="telTut" required maxlength="15">
       </div>
       
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
        <button type="submit" class="btn btn-primary">Actualizar</button>
      </div>
    </div>
  </div>
</div>
</form>
if($row = mysqli_fetch_array($sqlAl)) {
    ?>
    <tr>
      <td><?php echo $row['matricula'];?></td>
      <td><?php echo $row['nombre'];?></td>
      <td><?php echo $row['apellidos'];?></td>
      <td><?php echo $row['curp'];?></td>
      <td><?php echo $row['genero'];?></td>
      <td><?php echo $row['idGrupo'];?></td>
      <td><?php echo $row['Semestre'];?></td>
      <td><?php echo $row['status'];?></td>

             <td>
             <button type="button" class="btn btn-info" data-toggle="modal" data-target="#alumUpdate" data-id="<?php echo $row['idAlumno']?>" data-matricula="<?php echo $row['matricula']?>" data-nombre="<?php echo $row['nombre']?>" data-apellidos="<?php echo $row['apellidos']?>" data-curp="<?php echo $row['curp']?>" data-genero="<?php echo $row['genero']?>" data-grupo="<?php echo $row['idGrupo']?>" data-semestre="<?php echo $row['Semestre']?>" data-taller="<?php echo $row['idTaller']?>" data-status="<?php echo $row['status']?>" data-beca="<?php echo $row['idBeca']?>" data-correo="<?php echo $row['correo']?>" data-direccion="<?php echo $row['direccion']?>" data-nombreTut="<?php echo $row['nombreTutor']?>" data-apeTut="<?php echo $row['apellidos_tutor']?>" data-telTut="<?php echo $row['tel_tutor']?>"><i class='glyphicon glyphicon-edit' ></i> Modificar</button>
    
asked by Armando Arellano 10.10.2016 в 04:21
source

1 answer

0

Modify the following data:

var nombreTut = button.data('nombretut')  
var apeTut = button.data('apetut')
var telTut = button.data('teltut')

jQuery when processing "data attributes" converts them all to lowercase

    
answered by 11.10.2016 / 23:24
source