如何處理表單提交而用戶看不到重定向

Question

在我的工作頁面http://127.0.0.1:8000/jobs/我有兩種形式的作品。 一種用於創建作業，一種用於編輯。 添加新工作的工作正常，但我在管理第二個表格進行編輯時遇到問題。

我對增加職位的看法是：

def jobs(request):
    form = LimitedJobForm(request.POST or None, prefix='add')
    if form.is_valid():
      instance = form.save(commit=False)
      instance.save()

    context ={
    "form":form,
    }
    return render(request,"jobs.html",context)

我對編輯作業的看法是：

def editjob(request):
  # if request.is_ajax():
  jobnum = request.GET.get('jobnum')
  job_list = Job.objects.filter(jobnum=jobnum)
  json_data = serializers.serialize('json', job_list)
  a = json.loads(json_data)
  a = a[0]['pk'] #that's our pk!
# return JsonResponse(a,safe=False)

  j = Job.objects.get(pk=a) 
  editJobForm = JobForm(request.POST or None, prefix='edit',instance=j)
  if editJobForm.is_valid():
        frm_jobnum = editJobForm.cleaned_data.get("jobnum")
        frm_pm = editJobForm.cleaned_data.get("pm")
    #other fields redacted
        instance = editJobForm.save()
        instance.save()
  context ={
      "editJobForm":editJobForm,
    }
  return render(request, "editjob.html", context)

我有一個按鈕，其值根據表中作業的選擇而更新：

<button id='editjob' class='btn-primary'>Edit <span id='jobNum2'></span></button>

該jquery將按鈕值傳遞到編輯視圖以獲取作業的pk，然后填充表單並將其添加到我的http://127.0.0.1:8000/jobs/頁面上的div中。

//populate edit job form
$('#editjob').click(function(){
    var a = document.getElementById('jobNum').textContent
    $.ajax({
    url: "editjob",
    data: {'jobnum':a},
    success: function(data) {
        // console.log(data);
        $(".mydiv").html(data);
        document.getElementById('editform').action='editjob/?jobnum='+a;    
    },
    });
});

如您所見，一旦用戶提交了正在編輯的作業的更新，他們就會被重定向到http://127.0.0.1:8000/jobs/editjob/?jobnum=[some jobnum]此時，如果沒有驗證錯誤，更新將已保存到數據庫。 如果有驗證錯誤，這些錯誤當然會顯示在此頁面上。 我希望不能讓用戶重定向到/ jobs / editjob頁面，但是我不確定如何最好地做到這一點。 我必須修改編輯作業表單的操作以重定向，否則django無法理解正在提交頁面上的兩個表單中的哪一個，因為它認為正在提交添加作業表單並觸發其驗證錯誤。

Answer 1

使用error回調

錯誤

類型：函數（jqXHR jqXHR，字符串textStatus，字符串errorThrown）

如果請求失敗，將調用的函數。 該函數接收三個參數：jqXHR對象（在jQuery 1.4.x中為XMLHttpRequest），一個描述發生錯誤的類型的字符串，以及一個可選的異常對象（如果發生）。 第二個參數（除null外）的可能值為“超時”，“錯誤”，“中止”和“ parsererror”。 發生HTTP錯誤時，errorThrown會接收HTTP狀態的文本部分，例如“未找到”或“內部服務器錯誤”。 從jQuery 1.5開始，錯誤設置可以接受函數數組。 每個函數將依次調用。 注意：對於跨域腳本和跨域JSONP請求，不會調用此處理程序。 這是一個Ajax事件。

因此，您可以使用包含有關error信息的json進行回復，並在error回調函數中顯示此信息

//populate edit job form
$('#editjob').click(function(){
    var a = document.getElementById('jobNum').textContent
    $.ajax({
    url: "editjob",
    data: {'jobnum':a},
    success: function(data) {
        // console.log(data);
        $(".mydiv").html(data);
        document.getElementById('editform').action='editjob/?jobnum='+a;    
    },
    error: function(jqXHR,textStatus, errorThrown){
         ........................................
         some actions that would be done on error
         ........................................
    }, 
    });
});