如何從Javascript用戶獲取用戶數據返回到Django

Question

我正在使用Django和Bootstrap創建一個簡單的網站。

在我的.html文件中，我使用Bootstrap來顯示日期選擇器。

<div id="datepicker" ></div> 

另外在.html，我當我的日期選擇器被點擊上得到更新一些快速和骯髒的JavaScript代碼。

<script> 
     function setup(){ 

      <SOME OTHER JS> 

      $('#datepicker').on("changeDate", function() { 
       $('#my_hidden_input').val(
        $('#datepicker').datepicker('getFormattedDate') 
       ); 
      }); 
     $(document).ready(setup); 
    </script> 

我想將這個新日期傳回給我的Django頁面。基本上，我想與數據有關這一新的日期刷新頁面，我的Django的代碼知道如何處理新的日期。

我該怎麼做？我是否應該重定向回當前頁面，但在URL中添加一些內容以便Django的正則表達式可以檢索它？或者我應該使用新的日期做一個Http GET？

Answer 1

您可以使用Ajax從服務器獲取數據無需刷新頁面：

jQuery.ajax({ 
    type: 'POST', 
    url: 'web/path/to/php/file.php', 
    data: { 
     post_date: $('#datepicker').val() //this is the data to post to server 
    }, 
    success: function(res) { 
     //code executed after server response. res - server response 
     $('#datepicker').append(res); //modifying your html 
    } 
}); 

而且在file.php例如：

echo $_POST['post_date']; //accessing your date on server side and return it 

如果確實需要刷新的頁面，您可以通過網址發送您的數據：

$('#datepicker').on("changeDate", function() { 
    var val = $('#my_hidden_input').val(
     $('#datepicker').datepicker('getFormattedDate') 
    ); 
    val = encodeURIComponent(val); //encode data for url passing 
    window.location.href = '?date = ' + val; //goto url with appended parameter 
}); 

獲取數據您使用：

$date = urldecode($_GET['date']); 

Answer 2

<script> 
    function pass_this_to_backend(date){ 
    $.ajax({ 
     type: "POST", 
     url: "/get_date/", 
     data: { 'date':date }, 
     dataType: "json", 
     success: function(response) { alert(response); }, 
     error: function(rrror) { alert(error); } 
    }); 

    } 


    function setup(){ 

     <SOME OTHER JS> 

     $('#datepicker').on("changeDate", function() { 
      $('#my_hidden_input').val(
       $('#datepicker').datepicker('getFormattedDate') 
      ); 
      pass_this_to_backend(date); 
     }); 
    $(document).ready(setup); 
</script>