1

me gustaria crear un boton que borre filas de una tabla, la parte html y css estan listas, pero el javascript no funciona.

Aqui dejo mis codigos.

<?php
//Archivo de conexion 
include_once("connection.php");
$sql = "SELECT * FROM `reservacdt` limit 10 ";
$queryRecords = mysqli_query($conn, $sql) or die("Error al buscar");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="jquery-1.11.1.min.js"></script> <!-- Se comunica con jquery para editar la tabla -->
<link rel="stylesheet" href="estilos\clase.css"> <!-- El css de la pagina, mas que todo el de la tabla -->
</head>

<body>
<!-- Refresca la pagina -->
<br></br>
<div style="text-align: center;"><a href="cdtclase.php">Haga click para refrescar</a></div> 

<!-- Tabla con los datos de la base de datos -->
<div class="container" style="padding:50px 250px;">
<h1>Clases actuales en el sistema (Centro de tecnología):</h1>
<h2>Haga click en un campo para editarlo (La fecha de inscripción no es editable)</h2>
<div id="msg" class="alert"></div> <!-- Da las alertas en connection -->
<table id="employee_grid" name="employee_grid" class="table table-condensed table-hover table-striped bootgrid-table" width="60%" cellspacing="0">
<thead>
  <tr>
     <th>Nombre</th>
     <th>Materia</th>
     <th>Fecha de inicio</th>
     <th>Hora que empieza</th>
     <th>Hora que termina</th>
     <th>Número de maquinas a usar</th>
     <th>Fecha de inscripción</th>
     <th>Borrar</th>
  </tr>
</thead>
<tbody id="_editable_table"> <!-- Usando los datos en connection, se imprimen los datos de uno en uno -->
  <?php foreach($queryRecords as $res) :?>
  <tr data-row-id="<?php echo $res['id'];?>">
     <td class="editable-col" contenteditable="true" colcdt='0' oldVal ="<?php echo $res['nombre'];?>"><?php echo $res['nombre'];?></td>
     <td class="editable-col" contenteditable="true" colcdt='1' oldVal ="<?php echo $res['materia'];?>"><?php echo $res['materia'];?></td>
     <td class="editable-col" contenteditable="true" colcdt='2' oldVal ="<?php echo $res['fecha'];?>"><?php echo $res['fecha'];?></td>
     <td class="editable-col" contenteditable="true" colcdt='3' oldVal ="<?php echo $res['fechaemp'];?>"><?php echo $res['fechaemp'];?></td>
     <td class="editable-col" contenteditable="true" colcdt='4' oldVal ="<?php echo $res['fechater'];?>"><?php echo $res['fechater'];?></td>
     <td class="editable-col" contenteditable="true" colcdt='5' oldVal ="<?php echo $res['numero'];?>"><?php echo $res['numero'];?></td>
     <td class="editable-col" contenteditable="false" colcdt='6' oldVal ="<?php echo $res['fechainscripcion'];?>"><?php echo $res['fechainscripcion'];?></td>
     <td><button type="button" name="delete_btn" colcdt='7' oldVal="'.$res["id"].'" class="btn btn-xs btn-danger btn_delete">x</button></td></tr> 
  <?php endforeach;?>
</tbody>
</table>
</div>

<div id="boton2" style="text-align: center;"> <!-- Muestra la forma de buscar datos -->
<button onclick="myFunction2()" id="busca">Mostrar el buscador</button>

<div id="buscador" name="buscador">
<form method="POST" action="cdtbuscar.php" style="padding:50px 250px;">
<h3>Buscar usando el nombre del profesor o su materia</h3>
<input type="text" placeholder="Escriba el nombre del profesor o su materia" name="niet" id="niet">
<input type="submit" id="input buscar" name="input buscar">
</form>
</div>

<div id="boton1" style="text-align: center;"> <!-- Muestra la forma de borrar datos -->
<button onclick="myFunction1()" id="borra">Mostrar forma de borrar datos</button>
</div>

<div id="borrador"> <!-- La forma de borrar datos -->
<form method="POST" action="cdtclaseborrar.php" style="padding:50px 250px;">

<h1>Escriba el nombre del profesor para borrar su clase o escriba una fecha de inscripción para borrar la clase correspondiente</h1>
<input type="text" placeholder="Escriba el nombre del profesor o la fecha de inscripcion para borrar la clase" name="nombreprofe" id ="nombreprofe"></input>
<div id="input submit" style="text-align: center;;"><input type="submit" id="submit" name="submit" class="floated" value="Borrar clase"></input></div>
<br></br>
</form>
</div>

</body>
</html>
<script type="text/javascript">

function myFunction1() { <!-- Muestra el formulario de borrar filas -->
var x = document.getElementById("borrador");
var audio = new Audio('audio/mouse.mp3');
audio.play();
if (confirm("Esta seguro? Si borra la fila, se borrara en la base de datos")) {
    if (x.style.display === "block") {
    x.style.display = "none";
    document.getElementById("borra").value="Mostrar forma de borrar datos";

} else {
    x.style.display = "block";
    document.getElementById("borra").value="Quitar formulario";
}

} else {
    x.style.display = "none";   
}

}

function myFunction2() { <!-- Muestra el formulario de busqueda de filas -->
var z = document.getElementById("buscador");
var audio = new Audio('audio/mouse.mp3');
audio.play();
if (z.style.display === "block") {
    z.style.display = "none";
    document.getElementById("busca").value="Mostrar forma de buscar datos";
} else {
    z.style.display = "block";
    document.getElementById("busca").value="Quitar formulario";
}
}

$(document).ready(function(){ <!-- Permite editar la tabla en si -->
$('td.editable-col').on('focusout', function() {
    data = {};
    data['val'] = $(this).text();
    data['id'] = $(this).parent('tr').attr('data-row-id');
    data['cdtclase'] = $(this).attr('colcdt');
    if($(this).attr('oldVal') === data['val'])
    return false;

    $.ajax({   

                type: "POST",  
                url: "servercdt.php",  <!-- Se conecta a este archivo php que contiene alertas y la coneccion -->
                cache:false,  
                data: data,
                dataType: "json",               
                success: function(response)  
                {   
                    //$("#loading").hide();
                    if(!response.error) {
                        $("#msg").removeClass('alert-danger');
                        $("#msg").addClass('alert-success').html(response.msg);
                    } else {
                        $("#msg").removeClass('alert-success');
                        $("#msg").addClass('alert-danger').html(response.msg);
                    }
                }   
            });
});
});

//Arreglar esto
$(document).on('click', '.btn_delete', function(){  
data = {};
    data['val'] = $(this).text();
    data['id'] = $(this).parent('tr').attr('data-row-id');
    data['cdtclase'] = $(this).attr('colcdt');
    if($(this).attr('oldVal') === data['val'])
    return false;
       if(confirm("Seguro?"))  
       {  
            $.ajax({  
                 url:"deletecdt.php",  
                 method:"POST",  
                 data:data,  
                 dataType:"json",  
                 success:function(data){  
                      alert(data);  
                 }  
            });  
       }  
  });  

 </script>

delete.php

<?php

include_once("connection.php");

//define cdtclase of column
$columns = array(
    0 =>'nombre', 
    1 => 'materia',
    2 => 'fecha',
    3 => 'fechaemp',
    4 => 'fechater',
    5 => 'numero',
    6 => 'fechainscripcion'
 );
 $error = false;
 $colVal = '';
 $colcdt = $rowId = 0;

 if(isset($_POST)){
    if(isset($_POST['val']) && !empty($_POST['val']) && !$error) {
      $colVal = $_POST['val'];
      $error = false;

    } else {
      $error = true;
    }
    if(isset($_POST['cdtclase']) && $_POST['cdtclase'] >= 0 &&  !$error) {
      $colcdt = $_POST['cdtclase'];
      $error = false;
    } else {
      $error = true;
    }
    if(isset($_POST['id']) && $_POST['id'] > 0 && !$error) {
      $rowId = $_POST['id'];
      $error = false;
    } else {
      $error = true;
    }

    if(!$error) {
        $sql = "DELETE FROM reservacdt SET ".$columns[$colcdt]." = '".$colVal."' WHERE id='".$rowId."'";
        $status = mysqli_query($conn, $sql) or die("database error:". mysqli_error($conn));
        $msg = array('error' => $error, 'msg' => 'Se actualizaron los datos, recargue la pagina para poder verlo');
 } else {
    $msg = array('error' => $error, 'msg' => 'Hubo un problema actualizando los datos');
 }
 }
?>

connection.php

<?php
/* Database connection start */
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "prueba";

$conn = mysqli_connect($servername, $username, $password, $dbname) or die("Connection failed: " . mysqli_connect_error());

/* check connection */
if (mysqli_connect_errno()) {
printf("Connect failed: %s\n", mysqli_connect_error());
exit();
}

?>
2
  • Para saber dónde deja de funcionar el JavaScript te recomiendo que nada más hacer la llamada pongas un alert() y así sabrás si llega a entrar al JavaScript o no. Commented el 30 oct. 2018 a las 12:58
  • Me equivoque en una parte del codigo, coloque el codigo de un archivo que no era, perdon. Creo que el problema esta en delete.php o en su llamada
    – Shredder
    Commented el 30 oct. 2018 a las 13:03

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.