Insert Data Into MySQL Database using jQuery + AJAX + PHP




http://technotip.com/2208/insert-data-into-mysql-jquery-ajax-php/ Insert Data Into Database Without Refreshing Webpage.. Video tutorial illustrates insertion of …

Original source


35 responses to “Insert Data Into MySQL Database using jQuery + AJAX + PHP”

  1. $(document).ready(function(){
    $("#submit").click(function(e){
    var name = $("#name1").val();
    var np = $("#people1").val();
    var dt= $("#timenddate1").val();
    var msg = $("#msg1").val();

    if(name ==''|| np=='' || dt=='' || msg==''){
    alert("Some fields are blank");
    }
    else{

    // Returns successful data submission message when the entered information is stored in database.
    $.post("info.php",{
    name:name,
    Nopeople: np,
    DandT: dt,
    message: msg
    },
    function(data) {
    alert(data);
    $('#form2')[0].reset(); //To reset form fields after submission

    });

    e.preventDefault();
    }

    });

    });
    this code is working …but in the database empty values

  2. Fatal error: Uncaught Error: Call to undefined function mysql_connect() in C:xampphtdocssimpledb.php:2 Stack trace: #0 C:xampphtdocssimpleuserInfo.php(2): include_once() #1 {main} thrown in C:xampphtdocssimpledb.php on line 2

  3. thanks man, this helped a lot.
    hint for today (january 2018): output complains about: mysql_query is deprecated.
    I made some changes and it worked for me.
    the connection to db:
    $conn = new mysqli('localhost', 'root', 'your_pw', 'your_database');

    and the insert query:
    $conn->query("INSERT INTO table_name VALUES('whatever', 'values', 'you', 'got')");

  4. Don't know if anyone else will see this, seeing as this is the highest viewed content for the search terms "database" and "ajax". Decided to provide how I finally got this to work. I used XAMPP server and got this to work on Chome 61. This post helped me alot, https://stackoverflow.com/questions/16323360/submitting-html-form-using-jquery-ajax

    [***index.html***]
    <html>
    <head>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script&gt;
    </head>
    <body>
    <form id="myForm" action="userInfo.php" method="post">
    <div>
    <label class="title">Name: </label>
    <input type="text" id="name" name="name" >
    </div>
    <div>
    <label class="title">Age: </label>
    <input type="text" id="age" name="age" >
    </div>
    <div>
    <input type="submit" id="sub" name="submitButton" value="Submit">
    </div>
    </form>

    <span id="result"></span>

    <script type='text/javascript'>
    /* attach a submit handler to the form */
    $("#myForm").submit(function(event) {

    /* stop form from submitting normally */
    event.preventDefault();

    /* get the action attribute from the <form action=""> element */
    var $form = $( this ),
    url = $form.attr( 'action' );

    /* Send the data using post with element id name and name2*/
    var posting = $.post( url, { name: $('#name').val(), age: $('#age').val() } );

    /* Alerts the results */
    posting.done(function( data ) {
    $("#result").html(data);
    });
    });
    </script>

    </body>
    </html>

    [***db.php***]
    <?php
    define('HOST','localhost');
    define('USERNAME', 'test');
    define('PASSWORD','test');
    define('DB','test');

    $con = mysqli_connect(HOST,USERNAME,PASSWORD,DB);
    ?>

    [***userInfo.php***]
    <?php
    include_once('db.php');

    $name = $_POST['name'];
    $age = $_POST['age'];

    $sql = "INSERT INTO user (FirstName, Age) VALUES ('".$name."', '".$age."')";

    if(mysqli_query($con, $sql))
    {
    echo "Record Saved";
    }
    else
    {
    echo "Error: ".mysqli_error($con);
    }
    mysqli_close($con);
    ?>

  5. Hi Satish Sir,
    I have created a dynamic table by using JQuery and HTML now I want to fetch the data from each row of dynamic table but the dynamic table is created all row with the same name so How to fetch the value in php file?

Leave a Reply