How can I make a table perform the functions of deleting and modifying? Without having to make 2 independent tables

2

I'm just starting to use PHP and the forms issue, so I still have questions about how to use the functions.

HTML code

    <legend>ELIMINAR</legend>
    <table class="table table-striped" summary="Tabla generica">
        <tr>
            <td>Id</td>
            <td>Nombre</td>
            <td>Apellido</td>
            <td>Edad</td>
            <td>Eliminar</td>
        </tr>
    <?php 
    $sql = "SELECT * FROM 'progra9a'.'princesas';";
        $resultado= mysqli_query($con,$sql);
        while($row= mysqli_fetch_array($resultado)){
            echo
             '
             <form action="../eliminar.php" method="get" enctype="multipart/form-data">
            <tr>
                <td>
                    <input type="hidden" name="princesid" value="'.$row[0].'">'.$row[0].'
                </td>

                <td><input type="text" name="princesanombre" value="'.$row[1].'"></td>
                <td><input type="text" name="princesaapellido" value="'.$row[2].'"></td>
                <td><input type="text" name="edad" value="'.$row[3].'"></td>



                <td><button class="eliminar" data-id="'.$row[0].'">Eliminar</button></td>
                </form>

            </tr>
            ';
        }
    ?>
</table>


    <br />
    <br />


    <legend>MODIFICAR</legend>
    <table class="table table-striped" summary="Tabla generica">
        <tr>
            <td>Id</td>
            <td>Nombre</td>
            <td>Apellido</td>
            <td>Edad</td>
            <td>Modificar</td>
        </tr>
    <?php 
    $sql = "SELECT * FROM 'progra9a'.'princesas';";
        $resultado= mysqli_query($con,$sql);
        while($row= mysqli_fetch_array($resultado)){
            echo
             '
             <form action="../modificar.php" method="get" enctype="multipart/form-data">
            <tr>
                <td>
                    <input type="hidden" name="princesid" value="'.$row[0].'">'.$row[0].'
                </td>

                <td><input type="text" name="princesanombre" value="'.$row[1].'"></td>
                <td><input type="text" name="princesaapellido" value="'.$row[2].'"></td>
                <td><input type="text" name="edad" value="'.$row[3].'"></td>



                <td><button class="modificar" data-id="'.$row[0].'">Modificar</button></td>
                </form>

            </tr>
            ';
        }
    ?>
</table>

PHP code. Delete.

Modify

    
asked by Edgar Felipe Hernandez Garcia 26.06.2017 в 09:56
source

1 answer

3

A good solution would be, as @GDP said, to have two buttons on the form, one for Delete and one for Modification, each with a label id different.

Then, using Ajax, combined with a library like jQuery, you listen to the clicks of each button based on the id. jQuery will determine which of the two buttons was pressed and will send via Ajax a request to the server to execute one of the two actions.

The advantage is that all this can be done without having to refresh the page.

For example:

$(function ()
{
  var btnModificar = $("#btnModificar");
  var btnEliminar = $("#btnEliminar");

  var btnClick = function(e) 
  {
    var btnPresionado = e.currentTarget.id;
    if (btnPresionado == "btnModificar") 
    {
      alert("Aquí se haría una  petición  Ajax para modificar");
    } 
    else if (btnPresionado == "btnEliminar") 
    {
      alert("Aquí se haría una  petición  Ajax para eliminar");
    } 
    else 
    {
      alert("Ninguno de los dos");
    }

    /* Se podría simplificar usando sólo esta llamada */
    /* Eliminando los tres if de más arriba */

/* 
* Comentado para evitar error en este contexto *

    if (btnPresionado)
    {
        post_data(btnPresionado);
    }
*/

  }

  btnModificar.on('click', btnClick);
  btnEliminar.on('click', btnClick);

//Ejemplo de una petición Ajax 
function post_data(accion) 
{
    /* Antes de llamar a crud.php */
    /* Agregar a data el contenido del formulario */
    /* y el contenido de accion */
	var frm=$( "#frmCrud" );

	var request = $.ajax
		({
			url: frm.attr("action"),
			method: frm.attr('method'),
			data: data,
			dataType: "html"
		});
		
		request.done(function( msg ) 
		{
			console.log(msg);

		});
 
		request.fail(function( jqXHR, textStatus ) 
		{
			alert( "Request failed: " + textStatus );
		});

}


});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="frmCrud" action="../crud.php" method="post" enctype="multipart/form-data">
<input type="hidden" name="princesid" value="id">
<input type="text" name="princesanombre" value="su nombre">
<input type="button" id="btnModificar" value="Modificar" />
<input type="button" id="btnEliminar" value="Eliminar" />
</form>

To see how to make requests to the server through Ajax, you can see the jQuery documentation .

Note:

I have added to the code a function called post_data . To simplify, you could obtain the id of the pressed button, add it to the variable data , call the function post_data and once inside it add to data the other elements of the form and make the Ajax call to the server using a php file that I have called crud.php (notice the attribute action of the form).

In the file crud.php , reading the data that has been passed you will be able to determine if a request for Elimination or Modification has been made and act accordingly.

crud.php would have a code more or less like this:

if(isset($_POST["btnEliminar"]))
{
    //Código para eliminar
}


if(isset($_POST["btnModificar"]))
{
    //Código para modificar
}
    
answered by 26.06.2017 / 12:16
source