MTV and MVC model
django framework claim to be MTV framework
M: Models
T: Templates
V: views
MVC
M: Models
V: views
C: the Controller Controller (urls)
nature: MTV actually MVC
Ajax
asynchronous submit partial refresh
request methods GET POST
a tag href attribute GET request
browser window input URL GET request
form form GET / the POST
ajax GET / the POST
first ajax this technology is js in
but native js operation ajax cumbersome, here for efficiency
using jQuery packaged version directly ajax's
biggest advantage is AJAX without reloading the entire page, you can exchange data with the server and update parts of the page content.
(This feature is the feeling to the user request and response process is completed unknowingly
contentType front end of the transmission data encoding formats
before and after transfer of data encoding formats
1.urlencoded
2.formdata
3.json
form Form
encoding format is used by default urlencoded
data format: name = & pwd = 123 Jason
Django rear resolved automatically urlencoded encoding format for the data and for the user into the acquired request.POST
may be modified to pass formdata file
django backend for as long as is consistent with the data urlencoded encoding format (name = jason & pwd = 123 ) will automatically parse and put request.POST for users to get
if you specify a file as long as the code is automatically parsed and put formdata request.FILES in
summary: front and rear end of the transmission of data when you must ensure that your data formats and encoding format is the same family can not lie !!!
ajax submit data
1.ajax default data is presented in a way urlencoded
Front:
. $ ( '# B1') ON ( 'the Click', function () {
Alert (123)
// Click post toward the rear end transmission request
$ .ajax ({
URL: '', // transmitted to the control Who wrote It is submitted towards the current address
type: 'post', // transmission scheme is a post request
data: { 'i1': $ ( '# i1') val (), 'i2':.. $ ( '# i2') val ()}, // data transmission
success: function (data) {// data for receiving the result of the asynchronous parameter submitted
Alert (data)
// rear end result computed by the input to the third rendering operation DOM ore
$ ( '# I3'). Val (Data)
}
})
rear end:
index DEF (Request):
IF request.is_ajax (): # to verify that a request is sent ajax, if it is True, then the note is to true
Print (123)
IF request.method == "the POST":
Print (123)
request.POST.get = D1 ( "D1")
D2 = request.POST.get ( "D2")
RES = int (D1) + int (D2)
return the HttpResponse (RES) # ajax back to the callback data in
return render (request, "index.html")
2.ajax data transmission format json
django json rear end for the data format does not automatically resolved or put request.POST request.FILES which
it does not parse json format data intact but it on request. body in the
front end:
$ ( '# B1') ON ( 'the click', function () {.
Alert (123)
// click button to send request toward the rear end post
$ .ajax ({
URL: '', // control who do not write to a current address is submitted towards the
type: 'post', // transmission scheme is a post request
data: JSON.stringify ({ 'username' : 'jason', 'password': 123}), // transmitted data
contentType: 'application / json', // tell you the back-end data is json format
success:function (data) {// data parameter to receive asynchronous results submitted
Alert (Data)
// rear end result computed by the rendering operation to the third input DOM ore
$ ( '# I3') Val (Data).
}
})
{)
rear : def index (request):
request.method == IF "the POST":
Print (of request.POST)
Print (request.body) # acquired through the front end of the transmission format json dictionary binary
json_str = request.body.decode ( "utf8") # decoded binary
s = json .loads (json_str) # deserialization json string
print (s.get ( "username") ) # value
the HttpResponse return ( "OK")
return the render (Request, "index.html")
3.ajax transfer files
// ajax file transfer
front end:
$ ( '# D4') ON ( 'the Click', function () {.
var formData the FormData new new = (); // can pass either normal key-value pair may be a file transfer
formData.append ( 'username', 'jason ');
formData.append (' PSW ',' 123 ');
// 1. Find the first file is stored to use jQery input tag
// 2. jQery objects will be transferred into native objects js
@ 3 js objects using native . approach .files [0] storing the acquired file object tag inside
formData.append ( 'my_file', $ ( '# d5') [0] .files [0]); // get the file stored in the file label Object
$ .ajax ({
url: '', // put to control who does not write is the default current submission
of the type: 'POST',
the Data:formData, // transfer data is formData
// ajax to send the file you need to specify two additional parameters
processData: false, // do not tell the front processing data
contentType: false, // do not use any encoding, FormData their own coding, rear Django can automatically identify
success: function (data) {// callback function, the data transmission returns data to the back end for receiving a result of the asynchronous parameter submitted
Alert (data);
. $ ( '# D3') Val (data)
}
})
rear end:
# Ajax transfer files to the backend IF request.method == " POST " : Print (request.FILES) # get a dictionary file with Open ( " Today's content " , " wb " ) AS f: # write to file for Line in request.FILES.get ( " my_file " ): f.write (Line) Print (request.POST) # get the normal data delivery Print (request.POST.get ( " username" )) # Get normal data conveyed return the HttpResponse ( " OK " ) return the render (Request, " index.html " )