Performing the HTML (containing bootstrap framework), java foundation, Oracle database, java senior, programmed learning JavaScript (JQuery framework included) and Javaweb project, the author (beginner) decided to re-think some of the difficulties and the process of perception were summary for self-reflection and progress, but also those interested are welcome to do the exchange.
(Limited level, lack of respect and understanding!)
JSP dynamic web page, ajax very wide range of applications! But it can also bring a lot of trouble for beginners (personal feeling).
I first contact ajax, is dynamic prompt registration logon process by ajax, such as prompt "the user name already exists!" Registration and the like; may be applied json implement the existing value returned modal block to be edits and so on; of course, include comments in the video player interface, web pages only partially updated, etc. these common and useful features.
In simple terms, ajax achieved through asynchronous function, exists between web pages and databases, also through a limited amount of data exchange can be realized with the library to update part of the page, without interrupting or affecting the global web application. Convenient, high efficiency, eliminate a lot of waste; but also because of breaking the original page mode of operation, there are certain risks in terms of data security.
ajax json normal transmission data is a lightweight form --json mainstream data exchange format, easy people, machine reading and writing, but also to "key" - "value" stored in the form data, such as:
{"checkBook"："editBook"}。
ajax indeed covered a wide range, but by no means extensive but not to! In the case of using ajax using jQuery, the code is very refined! Simply positioning the desired url, data transmission (get / post), a small amount of data to be transferred, the format of return data (json / String), and the function can be success or failure. Such as:
//编辑图书
$('button[name="editBk"]').click(function () {
var editNum = $(this).val();
$.ajax({
url: 'CheckBkServlet',
type: 'get',
data: {
editNum: editNum
},
dataType: 'json',
success: function (data) {
var myJson = JSON.stringify(data);
$('#editBkNum').val(data[0].bsNum);
$('#editBkNam').val(data[0].bsNam);
$('#editAut').val(data[0].bsAut);
$('#editPub').val(data[0].bsPub);
$('#editBkDat').val(data[0].bsDat);
$('#editAmt '). val (data [0] .bsAmt);
$('#editPri').val(data[0].bsPri);
$('#editBkModal').modal('show');
},
error: function (xhr, textStstus) {
console.log("错误");
}
});
});
In the corresponding servlet, using the combined output stream, part of the code as follows:
String num = request.getParameter("editNum");
int editNum = 0;
if (num != null) {
editNum = Integer.parseInt(num);
}
TsBizInter tb = new TsBizImpl();
Books editBk = tb.checkBk(editNum);
ArrayList<Books> booksArrayList = new ArrayList<>();
booksArrayList.add(editBk);
JSONArray jsonArray = new JSONArray();
jsonArray = jsonArray.fromObject(booksArrayList);
PrintWriter printWriter = response.getWriter();
printWriter.print(jsonArray);
printWriter.flush();
printWriter.close();
In the final display mode out of the box to the following figure:
