Python 使用axios进行Django表单集验证
更新2： 我已经放弃了axios，我相信有一种方法，现在我正在使用ajax，并从 观点：Python 使用axios进行Django表单集验证,python,jquery,ajax,django,axios,Python,Jquery,Ajax,Django,Axios,更新2： 我已经放弃了axios，我相信有一种方法，现在我正在使用ajax，并从 观点： def error_checking(request): print('in error checking') if request.POST: form = RiderProfileFormSet(request.POST) print('made it') if form.is_valid(): print('NOT
def error_checking(request):
print('in error checking')
if request.POST:
form = RiderProfileFormSet(request.POST)
print('made it')
if form.is_valid():
print('NOT')
return JsonResponse({'success': True})
else:
print('YES')
return JsonResponse({'error': form.errors})
reveal_pay: function (request) {
let app = this
console.log('called the reveal_pay')
axios.post("{% url 'error_checking' %}",
{
headers:
{
'X-CSRFToken': '{{ csrf_token }}',
}
}
)
.then(function (response) {
app.formIsValid = response.data.errors
})},
def error_checking(request):
print('in error checking')
print(request.POST.get)
formset_post = RiderProfileFormSet(request.POST)
# formset_post = json.loads(request.body)['form_to_validate']
print(formset_post)
if formset_post.is_valid():
print('the formset is valid')
print('passing to event_register')
event_register(request)
else:
print('formset not valid')
print(formset_post.errors)
errors = formset_post.errors
args = {'errors': errors}
return JsonResponse(args)
<form id='reg_form' class="form-horizontal" method="POST">
{% csrf_token %}
{{ formset.management_form }}
<div style="background-color: black; padding: 20px 60px 20px 60px; margin-right: 15px;"
class="row form-row">
<div class="input-group">
<div v-for="form in formList">
<br>
<div style="background-color: #ffe673; padding: 20px" v-html="form">
</div>
</div>
<div style="padding-left: 60px; background-color: black">
<p v-on:click="addForm" class="btn btn-primary btn-lg">Add Form</p>
<p v-on:click="formID" class="btn btn-primary btn-lg">Delete Form</p>
<p v-on:click="totalCost" class="btn btn-primary btn-lg">Total Cost</p>
</div>
<br>
<br>
</div>
</div>
<div style="margin: 0px 15px 100px -15px; padding: 0px 0px 60px 60px; background-color: black">
{#<button id="form_submit_button" style="" type="submit" class="btn btn-primary btn-lg">Finish Registration</button>#}
<div id="form_submit_button" v-on:click="reveal_pay"class="btn btn-primary btn-lg">AXIOS Finish Registration</div>
<div class="btn btn-primary btn-lg">
<paypal-checkout
:amount='amountStr'
currency="USD"
:button-style="aStyle"
:client="paypal"
env="sandbox"
v-on:payment-authorized="paymentAuthorized"
v-on:payment-completed="paymentCompleted"
v-on:payment-cancelled="paymentCancelled">
</paypal-checkout>
</div>
</div>
</form>
{%csrf_令牌%}
{{formset.management_form}
点击添加表单
点击删除表格
总成本
{完成注册}
AXIOS完成注册
-谢谢 长话短说。Django获取一个JSON对象，然后将其传递给
# request_data = json.load(request) # The form as a dict {'form_to_validate': '<form id="reg_form" method.....}
#Error: ValidationError: ['ManagementForm data is missing or has been tampered with']
# request_data = RiderProfileFormSet(request.POST)
#Error: ValidationError: ['ManagementForm data is missing or has been tampered with']
formset_post = RiderProfileFormSet(request_data)
if formset_post.is_valid():
print('the formset is valid')
reveal_pay: function (request) {
let app = this
console.log('called the reveal_pay')
axios.post("{% url 'error_checking' %}",
{
headers:
{
'X-CSRFToken': '{{ csrf_token }}',
}
}
)
.then(function (response) {
app.formIsValid = response.data.errors
})},
def error_checking(request):
print('in error checking')
print(request.POST.get)
formset_post = RiderProfileFormSet(request.POST)
# formset_post = json.loads(request.body)['form_to_validate']
print(formset_post)
if formset_post.is_valid():
print('the formset is valid')
print('passing to event_register')
event_register(request)
else:
print('formset not valid')
print(formset_post.errors)
errors = formset_post.errors
args = {'errors': errors}
return JsonResponse(args)
<form id='reg_form' class="form-horizontal" method="POST">
{% csrf_token %}
{{ formset.management_form }}
<div style="background-color: black; padding: 20px 60px 20px 60px; margin-right: 15px;"
class="row form-row">
<div class="input-group">
<div v-for="form in formList">
<br>
<div style="background-color: #ffe673; padding: 20px" v-html="form">
</div>
</div>
<div style="padding-left: 60px; background-color: black">
<p v-on:click="addForm" class="btn btn-primary btn-lg">Add Form</p>
<p v-on:click="formID" class="btn btn-primary btn-lg">Delete Form</p>
<p v-on:click="totalCost" class="btn btn-primary btn-lg">Total Cost</p>
</div>
<br>
<br>
</div>
</div>
<div style="margin: 0px 15px 100px -15px; padding: 0px 0px 60px 60px; background-color: black">
{#<button id="form_submit_button" style="" type="submit" class="btn btn-primary btn-lg">Finish Registration</button>#}
<div id="form_submit_button" v-on:click="reveal_pay"class="btn btn-primary btn-lg">AXIOS Finish Registration</div>
<div class="btn btn-primary btn-lg">
<paypal-checkout
:amount='amountStr'
currency="USD"
:button-style="aStyle"
:client="paypal"
env="sandbox"
v-on:payment-authorized="paymentAuthorized"
v-on:payment-completed="paymentCompleted"
v-on:payment-cancelled="paymentCancelled">
</paypal-checkout>
</div>
</div>
</form>
<form v-on:submit.prevent="the3DayMethod" method="POST" id="feedbackform">
{% csrf_token %}
{{ formset.management_form }}
<div style="background-color: black; padding: 20px 60px 20px 60px; margin-right: 15px;"
class="row form-row">
<div class="input-group">
<div v-for="form in formList">
<br>
<div style="background-color: #ffe673; padding: 20px" v-html="form">
</div>
</div>
<div style="padding-left: 60px; background-color: black">
<p v-on:click="addForm" class="btn btn-primary btn-lg">Add Form</p>
<p v-on:click="formID" class="btn btn-primary btn-lg">Delete Form</p>
</div>
<br>
</div>
</div>
<div style="margin: 0px 15px 100px -15px; padding: 0px 0px 60px 60px; background-color: black">
<div v-show="formIsValid === 'False'">
<input v-on:click="the3DayMethod" class="btn btn-primary" value=" Check for Errors">
</div>
<div v-show="formIsValid === 'True'" class="btn btn-primary btn-lg">
<paypal-checkout
:amount='amountStr'
currency="USD"
:button-style="aStyle"
:client="paypal"
env="sandbox"
v-on:payment-authorized="paymentAuthorized"
v-on:payment-completed="paymentCompleted"
v-on:payment-cancelled="paymentCancelled">
</paypal-checkout>
</div>
</div>
</form>
the3DayMethod: function () {
let app = this
var object = {}
forms = document.getElementById('feedbackform')
var formData = new FormData(forms),
result = {};
for (var entry of formData.entries()) {
result[entry[0]] = entry[1];
}
data = JSON.stringify(result)
console.log(result);
console.log('called the the3DayMethod')
axios.post("{% url 'error_checking' %}",
data,
{
headers:
{
'X-CSRFToken': '{{ csrf_token }}',
}
}
)
.then(function (response) {
app.formIsValid = response.data.errors
})
},
def error_checking(request):
forms = json.load(request)
formset = RiderProfileFormSet(forms)
if formset.is_valid():
print('VALID')
v = {'success': "True"}
return JsonResponse(v)
else:
print('NOT VALID')
v = {'error': formset.errors}
return JsonResponse(v)