Soumettre un formulaire sans rafraîchir la page avec jQuery et Ajax Ne met pas à jour la base de données MySQL

Question

Je suis un débutant en JQuery et j'ai un problème, lorsque je clique sur le bouton de soumission du formulaire, tout affiche que l'inscription a été réussie mais ma base de données MYSQL n'a pas été mise à jour, tout fonctionnait bien jusqu'à ce que j'essaie d'ajouter le JQuery à l'image.

Quelqu'un peut-il m'aider à résoudre ce problème pour que ma base de données soit mise à jour ?

Merci

Voici le code JQuery.

$(function() {

$(".save-button").click(function() {
    var address = $("#address").val();
    var address_two = $("#address_two").val();
    var city_town = $("#city_town").val();
    var state_province = $("#state_province").val();
    var zipcode = $("#zipcode").val();
    var country = $("#country").val();
    var email = $("#email").val();

    var dataString = 'address='+ address + '&address_two=' + address_two + '&city_town=' + city_town + '&state_province=' + state_province + '&zipcode=' + zipcode + '&country=' + country + '$email=' + email;

    if(address=='' || address_two=='' || city_town=='' || state_province=='' || zipcode=='' || country=='' || email=='') {
        $('.success').fadeOut(200).hide();
        $('.error').fadeOut(200).show();
    }

    else
    {
    $.ajax({
    type: "POST",
    url: "http://localhost/New%20Project/home/index.php",
    data: dataString,
    success: function(){
    $('.success').fadeIn(200).show();
    $('.error').fadeOut(200).hide();

   }
});
    }

    return false;

    });
});

Voici le code PHP.

if (isset($_POST['contact_info_submitted'])) { // Gérer le formulaire.

    // Interroger les données des membres depuis la base de données et les préparer pour l'affichage
    $mysqli = mysqli_connect("localhost", "root", "", "sitename");
    $dbc = mysqli_query($mysqli,"SELECT users.*, contact_info.*
                                 FROM users 
                                 INNER JOIN contact_info ON contact_info.user_id = users.user_id 
                                 WHERE users.user_id=3");

    $user_id = mysqli_real_escape_string($mysqli, htmlentities('3'));
    $address = mysqli_real_escape_string($mysqli, htmlentities($_POST['address']));
    $address_two = mysqli_real_escape_string($mysqli, htmlentities($_POST['address_two']));
    $city_town = mysqli_real_escape_string($mysqli, htmlentities($_POST['city_town']));
    $state_province = mysqli_real_escape_string($mysqli, htmlentities($_POST['state_province']));
    $zipcode = mysqli_real_escape_string($mysqli, htmlentities($_POST['zipcode']));
    $country = mysqli_real_escape_string($mysqli, htmlentities($_POST['country']));
    $email = mysqli_real_escape_string($mysqli, strip_tags($_POST['email']));

//Si la table n'est pas trouvée, l'ajouter à la base de données
if (mysqli_num_rows($dbc) == 0) {
        $mysqli = mysqli_connect("localhost", "root", "", "sitename");
        $dbc = mysqli_query($mysqli,"INSERT INTO contact_info (user_id, address, address_two, city_town, state_province, zipcode, country, email) 
                                     VALUES ('$user_id', '$address', '$address_two', '$city_town', '$state_province', '$zipcode', '$country', '$email')");
}

//Si la table est dans la base de données, mettre à jour chaque champ au besoin
if ($dbc == TRUE) {
        $dbc = mysqli_query($mysqli,"UPDATE contact_info 
                                     SET address = '$address', address_two = '$address_two', city_town = '$city_town', state_province = '$state_province', zipcode = '$zipcode', country = '$country', email = '$email' 
                                     WHERE user_id = '$user_id'");
}

if (!$dbc) {
        // Il y a eu une erreur...faire quelque chose à ce sujet ici...
        print mysqli_error($mysqli);
        return;
}

}

Voici le code XHTML.

            Adresse 1 : 
            Adresse 2 : 
            Ville : 
            État/Province : 
            ' . "\n";
              foreach($state_options as $option) {
                if ($option == $state_province) {
                  echo '' . $option . '' . "\n";
                } else {
                  echo '' . $option . ''."\n";
                }
              }
            echo '';

            ?>

            Code Postal : 

            Pays : 
            ' . "\n";
              foreach($countries as $option) {
                if ($option == $country) {
                  echo '' . $option . '' . "\n";
                } 
                else if($option == "-------------") {
                  echo '' . $option . '';
                }
                else {
                  echo '' . $option . ''."\n";
                }
              }
            echo '';

            ?>

            Adresse Email : Nous ne spammons pas et ne partageons pas votre adresse e-mail avec des tiers. Nous respectons votre vie privée.

Answer 1

Vous devriez peut-être réfléchir à refactorer votre code? Je peux nettoyer le bloc else du code, voici votre code

else
{
   $.load(
          "http://localhost/New%20Project/home/index.php",dataString,
           function()
           { 
             $('.success').fadeIn(200).show();
             $('.error').fadeOut(200).hide();
           }
         );
}

Answer 2

Placez tout votre jQuery à l'intérieur de

$(document).ready(function(){ //tout se trouve ici });

Placez un id sur le formulaire. Par exemple id="monformulaire".

Utilisez un plugin pour la validation du formulaire. Pour utiliser le plugin, ajoutez la classe "required" dans la balise input de tous les champs obligatoires.

La documentation pour le plugin de validation se trouve ici afin que vous puissiez voir quelles options correspondent à vos besoins. Mais il semble que vous voudrez définir le gestionnaire de soumission pour soumettre le formulaire via AJAX.

$("#monformulaire").validate({
   submitHandler: function(form) {
    $(form).ajaxSubmit();
   }
})

Cela devrait en principe résoudre vos problèmes jQuery, s'il fonctionne pour une soumission normale il n'y a pas de problème avec votre code côté serveur.

Answer 3

$dbc = mysqli_query($mysqli,"SELECT users.*, contact_info.*
                             FROM users 
                             INNER JOIN contact_info ON contact_info.user_id = users.user_id 
                             WHERE users.user_id=3");

if ($dbc == TRUE) {
        $dbc = mysqli_query($mysqli,"UPDATE contact_info 
                                     SET address = '$address', address_two = '$address_two', city_town = '$city_town', state_province = '$state_province', zipcode = '$zipcode', country = '$country', email = '$email' 
                                     WHERE user_id = '$user_id'");
}

Une requête mysql(i) ne retournera jamais true, elle ne renverra qu'une ressource en cas de succès ou FALSE en cas d'échec.

Cela pourrait être plus proche de ce que vous essayez de faire

if ($dbc !== FALSE) {
  // faire la requête de mise à jour

Answer 4

Plutôt que $.load essayez $.get car load est destiné à être utilisé dans un contexte comme $('#result_of_query).load(...) où le résultat serait chargé dans '#result_of_query', je suppose que cela ressemble à un rechargement à cause de cela.

donc peut-être devriez-vous essayer ceci :

else
{
   $.get(
          "http://localhost/New%20Project/home/index.php",dataString,
           function()
           { 
             $('.success').fadeIn(200).show();
             $('.error').fadeOut(200).hide();
           }
         );
}