Question

如何将值传回给使用Ajax发布到服务器的表单？

在视图中（如下所示），我只是返回一个简单的数据结构来测试：

def detail(request, widget_id):

    widget = get_object_or_404(Widget, pk=widget_id)

    if request.method == 'POST':
        form = WidgetDetailsForm(request.POST, instance=widget)
        if form.is_valid():
            form.save()
            return HttpResponseRedirect(request.path)  # Redirect after POST
        else:
            if request.is_ajax():
                response_dict = {
                    'page': 1,
                    'total': 2,
                    'rows': 3
                }
                json = simplejson.dumps(response_dict)
                return HttpResponse( json, mimetype='application/json')

    else:
        form = WidgetDetailsForm(instance=widget)

    params = {}
    params['widget'] = widget
    params['form'] = form
    return render_to_response('widgets/detail.html', params,
                              context_instance=RequestContext(request))

模板中的JavaScript是：

<script type="text/javascript">
    /* <![CDATA[ */
        // Wait for the DOM to be loaded
        $(document).ready(function() {
            // Bind 'myForm' and provide a simple callback function.
            $('#updateform').wl_Form({
                onSuccess: function(data, status){
                    alert(data);
                    alert(data.page);
                    alert(data.rows);
                    alert(data.total);
                },
                "status": false,
                "confirmSend": false
            });
        });
    /* ]]> */
</script>

我从警告声明中得到以下内容。

{"rows": 3, "total": 2, "page": 1}
undefined
undefined
undefined

为什么data.page，data.rows和data.total返回未定义？

Answer 1

因为data是一个字符串（JSON） - 请注意第一个alert()的输出。

尝试类似：

$('#updateform').wl_Form({ 
    onSuccess: function(response, status){
        var data = $.parseJSON(response); 
        alert(data);
        alert(data.page);
        //...
    }
});

Answer 2

也许做

data = JSON.parse(data);

并且不要忘记为旧版浏览器添加json2.js吗？

这取决于wl_Form的作用。

无法解析JavaScript中的JSON数据结构

2 个答案: