从ajax获取值以查看模板而不使用表单

Question

我有一个 div 类，它从 for 循环查询集中获取内容

   <div class="form-group row"> 
      <div class="col-md-4">Số hợp đồng</div>
      <label class="col-md-8" id="so_hd_goc">{{hd.so_hd}}</label>
   </div>

我想使用 ajax 从 id="so_hd_goc" 获取值并将其发送到视图：

我的视图：

def check_so_hd(request):
    check_shd=request.GET.get("check_shd")
    print("check_shd",check_shd)
    return HttpResponse(check_shd)

我的表单：

        <div class="card card-body">
          <form method="POST" id = "save_bo_sung_sdt">
            {% csrf_token %}
              <div class="form-group row">
                <div class="col-md-6">Người liên hệ</div>
                <div class="col-md-6" id ="sdt_nguoi_lien_he" name="sdt_nguoi_lien_he">{{form1.nguoi_lien_he}}</div>
              </div>
              <div class="form-group row">
                <div class="col-md-6">Số điện thoại</div>
                <div class="col-md-6" id ="sdt_dien_thoai" name="sdt_dien_thoai">{{form1.dien_thoai}}</div>
              </div>
              <div class="form-group row">
                <div class="card-footer" >
                  <button type="submit" class="btn btn-primary" id="save_phone" name="save_phone">Lưu số điện thoại</button>
                </div>
              </div>
          </form>
        </div>

我的 ajax：

    <script>
  const form1 = document.getElementById('save_bo_sung_sdt')
  const sdtContainer = document.getElementById('sdt-body')
  
  form1.addEventListener('submit', checkshd)
  function checkshd(e){
    e.preventDefault()
    check_shd=document.getElementById(so_hd_goc)
    
    $.ajax({
      type: "GET",
      url: "{% url 'check_so_hd' %}",
      data: 
      {
       check_shd:check_shd
      },
      success:function(data){
            alert(data)
            }
            
    })
  };
</script>

我的 url

path('check_so_hd', CallerViews.check_so_hd, name="check_so_hd"),

没有错误>只是不打印任何结果

Answer 1

试试这个：

  form1.addEventListener('click', (e) => {

    e.preventDefault();

    check_shd=document.getElementById('so_hd_goc').innerText;
    
    console.log("check_shd=",check_shd);
    
    $.ajax({
      type: "GET",
      url: "{% url 'check_so_hd' %}",
      data: 
      {
        'check_shd' : check_shd
      },
      success:function(data){
        alert(data)
      }
            
    })
  });