@manhnguyenv

Welcome to my blog!

Post JSON data using jQuery

July 17, 2018 13:33

Post JSON Data Using jQuery (edit)

Learning jQuery

https://www.learningjquery.com

An Introduction to jQuery

https://www.digitalocean.com/community/tutorials/an-introduction-to-jquery

15 Powerful jQuery Tips and Tricks for Developers

https://tutorialzine.com/2011/06/15-powerful-jquery-tips-and-tricks-for-developers

Google Hosted Libraries - jQuery

https://developers.google.com/speed/libraries/#jquery

jQuery HTML Table with .closest() method

https://www.learningjquery.com/2017/09/get-html-table-cell-value-using-jquery

20 Impressive jQuery Plugins to Replace the HTML Select Box

https://www.learningjquery.com/2017/09/20-impressive-jquery-plugins-to-replace-the-html-select-box

Posting JSON Data To The Server Using jQuery

<!DOCTYPE html>
<html>
<head>
	<title>Posting JSON Data To The Server Using jQuery</title>
<!-- <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> </head> <body> <h1> Posting JSON Data To The Server Using jQuery </h1> <div id="response"> <!-- To be populated dynamically. --> </div> <script type="text/javascript"> // Define the data packet that we are going to post to the // server. This will be "stringified" as a JSON value. var postData = { name: "Joanna", hair: "Brunette", age: 35, favoriteMovies: [ "Terminator 2", "The Notebook", "Teenwolf" ] }; // Post the data to the server as the HTTP Request Body. // To do this, we have to stringify the postData value // and pass it in a string value (so that jQuery won't try // to process it as a query string). var ajaxResponse = $.ajax({ type: "post", url: "./api.cfm", contentType: "application/json", data: JSON.stringify( postData ) }) // When the response comes back, output the HTML. ajaxResponse.then( function( apiResponse ){ // Dump HTML to page for debugging. $( "#response" ).html( apiResponse ); } ); </script> </body> </html>

Categories