前些天遇到一个需求，需求为：html动态生成的表格，需要增加一个select框去对内容进行筛选显示，选择对应的选项，表格中仅显示与该选项一致的数据
实现思路为：通过ajax传递select值，在后台获取新的数据后，将新数据传递回来
python代码
@login_required def myhtml(request): username = request.user.username data = testtable.objects.filter(Actor=username) htmldata = { ‘username‘: username, ‘data‘: data, } return render(request, ‘myhtml.html‘, htmldata)
@login_required def chooseproject(request): ‘‘‘选择具体项目‘‘‘ username = request.user.username if request.is_ajax(): chooseproject = request.POST.get(‘chooseproject‘) if chooseproject == ‘All Projects‘: data = testtable.objects.filter(Actor=username) else: data = testtable.objects.filter( Q(ProjectName=chooseproject) & Q(Actor=username)) htmldata = { ‘username‘: username, ‘data‘: data, } return render(request, ‘myhtml.html‘, htmldata)
jq代码:
$(‘#chooseproject‘).change(function(){ // 提取到所选择的内容 var project = $(‘#chooseproject‘).val(); $.ajax({ cache: false, url: "chooseproject", dataType: ‘text‘, type: ‘POST‘, async: false, data: { "chooseproject": project, }, success: function (data) { $(‘#thebody‘).html(data); $(function(){ $(‘#chooseproject‘).val(project); }); }, }); });
然而在代码执行到$(‘#thebody‘).html(data);时(thebody为body的id)，会出现html的css样式加载了两遍的情况
尝试将thebody改成thehtml(thehtml为html的id)，则会出现html的css样式无法加载的情况
在网上暂时未能找到相关解决方案
查看更多关于django+javascrip的疑问一的详细内容...