Get form variables when submit and pass them to a php

Question

Get form variables when submit and pass them to a php

Navigation

#1 by (1 votes)

1

I would like to know how to get the input values of a form. I show the current values extracted from the database by means of an echo and the intention is to be able to change them.

The code (editproyectos.php) would be:

<table class='table table-bordered'>
    <input type='hidden' name='id' value='<?php echo $row['id']; ?>' />
    <tr>
        <td>Titulo</td>
        <td><input type='text' id="titulo" name='titulo' class='form-control' 
            value='<?php echo $tit_proyecto ?>' ></td>
    </tr>

    <tr>
        <td>Fecha</td>
        <td><input type='text' name='fecha' class='form-control' value='<?php echo $fech_proyecto; ?>' ></td>
    </tr>

    <tr>
        <td>Texto 1</td>
        <td><textarea class="form-control" name='text1' rows="2"><?php echo $texto1_proyecto; ?></textarea></td>
    </tr>

    <tr>
        <td>Texto 2</td>
        <td><textarea class="form-control" name='text1' rows="4"><?php echo $texto2_proyecto; ?></textarea></td>
    </tr>

    <tr>
        <td colspan="2">
        <button type="submit" class="btn btn-primary" name="btn-update" id="btn-update">
        <span class="glyphicon glyphicon-plus"></span> Guardar cambios
        </button>
        </td>
    </tr>

</table>

When I click on submit, I'm referred to the file crud2.js (the one below) but I can not get anything sent to "edit_proyectos_update.php".

$.post("editar_proyectos_update.php", $(this).serialize())
    .done(function(data){
        $("#dis").fadeOut();
        $("#dis").fadeIn('slow', function(){
             $("#dis").html('<div class="alert alert-info">'+data+'</div>');
             $("#emp-UpdateForm_Proyectos")[0].reset();
             $("body").fadeOut('slow', function()
             {
                $("body").fadeOut('slow');
                window.location.href="login-register/index.php";
             });                 
         });    
    });

mysql jquery html php

asked by Juan Luis Miras Moreno 06.07.2018 в 15:21

source

1 answer

How to make a purchase matrix in DQL or MYSQL PHP Ternary conditions

score 1 · Accepted Answer

If what you want to do is send your form asynchronously, then I recommend you do the following:

First, you must have the following script in the header of your page, where the form is. This is the one that will allow you to use ajax functions.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

In your JS File you must add the following. This will be responsible for applying the submit to your form

$(function(){
$("#emp-UpdateForm_Proyectos").on("submit", function(e){ //Ejecutas la acción submit de tu formulario
    e.preventDefault();
    var f = $(this);
    var formData = new FormData(document.getElementById("emp-UpdateForm_Proyectos")); //Mediante el formData llamarás a las variables del formulario (inputs)
    formData.append("dato", "valor");
    //formData.append(f.attr("name"), $(this)[0].files[0]);
    $.ajax({
        url: "editar_proyectos_update.php", //url destino
        type: "post", //tipo de envío, post/get
        dataType: "html",
        data: formData, //variables (inputs)
        cache: false,
        contentType: false,
        processData: false
    })
    .done(function(result){ //Aquí puedes imprimir algún mensaje de confirmación mediante algún echo.
        alert(result);
    });
});
});

In your PHP file that will receive the form data 'edit_proyects_update.php', you can call the variables using $ _POST ["variable_name"], just as you do when you send the form synchronously:

<?php
   if (isset($_POST["titulo"]) && isset($_POST["fecha"]) && isset($_POST["text1"])) { //Aquí validamos si existe la variable (yo solo coloqué tres parámetros de tu formulario).
      $titulo = $_POST["titulo"];
      $fecha = $_POST["fecha"];
      $text1 = $_POST["text1"]; 
   }
?>

NOTE: In your form you only need to have the 'id', you do not need to have the 'action' or the 'method'

form id='emp-UpdateForm_Proyectos'>
   ...
</form>