亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

將復選框輸入保存到數據庫并更新頁面

將復選框輸入保存到數據庫并更新頁面

楊魅力 2023-03-08 16:20:35
我的問題是我有一個“分配”對象列表,它們都有一個名為“狀態”的字段。狀態為 true 或 false,用戶可以通過單擊特定分配的復選框來選擇更改值。這就是前端的樣子,每個作業都有一個復選框,這是它的“狀態”我目前的解決方案是這樣的:課程詳情.html:{% for assignment in assignments %}<tr>  <td scope="row" style="text-align: center">    <form>    {% csrf_token %}      {% if assignment.status %}        <input type="checkbox" checked onclick='assignmentFinish("False","{{assignment.id}}")'>      {% else %}        <input type="checkbox" onclick='assignmentFinish("True","{{assignment.id}}")'>      {% endif %}    </form>  </td>  <td><h5><span class="badge badge-{{assignment.module.colour}}">{{assignment.module}}</span></td>  <td><a href="{{ assignment.assigmentFile.url }}">{{assignment.title}}</a></td>    <td>{{assignment.deadline}}</td>  ...</tr>{% endfor %}阿賈克斯代碼:function assignmentFinish(value,assignment) {    link = "{% url 'uni:finish-assignment' %}";    $.ajax({      type:'POST',      url: link,      data:{        status: value,        assignmentID: assignment,        csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val()      },      success: function(){      }    });}  意見.py:def finishAssignment(request):    # Get the product that user has wished for    assignmentID = request.POST['assignmentID']    status = request.POST['status']    assignment = Assignment.objects.get(pk=assignmentID)    print(status)    if status == 'True':        print("saving to true")        assignment.status = True    else:        print("saving to false")        assignment.status = False    assignment.save()    return HttpResponse('')enter code here它表明正在調用 ajax 請求,但打印語句應該在 true 和 false 之間交替。出現這種情況的原因可能是因為在第一次將新值保存到數據庫后,顯示復選框的頁面上的信息沒有更新。我該如何解決?
查看完整描述

1 回答

?
縹緲止盈

TA貢獻2041條經驗 獲得超4個贊

問題與您如何構建它有關。我會給你關于正在發生的事情和解決方案的建設性反饋。


你提到


1.


例如,如果用戶重復單擊一個最初未選中的復選框,打印語句將是這樣的:


[15/Jul/2020 16:11:51] "POST /uni/finishAssignment HTTP/1.1" 200 0

True

saving to true

[15/Jul/2020 16:11:52] "POST /uni/finishAssignment HTTP/1.1" 200 0

True

saving to true

這是True因為這<input type="checkbox" onclick='assignmentFinish("True","{{assignment.id}}")'>將調用ajax值為 的請求True。在views.py它將執行以下塊


if status == 'True':

   print("saving to true")

   assignment.status = True

所以上面顯示的打印行為是完全正常的,因為這個塊將被重復執行。


2.


但是打印語句應該在 true 和 false 之間交替。出現這種情況的原因可能是顯示復選框的頁面上的信息未更新。


這是正確的,因為您沒有在任何地方更新復選框的值,并且您始終假定值是明確的true和false。


解決方案: 要解決此問題,您需要修改您的js函數,使其將作為element第一個參數和assignment.id第二個參數。在其中,您需要通過使用checkedstatus屬性直接獲取復選框的值來更新參數。


  <td scope="row" style="text-align: center">

    <form>

    {% csrf_token %}

      {% if assignment.status %}

        <input type="checkbox" checked onclick='assignmentFinish(this,"{{assignment.id}}")'>

      {% else %}

        <input type="checkbox" onclick='assignmentFinish(this,"{{assignment.id}}")'>

      {% endif %}

    </form>

  </td>

function assignmentFinish(element,assignment) {

    link = "{% url 'uni:finish-assignment' %}";

    $.ajax({

      type:'POST',

      url: link,

      data:{

        status: element.checked ,

        assignmentID: assignment,

        csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val()

      },

      success: function(){


      }

    });

}

現在您將傳遞復選框的實際值,它應該按照您期望的方式運行。


查看完整回答
反對 回復 2023-03-08
  • 1 回答
  • 0 關注
  • 159 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號