Insert Data by HTML(jQuery)

Do the example "Insert Data into Simple One Table" and create Database and Endpoint beforehand.

In this example, application will be created to this Endpoint from HTML(jQuery).

Specifically, data can be added into Database by using form as follows:

Source

Item Code: <input id="ItemCodeFormInput" type="text">
Item Name: <input id="ItemNameFormInput" type="text">
Item Description: <textarea id="ItemDescriptionFormInput"></textarea>
<input id="ADD" type="button" value="Add">

Execute following script to this form.

<script>
$(function() {
$("#ADD").click(function() { <Define jQuery's click event>
jQuery.ajax( <From here, copy from Template>
"https://dbaassandbox.matsuesoft.co.jp/??????/proxyserver-ItemInfo-InsertSample2.php",{
type: "POST",
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({
"TOKEN": "??????",
"param_ItemInfo_ItemCode_insert": $("#ItemCodeFormInput").val(), ← Get Value from Form Input
"param_ItemInfo_ItemName_insert": $("#ItemNameFormInput").val(), Get Value from Form Input
"param_ItemInfo_ItemDescription_insert": $("#ItemDescriptionFormInput").val() ← Get Value from Form Input
}),
success: function(json_result){
if (json_result._status == "OK") {
// Success
alert("Success");
} else {
// Failed
alert("Failed");
}
},
error : function() {
// Internal Error
alert("Internal Error");
},
complete: function() {
}
}
); <Until here, copy from Template>
});
});
</script>

Most of the sending script is as same as template written in Endpoint page. Parameter is read from From Value.
Click "Add" button after input value into form, then data will be inserted into Database.

As you can see, only need is Client side only to write code. Only setting on Cloud is required on Server side.

By doing this, you can dramatically decrease the work effort to develop application.

Back to top

LoginLogin with this Site's User Name (ID)
Quick Login:Quick Login by Facebook ID (Keep Login Option:ON) / Newly Register


Inquiry

© 2016-2024 Matsuesoft Corporation