Ajax成功地用d形式调用show div

3条回答

网友

1楼 · 编辑于 2024-04-26 05:28:49

检查服务器是否返回任何错误消息：

$.ajax({ 
    // ...
    error: function(err) {
        console.log(err);
    }

}）

编辑：

提交表单时不传递用户id。尝试做一些类似的事情：

^{pr2}$

网友

2楼 · 编辑于 2024-04-26 05:28:49

让我分析一下您的JS代码，因为我可以看到一些错误/错误：

$('.openDiv').click(function (e) {       
    e.preventDefault();

    // where is following data taken from? At the point you click the .openDiv link, the form doesn't have any data yet so all of them will be empty string ''
    var csrf_token = $("#csrf_token").val();
    var id =  $(this).closest('td').attr('id');
    var firstname = $("#"+id).find('#id_first_name').val();
    var lastname = $("#"+id).find('#id_last_name').val();
    var phonedaytime = $("#"+id).find('#id_phone_daytime').val(); 
    var phonemobile = $("#"+id).find('#id_phone_mobile').val();
    var email = $("#"+id).find('#id_email').val();

    // do you use AJAX to get the form or use it to save the form?
    $.ajax({ 
        data: $(this).serialize(), // this is wrong, $(this) is the link object, not a form
        type:'POST',
        url: '/setting/save-reporter/',
        success: function(data) {
            $('#authorisedreporter').html(data);
            $('#authorisedreporter').show();
        }
   });
});

据我所知，在单击链接之后，您将使用AJAX向Django视图发送请求，以取回正确的实例化表单。所以你应该：

首先，简化您的JS代码：

^{pr2}$

下一步，将旧视图拆分为多个视图，以集中精力处理它需要做的事情（注意：您可以将index视图保持原样）：

def fetch_reporter_form(request):
    ''' Change your save_reporter view name to this view '''
    registerform = UserRegisterForm()

    if request.method == 'POST':
        id = request.POST.get('id', None)
        if id:
            user = get_object_or_404(pk=user.id)
            userprofile = UserProfile.objects.get(user=user)
            registerform = UserRegisterForm(request.POST, instance=user)
            return render(request, 'setting/register_form.html', {
                'user_id': id
                'registerform':registerform
            })
        else:
            return HttpResponse('Request does not contain any ID')
    else:
        return HttpResponse('Request is not POST')

def update_reporter(request):
    ''' This function is for update the reporter '''
    registerform = UserRegisterForm()

    if request.method == 'POST':
    id = request.POST.get('id', None)
        if id:
            user = get_object_or_404(pk=user.id)
            userprofile = UserProfile.objects.get(user=user)
            registerform = UserRegisterForm(request.POST, instance=user)
            if registerform.is_valid():
                result = registerform.save(commit=False)

                # saving code here ...
                return HttpResponse('Success')
        else:
            return HttpResponse('Request does not contain any ID')
    else:
        return HttpResponse('Request is not POST')

您可以看到这里有两个函数：一个用于从AJAX获取正确的表单，另一个用于通过普通表单提交保存数据。当然，您应该相应地生成urls.py，类似于：

urlpatterns = patterns('',
    # ... your code ...
    url(r'^setting/fetch-reporter-form/$', 'yourapp.views.fetch_reporter_form'),
    url(r'^setting/update-reporter/$', 'yourapp.views.update_reporter'),
)

您可能还注意到，您应该创建一个新的模板setting/register_form.html，它只包含您的注册表单HTML（注意：您需要一个隐藏的id字段，该字段由上面的fetch_reporter_form视图返回）来标识该表单：

<form method="post" action="/setting/update-reporter" id="reporter-form">
    {% csrf_token %}
    <input type="hidden" name="id" value="{{ user_id }}" />
    <!  your code here  >
</form>

所以流程是：

转到index视图。有几种形式可以正常保存新记者等。在
单击.openDiv按钮。它将把上面的AJAX请求发送到fetch_reporter_form以获得正确的表单。（此时您的代码运行良好）
单击表单上的Save按钮，它将把更新的数据（通过POST）提交给update_report视图并更新报告器。在

我只是想告诉你基本的想法。剩下的部分很简单，所以我想你可以很容易地继续。希望有帮助！在

网友

3楼 · 编辑于 2024-04-26 05:28:49

让我继续你的工作：

$.ajax({ 
    data:{
        /* ... */
    },
    type:'POST',
    url: '/report/save_reporter/',
    success: function() {
        return true;
    }
});

这里设置了一个Ajax异步查询来将数据发送到服务器。当查询到达服务器时，如果没有崩溃，则调用success:回调，javascript不做任何操作（return true;）。在

^{pr2}$

这里，在异步Ajax查询结束之前显示一个HTML节点（成功或失败）。要在Ajax查询完成后显示元素，请将此代码放入success:或error:回调中。在

最后，如果计算一下您的(、)、{和{}，您将看到$('#authorisedreporter').show();在单击回调之外。因此，如果它不在document ready回调中，它将不起作用。在

所以正确的Javascript代码应该是（我认为）：

$('.openDiv').click(function (e) {    
    e.preventDefault();          
    var id = $(this).attr('id');  
    var firstname = $("#"+id).find('#id_first_name').val();    
    var phonemobile = $("#"+id).find('id_phone_mobile').val();    
    $.ajax({ 
        data:{
            csrfmiddlewaretoken: csrf_token,
            edit_reporter:true,
            id:id,
            first_name:firstname,               
            phone_mobile:phonemobile,
        },
        type:'POST',
        url: '/report/save_reporter/',
        success: function() {
            $('#authorisedreporter').show();
        }
   });
});

编辑：

关于你的视图.py，保存用户配置文件，但不将任何内容返回到客户端浏览器。没有什么。在

def save_reporter(request):
    user=User.objects.get(user=user) # you should use django.shortcuts.get_object_or_404
    userprofile = Userprofile.objects.get(user=user) # same comment
    if request.method == 'POST':
        registerform = UserRegisterForm(request.POST,instance=user)
        createprofileform = UserCreateProfileForm(request.POST,instance=userprofile)
        # you create 2 forms above, but don't use them. Is it normal ?!
        # you should do loops "if registerform .valid(): ... else: ..." and use it. Same for the 2nd form
        if 'edit_reporter' in request.POST:
            first_name=request.POST.get('first_name') # can be None
            phone_mobile = request.POST.get('phone_mobile') # can be None      
            user = User.objects.get(pk=user)
            user.first_name = first_name            
            user.save() # put it inside a try/except statment
            userprofile = UserProfile.objects.get(pk=user) # use get_or_404
            userprofile.phone_mobile = phone_mobile 
            userprofile.save() # put it inside a try/except statment
    return HttpResponse() # this returns an empty html page, do you want to return the form here ?

相关问题更多 >

编程相关推荐

热门问题

热门文章