如何解決django中form表單設置action后無法回到原頁面的問題

小編給大家分享一下如何解決django中form表單設置action后無法回到原頁面的問題，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

django中form表單設置action后，點提交按鈕是跳轉到action頁面的，比如設置action為login，網址為192.168.1.128，跳轉后便會來到192.168.1.128/login，F(xiàn)5刷新也會是重新提交表單對話框，無法回到原頁面。

因此就要在django服務器進行重定向，具體就是

from django.shortcuts import redirect
#最后返回原頁面
return redirect(url)

補充知識：Django + Ajax發(fā)送POST表單，并將返回信息回顯到頁面中

將表單數據發(fā)送回后端，然后處理后端返回的信息并顯示在當前頁面中，這里使用Ajax進行處理；

那么先看js代碼：

<!--以下為 Ajax腳本 -->
  <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  <script type="text/javascript">
  $(document).ready(function(){
   $("#save").click(function(){
   $.ajax({
     url:"/api/add_event/",    #url
     type: "POST",        #提交表單的類型，相當于method="post"
     dataType: "json",      #dataType, 這個是請求后，返回的數據將以json格式顯示
     data:{"name": $("#id_name").val(),   #在"#"號后面是控件id， 所以千萬不要搞錯了，要不然會出大事的
        "limit":$("#id_limit").val(),
        "address": $("#id_address").val(),
        "start_time": $("#id_start_time").val(),
        "status": $("#id_status").val(),
     },                #Data這個地方，必須要獲取數據，代表將獲取到的數據發(fā)送到后端，后端再進行處理
     success:function(data){      
      console.log(data);      #調試使用
      console.log(data.status);   #調試使用
      console.log(data.message);   #調試使用
      $(".text").text(data.message); #將后端返回到結果通過前端頁面進行展示

    },    #注意標點
   });     #需要注意標點符號，如果標點符合錯誤了，那ajax基本上都不會執(zhí)行(否則，后果很嚴重哦)
   });     #注意標點
  });     #注意標點     
  </script>

注意（踩過的坑）：

1.contentType: "application/json" ——>加入該語句時，在后端print(request.POST)時無法獲取內容，相當于后端根本拿不到數據。因此在網上搜索了解到，使用contentType: “application/json”則data只能是json字符串；不使用時contentType一般為默認的application/x-www-form-urlencoded格式， 因此如果不限制 POST格式，干脆就不寫。

2. 說說“data”這里面需要注意：data:{"name", $("#id_name").val(), } 這其中id_name必須為控件的id 名稱，使用其它的則不能獲取的數據，這個還是得注意。

3. 標注符號，標點符號，標點符號，重要的事情說三遍，當然可以借助專門的編輯器（我主要是懶哦，哈哈）

4. $(".text").text(data.message); 回顯在html中，是對后端返回的數據進行處理

那行回顯在網頁面上面

<font color="red"> 
<span class="text"></span> 
</font>

以下為html代碼

<div class="container">
  <div class="col-md-4 col-md-offset-4">
    <form id="form1" onsubmit="return false" action="##" method="POST" class="form-horizontal">

    <!--此處就是通過后端返回到前端，前端進行展示-->
      <font color="red">
        <span class="text"></span>
      </font>

      <div class="form-group">
        <label for="id_name">發(fā)布會名稱:</label>
        <input type="text" name="name" class="form-control" placeholder="發(fā)布會名稱" maxlength="128" required id="id_name" />
      </div>
      <div class="form-group">
        <label for="id_limit">Limit:</label>
        <input type="number" name="limit" class="form-control" required id="id_limit" />
      </div>
      <div class="form-group">
        <label for="id_address">發(fā)布會地址:</label>
        <input type="text" name="address" class="form-control" placeholder="地址" maxlength="128" required id="id_address" />
      </div>
      <div class="form-group">
        <label for="id_start_time">開始日期:</label>
        <input type="text" name="start_time" required id="id_start_time" />
      </div>

      <div class="form-group">
        <label for="id_status">發(fā)布狀態(tài):</label>
        <select name="status" id="id_status">
         <option value="blank">-----</option>
         <option value="1">True</option>
         <option value="0">False</option>
        </select>
      </div>

      <div align="center">
       <input class="btn btn-lg btn-primary" id="save" type="submit" value="保存發(fā)布會" ></input >
      </div>
    </form>
  </div>
</div>

現(xiàn)在來看一下后端的代碼：

from django.views.decorators.csrf import csrf_exempt
@csrf_exempt
def add_event(request):
  if request.is_ajax():
    print(request.body)
    print(request.POST)

    name = request.POST.get('name', '') # 發(fā)布會名稱
    limit = request.POST.get('limit', '') # 限制人員
    status = request.POST.get('status', '') # 發(fā)布會狀態(tài)
    address = request.POST.get('address', '') # 發(fā)布會地址
    start_time = request.POST.get('start_time', '') # 發(fā)布會時間

    if name == '' or limit == '' or status == '' or start_time == '':
      return JsonResponse({'status': 10021, 'message': 'parameter error'})

    # 判斷發(fā)布會名稱重復
    result = Event.objects.filter(name=name)
    if result:
      return JsonResponse({'status': 10023, 'message': 'event name already exists'})

    if status == '':
      status = 1

    try:
      # Event.objects.create(id = eid, name = name, limit = limit, address = address, status = int(status), start_time=start_time)
      Event.objects.create(name=name, limit=limit, address=address, status=int(status), start_time=start_time)
    except ValidationError as e:
      error = 'start_time format error. It must be in YYYY-MM-DD HH:MM:SS'
      return JsonResponse({'status': 10024, 'message': error})
    return JsonResponse({'status': 200, 'message': 'add event success'})

1、在后端處理時，我們需要加入：@csrf_exempt 標記,所以導包from django.views.decorators.csrf import csrf_exempt，否則會出現(xiàn)錯誤csrf_token錯誤 （403）

2、request.is_ajax()判斷當前是否是使用ajax 進行表單提交

3、django request.POST / request.body

當request.POST沒有值 需要考慮：

1.請求頭中的: Content-Type: application/x-www-form-urlencoded request.POST中才會有值（才會去request.body中解析數據），關于Content-Type前面也提到，不寫的錯誤，它就是默認。

request.body的請求數據

b'name=%E5%A4%BA%E5%A4%BA&limit=123‘

request.POST的數據，django已進行自動處理

QueryDict: {‘name': [‘奪奪'], ‘limit': [‘123']

看完了這篇文章，相信你對“如何解決django中form表單設置action后無法回到原頁面的問題”有了一定的了解，如果想了解更多相關知識，歡迎關注億速云行業(yè)資訊頻道，感謝各位的閱讀！