user3043636 user3043636 - 6 days ago 6
HTML Question

Form Data to mysql using Javascript and PHP

I have a form with several different information about an user:

<form action="" method="post">
<input type="text" id="input-name" placeholder="Name" name="nameD">
<input type="text" id="input-surname" placeholder="Surname" name="surname">
<input type="text" id="input-name" placeholder="City" name="city">
<input type="text" id="input-name" placeholder="Address" name="address">
<input type="text" id="input-name" placeholder="Zip Code" name="zipcode">
<input type="text" id="input-name" placeholder="State" name="stateR">
<input type="text" id="input-name" placeholder="VAT" name="vat">
<input type="text" id="input-name" placeholder="Fiscal Code" name="fiscalcode">
<input type="email" id="input-email" placeholder="Email address" name="email">
<input type="text" id="input-name" placeholder="Bank Account" name="bankaccount">
<input type="text" id="input-name" placeholder="Bank Name" name="bankname">
<input type="text" id="input-name" placeholder="Phone" name="phone">
<input type="submit" class="btn btn-primary" onclick="doCreate_User()" value="Create">


and by clicking on the create button I call a Javascript function "doCreate_User()".

function doCreate_User(){
//Actually empty
}


Now, I have a PHP function:

function create_user($name,$surname,...ect){
//here using INsert into TableX() Values();
}


used to insert within a mysql table the variables taken in input from the form.

Which could be a suitable Javascript function able to pass all data from the form (in HTML, given the event triggered by the onclick) to PHP function create_user?

Thanks in advance

Answer

Please follow the following steps to get it working:

  1. Create a new page and name it user.php (or whatever you want)
  2. Paste the following code on the user.php page

     <?php
    
       function getInputValue($inputName){
    
        if(isset($_POST[$inputName])){
            return $_POST[$inputName];
        }
    
        return null;
      }
    
    $name = getInputValue("nameD");
    $surname  = getInputValue("surname");
    $city  = getInputValue("city");
    .
    .
    .
    $phone = getInputValue("phone");
    
    function createUser($name,$surname,...){
     //insert your values into the mysql table
    }
    
    
    ?>
    
  3. Inside your create_user function, add the following code

     function create_user() {
       var userData = $('userForm').serialize();
    
    var request = {
      "method" : "POST",
      "url" : "user.php",
      "data" : userData,
     };
    
     $.ajax(request)
      .success(handleSuccess);
     }
    
    
     function handleSuccess(response){
        console.log("success");
      }
    
    
     </script>
    
Comments