Java software development, background, we can through a variety of frameworks, such as SSH and other code encapsulation, to facilitate the writing of our Java code, for example, Struts, SpringMVC from the foreground to the action of the process of encapsulation control, so that we only need to carry out a number of simple configurations can be achieved; and Spring for a variety of object management encapsulation, provides a way of AOP programming, greatly facilitates us; and Hibernate and IBatis is the JDBC code is encapsulated, do not need us to write those repetitive and complicated JDBC code each time.
foreground it, for some effects on the page, verification, etc., we are through the JavaScript language to complete, but it is also like our Java code, is the most foreground language is the most basic, and JQuery is the js code is encapsulated to facilitate the preparation of our foreground code, and it also has a very big advantage is to solve the browser compatibility problem, which is also We use it is very important for one of the reasons.
And now to meet the needs of users, Ajax (Asynchronous Javascript + XML）Asynchronous refresh plays an unparalleled role in the previous writing Ajax operations, always require us to want to JDBC code like a few essential steps:
AJAX - Core XMLHttpRequest ObjectsAnd JQuery also encapsulates Ajax asynchronous operations, here's a look at a few common ways. $.ajax, $.post, $.get, $.getJSON.
a, $.ajax, this is the JQuery ajax package of the most basic step, through the use of this function can be completed asynchronous communication of all the functions. That is to say, in any case we can use this method for asynchronous refresh operation. But it has more parameters, sometimes it may be troublesome. Take a look at the common parameters:
var configObj = {
method // how the data is submitted: get and post
url //Data submission route
async //whether to support asynchronous refresh, the default is true
data //data to be submitted
dataType //The type of data returned by the server, e.g. xml, String, Json, etc.
success // callback function after successful request
error //callback function if the request fails
}
$.ajax(configObj);// Called via the $.ajax function.
Okay, let's look at a real-world example of doing an asynchronous delete:
// Delete
$.ajax({
type : "POST", // submission method
url : "${}/org/", // path
data : {
"" : "${}"
},//data, Json format is used here for transmission
success : function(result) {// Returns the data and processes it accordingly.
if ( ) {
$("#tipMsg").text("Deleting data successfully");
("${}", true);
} else {
$("#tipMsg").text("Deletion of data failed"); }
}
}
}).
Second, $.post, this function is actually $.ajax for further encapsulation, reducing the parameters, simplify the operation, but the use of the scope of the smaller. $.post simplifies the submission of data can only be submitted using the POST method. Can only be asynchronous access to the server, can not be synchronized access, can not be error handling. To meet these circumstances, we can use this function to facilitate our programming, its main parameters, such as method, async, etc. for the default settings, we can not change. Examples will not be introduced.
url:Address to send the request to.
data: Key/value parameters to be sent.
callback: the callback function in case of successful sending.
type: return content format, xml, html, script, json, text,_default.
Third, $.get, and $.post, this function is the get method to submit data encapsulation, can only be used in the get to submit data to solve the asynchronous refresh method, the use of the way and the above is also similar. Here is no longer demonstrated.
Four, $.getJSON, this is a further package, that is, the return data type for the operation of Json. Inside the three parameters, we need to set, very simple: url, [data], [callback].
In fact, will be $.ajax method, the other will be used, are the same, in fact, very simple.
But here is another problem, more trouble, that is, if the page data volume is relatively large, how to do it? In the regular form of processing, we use the framework Struts2 can be automatically obtained through the domain-driven model of encapsulation, then by ajax, how to encapsulate it? Here JQuery has a plugin, Jquery Form, through the introduction of this js file, we can imitate the form Form to support Struts2 domain-driven mode for automatic data encapsulation. Usage and $.ajax similar to look at the actual example, here to write a save the user's foreground code:
$(function(){
var options = {
beforeSubmit : function() {// Handles functions that needed to be done previously
$("tipMsg").text("Data is being saved, please wait...") ;
$("#insertBtn").attr("disabled", true) ;
}, success : function(result) {/result)
success : function(result) {// Returns the callback function needed after success
if ( ) {
$("#tipMsg").text("Organization saved successfully"); }, success : function(result) {// Returns the callback function needed after success.
// Here is the corresponding tree, which will be described later.
// Control the tree component, adding new nodes
var tree = ;
("${}", , ); ;
} else {
$("#tipMsg").text("Failed to save organization"); ;)
}
// Enable the save button
$("#insertBtn").attr("disabled", false); }, else { $("#tipMsg").text("Organization save failed"); }
}
clearForm : true
}; }
$('#orgForm').ajaxForm(options); //Submit via the ajaxForm method in the
});
So we do not have to data data package processing, greatly simplifying our ajax operation so asynchronous refresh operation. In summary for the operation of ajax in JQuery, I feel that the use of more, and form form processing is still very similar, only the realization of the function is not the same. Learning programming, in fact, is to learn the flow of data processing, how to get from the foreground, transferred to the server for the appropriate processing, and then return to the relevant display, the process through some technical realization, the completion of the software development, feel still very interesting.
More JQuery learning needs to be done by consulting the api documentation:/jq/