您好我有以下模板,我想发送一个POST请求来激活ajax以保存多个复选框的选择。当我查看控制台时,它会在用户按下按钮时显示GET请求,为什么会这样?
<form action="">
<div class = "container">
<div class="jumbotron">
<div class="container">
<h1 class="jumbotron-heading">Available Application List</h1></br>
</div>
<div class="container">
<div class="row">
<div class="col">
<h3>Financial</h3>
<ul>
{% for app in fingrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class="col">
<h3>Care Assure</h3>
<div class = "row">
<ul>
{% for app in cagrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class = "row">
<h3>Performance Improvement</h3>
<ul>
{% for app in pigrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class = "row">
<h3>Supply Chain</h3>
<ul>
{% for app in scgrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class = "row">
<h3>DSS Monitoring</h3>
<ul>
{% for app in dssgrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class = "row">
<h3>Other DSS Applications</h3>
<ul>
{% for app in othgrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
</div>
<div class="col">
<div class="row">
<h3>Behavior Health / Rehab</h3>
<ul>
{% for app in bhgrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class="row">
<h3>Clinical Excellence</h3>
<ul>
{% for app in cegrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class="row">
<h3>Perfomance Service Group</h3>
<ul>
{% for app in psggrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
<div class="row">
<h3>All Applications</h3>
<ul>
{% for app in allgrouplist %}
<li><input type="checkbox" name="request_reports" value ="{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
</div>
</div>
</div class="row">
</br></br>
<a href="{% url 'requestaccess' %}" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var selected_items = [];
$(".checkbox").click(function(){
var selected_item = $(this).val();
var index = selected_items.indexOf(selected_item);
if(index == -1)
{
selected_items.push(selected_item);
}
else{
selected_items.splice(index, 1);
}
});
$("#submit-button").click(function(){
$.ajax({
url: '/requestaccess/',
data: {'request_reports': selected_items.join(","), 'csrfmiddlewaretoken': {{csrfmiddlewaretoken}} },
dataType: 'json',
type: 'post',
success: function (data) {
}
});
});
})
</script>
<input class="btn btn-primary" type="button" method = "POST" value="Request Access">
</div>
</form>
这是用户选择复选框的个人资料页面的视图。
def profile(request):
owner = User.objects.get (formattedusername=request.user.formattedusername)
reportdetail = QVReportAccess.objects.filter(ntname = owner.formattedusername, active = 1).values('report_name_sc')
reportIds = QVReportAccess.objects.filter(ntname = owner.formattedusername).values_list('report_id', flat=True)
reportaccess = QvReportList.objects.filter(report_id__in= reportIds).values_list('report_name_sc', flat = True)
reportGroups = QVReportAccess.objects.filter(ntname = owner.formattedusername).values_list('report_group_id', flat=True)
reportlist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).exclude(active=0)
allreportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 100)
bhreportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 200)
cereportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 500)
finreportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 600)
careportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 800)
pireportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 1100)
screportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 1200)
dssreportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 1300)
psgreportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 1400)
othreportgrouplist = QvReportList.objects.filter(~Q(report_id__in= reportIds)).filter(report_group_id = 99999)
# if request.method == 'POST':
# reportnamesc = request.POST.get('report_name_sc', '')
# checked = request.POST.get('request_reports', '')
# request_reports = #request_reports.objects.get(report_name_sc=reportnamesc)
# request_reports.request_reports = checked
# request_reports.save()
args = {'user':owner, 'applicationaccess':reportaccess, 'applicationlist':reportlist, 'bhgrouplist':bhreportgrouplist, 'cegrouplist':cereportgrouplist, 'fingrouplist':finreportgrouplist
, 'cagrouplist':careportgrouplist, 'pigrouplist':pireportgrouplist, 'scgrouplist':screportgrouplist, 'dssgrouplist':dssreportgrouplist, 'psggrouplist':psgreportgrouplist
, 'othgrouplist':othreportgrouplist, 'allgrouplist':allreportgrouplist}
return render(request, 'accounts/profile.html', args)
但是,由于我的帖子从未发生过,ajax不保存我的值,我可以在我的表单上执行request.POST ['request_reports'],只提取已检查的报告。
如果有更好的方法可以完成从一个html模板到表单的用户选择减少报告的任务,我愿意接受建议。
答案 0 :(得分:0)
您不会阻止按钮的默认操作,即提交表单 - 而表单又使用默认操作GET。
点击事件处理程序获取event
参数并调用event.preventDefault();
。