0

到目前为止，我已经成功地使用 dajax 实现了这个视图，但我发现它非常混乱，而且我一直在阅读到目前为止，在 view.py 文件中拥有你的视图是一个很好的做法。我已经尝试使用本指南实现它：http: //www.micahcarrick.com/ajax-form-submission-django.html但无法读取单击了哪个按钮。

提交后（无重定向）仍应显示相同的视图，因为该页面还包含我连接的仪器的绘图和其他状态。

模型.py

class ActiveMeas(models.Model):
    channels    = models.CharField(max_length=100)
    technology  = models.ForeignKey(TechnologyModel)
    samples     = models.IntegerField()
    delay       = models.IntegerField()
    table       = models.IntegerField()
    stir        = models.IntegerField()

表格.py

class ActiveForm(ModelForm):
    class Meta:
        model=ActiveMeas

.html 文件

<form action="" method="post" id="activeform">
    <div id="ajaxwrapper">
    {% csrf_token %}
    {{ form.non_field_errors }}
    {{ form.as_p }}
    <p id="sendwrapper"><input type="submit" value="Start" id="idstartbut" name="_ButtonStart"/></p>
    <p id="sendwrapper"><input type="submit" value="Stop" id="idstopbut" name="_ButtonStop"/></p>
    </div>
</form>

以及我从未进入buttonstart或buttonstop的视图文件。另一个问题是如何将数据返回到 javascript 并从那里更新？

视图.py

def active(request):
    if request.POST:
        form = ActiveForm(request.POST)
        if '_ButtonStart' in request.POST:
            print "START"
            if form.is_valid():
                response_data = {'data':request.POST}
                return HttpResponse(simplejson.dumps(response_data))
            else:
                print "NOT VALID"
                response_data = {'data':request.POST}
                return HttpResponse(simplejson.dumps(response_data))
        elif '_ButtonStop' in request.POST:
            print "STOP"
    else:
        form = ActiveForm()
    return render(request, 'active.html', {'index': "active",'form':form})

javascript

function ActiveInit(){
    $(document).ready(function () {
    $(function() {
        var form = $("#activeform");
        form.submit(function(e) {
            $("#ajaxwrapper").load(
                form.attr('action') + ' #ajaxwrapper',
                form.serializeArray(),
            );
            e.preventDefault(); 
        });
    });
}

我对 django、ajax 和 jQuery 都很陌生。因此，如果要做一些不同的事情，以及如何解决我的问题，请赐教。

4

2 回答 2

2

使用或不使用 ajax 提交表单没有什么不同。

在一种情况下，浏览器会处理所有事情并将发送到服务器的查询放在一起，在 ajax 的情况下，所有这些都由 javascript - 在您的情况下是 jQuery 完成。

看看这个：http ://api.jquery.com/jQuery.post/

现在如何从 django 获取返回的验证数据？

有2种方法：

1）返回表单的渲染模板，并用返回的表单替换现有的。在这种情况下，您需要在该模板中呈现所有错误消息。看看这些链接： http ://djangosnippets.org/snippets/1094/ 如何在模板中显示 Django '__all__' 表单错误？

2）在第二种情况下，您可以在 django 端手动汇总所有表单错误的列表。将它们转换为 json，然后编写将错误与网站上的元素匹配的脚本，然后显示它们。

如果您是 jquery 和 django 的新手，那么 1) 更容易做到 2)

祝你好运

于 2013-05-30T18:40:27.253 回答
2

在安静了一些搜索之后，我找到了 jQuery 表单插件http://www.malsup.com/jquery/form/，它完全符合我的要求。

所以很简单我的javascript现在是：

$(document).ready(function(){
    $('#aform').ajaxForm(function(data){
        if(data){
              //Do something with the returned data
        }
    });
});

两者都将表单和提交值发送到我的视图。

然后我的视图函数将错误转储到 jQuery 以便显示（如果有）

if request.POST:
    form = ActiveForm(request.POST)
    if form.is_valid():
        errors=""
        if '_ButtonStart' in request.POST:
            print "START"
        elif '_ButtonStop' in request.POST:
            print "STOP"
    else:
        print "NOT VALID stop"
        errors=form.errors
    return HttpResponse(simplejson.dumps(errors))
else:
    form = ActiveForm()
    return render(request, 'active.html', {'index': "active",'form':form})

在 javascript 中，错误可以通过以下方式读取：

var errors = $.parseJSON(data);
console.log(errors.samples);     //Samples is an inputbox in my form
于 2013-05-31T20:41:04.003 回答