web-dev-qa-db-fra.com

jquery utilisant ajax pour envoyer des données et enregistrer en php

Bonjour, j'essaie d'envoyer ou d'obtenir des données à partir d'un formulaire, puis d'utiliser jquery puis ajax pour envoyer les données dans une page php qui devrait les enregistrer dans la base de données comment puis-je le faire dans jquery et utiliser ajax pour le faire, tout l'aide fera l'affaire et merci!

Page HTML 1 qui utilisera jquery ajax pour envoyer des données dans la page php

 <form>
       Name:<input type='text' name='name'>
       E-mail:<input type='text' name='email'>
       Gender:<select name='gender'>
       <option value='male'>male</option>
       <option value='female'>female</option>
       </select>
       Message:<textarea name='about'></textarea>
 </form>

PHP page 2 qui recevrait les données du formulaire page 1

<?php
echo "
 $_POST['name'];
 $_POST['email'];
 $_POST['gender'];
 $_POST['about'];
";  
?>

toute aide avec ce projet nous aiderait grandement et merci!

(mise à jour) C'est le jquery que j'ai essayé d'utiliser mais il est allé à l'url et je pense que ce n'est pas très sûr

    $(document).ready(function(){
    $("#chat").click(function(){
        $("#content").load("a.php");
    });


    $("#send").ajaxSubmit({url: 'a2.php', type: 'post'})

    });
phpjqueryhtmlajax
13
user1868185

vous pouvez utiliser le code suivant:

var form = new FormData($('#form_step4')[0]);
form.append('view_type','addtemplate');
$.ajax({
    type: "POST",
    url: "savedata.php",
    data: form,
    cache: false,
    contentType: false,
    processData: false,
    success:  function(data){
        //alert("---"+data);
        alert("Settings has been updated successfully.");
        window.location.reload(true);
    }
});

où savedata.php est le nom du fichier dans lequel vous pouvez faire les choses DB

16
Sunil Verma

Essaye celui-là:

 <form id="formId">
           Name:<input type='text' name='name'>
           E-mail:<input type='text' name='email'>
           Gender:<select name='gender'>
           <option value='male'>male</option>
           <option value='female'>female</option>
           </select>
           Message:<textarea name='about'></textarea>
           <input type="button" value="Send" onclick="save()"/>
     </form>

 <script type="javascript">

    function save(){
        var query = $('#formId').serialize();
        var url = 'savedata.php';
        $.post(url, query, function (response) {
         alert (response);
        });

    }
</script>

attribuer l'ID à votre formulaire ... pour l'instant dans mon code, j'ai donné l'ID formId .. vous pouvez changer celui-ci selon le nom de votre formulaire.

6
ratnesh dwivedi

Salut, je commencerais par ajouter un identifiant au formulaire. et puis soit aller avec un onclick sur l'élément bouton, ou simplement définir un gestionnaire d'événements de clic pour le bouton.

<form id="my_form">
       Name:<input type='text' name='name'>
       E-mail:<input type='text' name='email'>
       Gender:<select name='gender'>
       <option value='male'>male</option>
       <option value='female'>female</option>
       </select>
       Message:<textarea name='about'></textarea>
       <input type="button" value="Send" onclick="sendForm()"/>
 </form>

Ensuite, la partie jquery/ajax/js.

 function sendForm(){
    $.ajax({
    type: "POST",
    url: "PAGE2.php",
    data: jQuery("#my_form").serialize(),
    cache: false,
    success:  function(data){
       /* alert(data); if json obj. alert(JSON.stringify(data));*/
    }
  });

}
6
Karlton