CODEWITHSUNDEEP
javascriptphpjquerymysqlajax
Michael Falciglia
Michael Falciglia

Reputation: 1046

Displaying AJax response with Jquery in a div

I have an ajax form that posts to a php page, which processes the form, then posts the data to mysql and then returns the data to the console.

Since I am really new at this, I don't know how to get it to display the data on the page in a <li> or <div for each new record that is returned, just like this script does: http://www.sanwebe.com/assets/ajax-add-delete-record/

This is the data that is returned in the console:

Object {type: "success", message: "Your message has been sent, thank you.", record: Object}
message: "Your message has been sent, thank you."
record: Object
account_number: "1234567812345678"
balance: "1234"
bank_name: "test name"
customer_id: "12345"
id: 49
monthly: "123456"

This is the current script that brings it to the console:

jQuery(document).ready(function($) {
  $('form.quform').Quform({
    successStart: function (response) {
      console.log(response);  
    }
  }
);

Upvotes: 1

Views: 488

Answers (1)

Barmar
Barmar

Reputation: 780723

Something like this:

jQuery(document).ready(function($) {
    $('form.quform').Quform({
        successStart: function (response) {
            var r = response.record;
            var html = '<li>Acct#: ' + r.account_number + '</li><li>Balance: ' + r.balance + '</li><li>Bank: ' + r.bank_name + '</li><li>Customer#: ' + r.customer_id + '</li>';
            $("#ulID").html(html);
        }
    });
});

Upvotes: 3

Related Questions