Foros del Web » Programando para Internet » PHP »

Ejecutar función php desde ajax - jquery

 Estas en el tema de Ejecutar función php desde ajax - jquery en el foro de PHP en Foros del Web. Hola a todos, estoy aplicando un datatable con el ejemplo de esta pagina: http://codersfolder.com/2016/07/crud-with-php-mysqli-bootstrap-datatables-jquery-plugin/ Lo estoy aplicando correctamente, lo que me sucede es que en ...
  #1 (permalink)  
Antiguo 19/08/2017, 04:33
 
Fecha de Ingreso: marzo-2016
Mensajes: 17
Antigüedad: 8 años, 11 meses
Puntos: 0
Ejecutar función php desde ajax - jquery
Hola a todos, estoy aplicando un datatable con el ejemplo de esta pagina:

http://codersfolder.com/2016/07/crud-with-php-mysqli-bootstrap-datatables-jquery-plugin/

Lo estoy aplicando correctamente, lo que me sucede es que en la web tengo varias tablas, y en este ejemplo, desde el archivo .js donde están las funciones para el crud, llama a un archivo php diferente para cada acción, y me gustaría agruparlos en un único archivo en funciones y ejecutar la funcion php que corresponda.

Os paso los ejemplos de de al cargar la pagina y al editar:

Código: 
var manageMemberTable;

$(document).ready(function () {

    manageMemberTable = $("#manageMemberTable").DataTable({
        "ajax": "php_action/retrieve.php",
        "order": []
    });

    $("#addMemberModalBtn").on('click', function () {
        // reset the form 
        $("#createMemberForm")[0].reset();
        // remove the error 
        $(".form-group").removeClass('has-error').removeClass('has-success');
        $(".text-danger").remove();
        // empty the message div
        $(".messages").html("");

        // submit form
        $("#createMemberForm").unbind('submit').bind('submit', function () {

            $(".text-danger").remove();

            var form = $(this);

            // validation
            var name = $("#name").val();
            var address = $("#address").val();
            var contact = $("#contact").val();
            var active = $("#active").val();

            if (name === "") {
                $("#name").closest('.form-group').addClass('has-error');
                $("#name").after('<p class="text-danger">The Name field is required</p>');
            } else {
                $("#name").closest('.form-group').removeClass('has-error');
                $("#name").closest('.form-group').addClass('has-success');
            }

            if (address === "") {
                $("#address").closest('.form-group').addClass('has-error');
                $("#address").after('<p class="text-danger">The Address field is required</p>');
            } else {
                $("#address").closest('.form-group').removeClass('has-error');
                $("#address").closest('.form-group').addClass('has-success');
            }

            if (contact === "") {
                $("#contact").closest('.form-group').addClass('has-error');
                $("#contact").after('<p class="text-danger">The Contact field is required</p>');
            } else {
                $("#contact").closest('.form-group').removeClass('has-error');
                $("#contact").closest('.form-group').addClass('has-success');
            }

            if (active === "") {
                $("#active").closest('.form-group').addClass('has-error');
                $("#active").after('<p class="text-danger">The Active field is required</p>');
            } else {
                $("#active").closest('.form-group').removeClass('has-error');
                $("#active").closest('.form-group').addClass('has-success');
            }

            if (name && address && contact && active) {
                //submi the form to server
                $.ajax({
                    url: form.attr('action'),
                    type: form.attr('method'),
                    data: form.serialize(),
                    dataType: 'json',
                    success: function (response) {

                        // remove the error 
                        $(".form-group").removeClass('has-error').removeClass('has-success');

                        if (response.success === true) {
                            $(".messages").html('<div class="alert alert-success alert-dismissible" role="alert">' +
                                    '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
                                    '<strong> <span class="glyphicon glyphicon-ok-sign"></span> </strong>' + response.messages +
                                    '</div>');

                            // reset the form
                            $("#createMemberForm")[0].reset();

                            // reload the datatables
                            manageMemberTable.ajax.reload(null, false);
                            // this function is built in function of datatables;

                        } else {
                            $(".messages").html('<div class="alert alert-warning alert-dismissible" role="alert">' +
                                    '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
                                    '<strong> <span class="glyphicon glyphicon-exclamation-sign"></span> </strong>' + response.messages +
                                    '</div>');
                        }  // /else
                    } // success  
                }); // ajax subit 				
            } /// if


            return false;
        }); // /submit form for create member
    }); // /add modal

});
Código: 
function removeMember(id = null) {
    if (id) {
        // click on remove button
        $("#removeBtn").unbind('click').bind('click', function () {
            $.ajax({
                url: 'php_action/remove.php',
                type: 'post',
                data: {member_id: id},
                dataType: 'json',
                success: function (response) {
                    if (response.success === true) {
                        $(".removeMessages").html('<div class="alert alert-success alert-dismissible" role="alert">' +
                                '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
                                '<strong> <span class="glyphicon glyphicon-ok-sign"></span> </strong>' + response.messages +
                                '</div>');

                        // refresh the table
                        manageMemberTable.ajax.reload(null, false);

                        // close the modal
                        $("#removeMemberModal").modal('hide');

                    } else {
                        $(".removeMessages").html('<div class="alert alert-warning alert-dismissible" role="alert">' +
                                '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
                                '<strong> <span class="glyphicon glyphicon-exclamation-sign"></span> </strong>' + response.messages +
                                '</div>');
                    }
                }
            });
        }); // click remove btn
    } else {
        alert('Error: Refresh the page again');
}
}
Pues bien, lo que quiero es que en vez de ejecutar un archivo php por cada acción, llamar al mismo archivo y ejecutar una función, y así tenerlo todo agrupado.

No se si me explico, un beso a todos
  #2 (permalink)  
Antiguo 20/08/2017, 16:47
Avatar de Thejuanjo  
Fecha de Ingreso: mayo-2014
Mensajes: 28
Antigüedad: 10 años, 9 meses
Puntos: 2
Respuesta: Ejecutar función php desde ajax - jquery
Hola amigo, si he entendido bien, quieres poner todas las funciones en un archivo, vamos a llamarlo "funciones.php".

Vamos a ir paso por paso.
Primero vamos a definir el archivo "funciones.php"

Código PHP:
//Definimos todas las funciones
//funciones de ejemplo

function funcion_1(){
global ....

}

function funcion_2($id,$count....){
global ....

}

....

//Ahora es el momento de llamar a las funciones

if(isset($_GET['funcion']) && !empty($_GET['funcion'])){//comprobamos que exista ese GET y que no este vacío.
$funcion = intval($_GET['funcion']); //Asignamos una variable a su contenido y de paso comprobamos que sólo sea numérica.

if($funcion == 1){funcion_1();}
else if($funcion == 2){funcion_2(1,0...);
else if($funcion == 3){funcion_3();}
....
} 

Ahora vamos con el js:
Código Javascript: 
Ver original
  1. var manageMemberTable;
  2.  
  3. $(document).ready(function () {
  4.  
  5.     manageMemberTable = $("#manageMemberTable").DataTable({
  6.         "ajax": "php_action/funciones.php?funcion=1",
  7.         "order": []
  8.     });
  9.  
  10.     $("#addMemberModalBtn").on('click', function () {
  11.         // reset the form 
  12.         $("#createMemberForm")[0].reset();
  13.         // remove the error 
  14.         $(".form-group").removeClass('has-error').removeClass('has-success');
  15.         $(".text-danger").remove();
  16.         // empty the message div
  17.         $(".messages").html("");
  18.  
  19.         // submit form
  20.         $("#createMemberForm").unbind('submit').bind('submit', function () {
  21.  
  22.             $(".text-danger").remove();
  23.  
  24.             var form = $(this);
  25.  
  26.             // validation
  27.             var name = $("#name").val();
  28.             var address = $("#address").val();
  29.             var contact = $("#contact").val();
  30.             var active = $("#active").val();
  31.  
  32.             if (name === "") {
  33.                 $("#name").closest('.form-group').addClass('has-error');
  34.                 $("#name").after('<p class="text-danger">The Name field is required</p>');
  35.             } else {
  36.                 $("#name").closest('.form-group').removeClass('has-error');
  37.                 $("#name").closest('.form-group').addClass('has-success');
  38.             }
  39.  
  40.             if (address === "") {
  41.                 $("#address").closest('.form-group').addClass('has-error');
  42.                 $("#address").after('<p class="text-danger">The Address field is required</p>');
  43.             } else {
  44.                 $("#address").closest('.form-group').removeClass('has-error');
  45.                 $("#address").closest('.form-group').addClass('has-success');
  46.             }
  47.  
  48.             if (contact === "") {
  49.                 $("#contact").closest('.form-group').addClass('has-error');
  50.                 $("#contact").after('<p class="text-danger">The Contact field is required</p>');
  51.             } else {
  52.                 $("#contact").closest('.form-group').removeClass('has-error');
  53.                 $("#contact").closest('.form-group').addClass('has-success');
  54.             }
  55.  
  56.             if (active === "") {
  57.                 $("#active").closest('.form-group').addClass('has-error');
  58.                 $("#active").after('<p class="text-danger">The Active field is required</p>');
  59.             } else {
  60.                 $("#active").closest('.form-group').removeClass('has-error');
  61.                 $("#active").closest('.form-group').addClass('has-success');
  62.             }
  63.  
  64.             if (name && address && contact && active) {
  65.                 //submi the form to server
  66.                 $.ajax({
  67.                     url: form.attr('action'),
  68.                     type: form.attr('method'),
  69.                     data: form.serialize(),
  70.                     dataType: 'json',
  71.                     success: function (response) {
  72.  
  73.                         // remove the error 
  74.                         $(".form-group").removeClass('has-error').removeClass('has-success');
  75.  
  76.                         if (response.success === true) {
  77.                             $(".messages").html('<div class="alert alert-success alert-dismissible" role="alert">' +
  78.                                     '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
  79.                                     '<strong> <span class="glyphicon glyphicon-ok-sign"></span> </strong>' + response.messages +
  80.                                     '</div>');
  81.  
  82.                             // reset the form
  83.                             $("#createMemberForm")[0].reset();
  84.  
  85.                             // reload the datatables
  86.                             manageMemberTable.ajax.reload(null, false);
  87.                             // this function is built in function of datatables;
  88.  
  89.                         } else {
  90.                             $(".messages").html('<div class="alert alert-warning alert-dismissible" role="alert">' +
  91.                                     '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
  92.                                     '<strong> <span class="glyphicon glyphicon-exclamation-sign"></span> </strong>' + response.messages +
  93.                                     '</div>');
  94.                         }  // /else
  95.                     } // success  
  96.                 }); // ajax subit               
  97.             } /// if
  98.  
  99.  
  100.             return false;
  101.         }); // /submit form for create member
  102.     }); // /add modal
  103.  
  104. });

y lo mismo con la otra funcion, pero le pones ?funcion=2

Por cierto, hay una cosa que siempre jode cuando actualizas archivos, y es el caché, te lo digo por experiencia, si no notas un cambio, borra el cache entero o prueba desde otro navegador, incluso puedes tirar del modo incognito, aunque este último no es muy fiable, porque a veces también almacena y tira del cache.

Consejo: Si lo que quieres es que se ejecute rápidamente (en milisegundos), en vez de definir todas las funciones antes de ser llamadas, te recomendaría que definieses todas las funciones dentro de los if correspondientes, es decir:
Código PHP:
 if(funcion == 1){function funcion_1(){...} funcion_1();} 
Aunque de la manera inicial que te he puesto, tampoco vas a tener problemas de rendimiento.

Un saludo.
Última edición por Thejuanjo; 20/08/2017 a las 16:57
  #3 (permalink)  
Antiguo 21/08/2017, 07:09
Avatar de xfxstudios  
Fecha de Ingreso: junio-2015
Ubicación: Valencia - Venezuela
Mensajes: 2.448
Antigüedad: 9 años, 7 meses
Puntos: 263
Respuesta: Ejecutar función php desde ajax - jquery
Yo usaria clases para organizar mejor el documento:

PHP:
Código PHP: 
Ver original
  1. namespace ClassName
  2.  
  3. class ClassName 
  4. {
  5.     //Variables con tados para tu conexion
  6.     private $user = "";
  7.     private $pass = "";
  8.     private $host = "";
  9.     private $base = "";
  10.     
  11.     function __construct()
  12.     {
  13.         //Conexion a BD
  14.         $db = new MySQLi($this->host, $this->user, $this->pass, $this->base);
  15.         if($db->connect_error) {
  16.             die('Error de conexion ('.$db->connect_errno.')'
  17.                 .$db->connect_errno);
  18.         };
  19.  
  20.         $this->con = $db;
  21.     }
  22.  
  23.     public function claseA($X){
  24.         $a = $this->con->query("SELECT * FROM tabla WHERE campo = '$X[0]'");
  25.         $t = mysqli_num_rows($a);
  26.         //bla bla bla
  27.     }
  28.  
  29.     public function claseB($X){
  30.         $a = $this->con->query("SELECT * FROM tabla WHERE campo = '$X[0]'");
  31.         $t = mysqli_num_rows($a);
  32.         //bla bla bla
  33.     }
  34.  
  35.     public function claseC($X){
  36.         $a = $this->con->query("SELECT * FROM tabla WHERE campo = '$X[0]'");
  37.         $t = mysqli_num_rows($a);
  38.         //bla bla bla
  39.     }
  40.  
  41. }//end class
  42.  
  43. $p = new ClassName();
  44.  
  45. switch ($_POST['tipo']) {
  46.     case 'claseA':
  47.             echo $p->claseA($_POST);//Le pasamos los valores del ajax a la funcion correspondiente
  48.     break;
  49.  
  50.     case 'claseB':
  51.             echo $p->claseB($_POST);//Le pasamos los valores del ajax a la funcion correspondiente
  52.     break;
  53.  
  54.     case 'claseC':
  55.             echo $p->claseC($_POST);//Le pasamos los valores del ajax a la funcion correspondiente
  56.     break;
  57.     
  58. }

JS:
Código Javascript: 
Ver original
  1. $.post('rutaaarchivo/accion.php',
  2.             {
  3.                 'tipo':'claseA',
  4.                 'valor1':'valo 1'
  5.                 'valor2':'valor 2'
  6.                 'valor3':'valor 3'
  7.             },
  8.             function(resp){
  9.                 console.log(resp);
  10.         })

lo digo por experiencia, he utilizado este metodo en muchos de mis trabajos con exito. Saludos
__________________
[email protected]
HITCEL

Etiquetas: ajax, html, jquery, sql, tabla, url
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 22:25.