發送數據從服務器到客戶端 - ajax

Question

我需要調用一些python函數並顯示其結果（實際上是幾個列表對象）在div id =「places」部分。我試圖在JavaScript函數show_sec（）做到這一點，但我找不出如何從服務器捕獲數據並在客戶端上處理它。

我的任務非常簡單和基本，但因爲這是我的第一個Web項目，我需要一些幫助與Ajax。請幫幫我。

這是我的代碼的一部分：

的.html

{% include "header.html" ignore missing %} 

<!-- contents of nearest banks page --> 
    <section id="ask_user"> 
      <div id="question">Разрешить приложению определить Ваше место расположения для нахождения ближайших банков?</div> 
      <div id="buttons"> 
       <input type="button" name="yes" value="Да, разрешить" onclick="show_sec()"/> 
       <input type="button" name="no" value="Нет, не разрешать" onclick="dnt_show_sec()"/> 
      </div> 
    </section> 

     <section id="allowed" style="display:none;"> 
      <div id="map_canvas"></div> 
      <div id="nearest_banks"> 
       <form action="/nearest_banks/radius" method="get" id="send_radius"> 
        Курс ближайших банков на сегодня в радиусе 
        <input type="text" name="radius" id="radius" size="5" value={{radius}} > 
        <input type="submit" class="button" value="V"> 
        метров 
       </form> 
       <div id="check"> {{output}}</div> 
       <div id="places"> </div> 
      </div> 
     </section> 

     <section id="not_allowed" style="display:none;"> 
      <div class="question"> Приложение не имеет возможности определить близ лежащие банки.<div> 
     </section> 


</body> 

<script type="text/javascript"> 

    /* frm.submit(function() { 
     $.ajax({ 
      type: frm.attr('method'), 
      url: frm.attr('action'), 
      data: frm.serializeArray(), 
      cache: false, 
      success: function() { 
       $("#check").html("OK!!!"); 
      }, 
      error: function(data) { 
       $("#check").html("Something went wrong!"); 
      } 
     }); 
     return false; 
    }); */ 

    function show_sec() { 
     document.getElementById('allowed').style.display = "block"; 
     document.getElementById('ask_user').style.display = 'none'; 
     $.ajax({ 
      type: "get", 
      url: "/nearest_banks/radius", 
     }).success(function(data) { 
      $("#places").html(data); 
      /*alert ("OK !!!"); */ 
     }); 

    } 

    function dnt_show_sec() { 
     document.getElementById('not_allowed').style.display = "block"; 
     document.getElementById('ask_user').style.display = 'none'; 
    } 


    $(document).ready(function(){ 
     $("button#yes").click(function(){ 
      //alert("demo_test"); 
      $("section#allowed").show(); 
     }); 
    }); 
</script> 

蟒蛇功能我打電話：

*def get(self): 
     default_radius = 1000 
     radius = get_radius(self) 
     exceptions = [u'', 'error', 0]     # invalid values for radius 
     if any([radius in exceptions]): 
      radius = default_radius 
      #warning = "Вы ввели неверный радиус. Система автоматически заменила его на стандартный." 
      output = radius        # заменить на вывод банков 
     else: 
      #warning = '' 
      output = radius        # заменить на вывод банков 
     names, location = Findplaces(self, radius) 
     body_values = { 
      'names': names, 
      'location': location, 
      'radius': radius, 
      'output': output, 
      #'warning': warning, 
     } 
     template = jinja_env.get_template('nearest_banks.html') 
     self.response.out.write(template.render(body_values))* 

總之我的目標是顯示名和位置在標籤div id =「places」點擊後是按鈕。

或者，也許我可以通過在我的python函數中使用jinja2從服務器端啓動顯示特定標籤。

請幫幫我。我花了很多時間，仍然不能很好地工作。提前致謝 ！

編輯：

當我點擊是按鈕show_sec函數加載部分與ID允許。 問題：表單中的操作未處理。所以只顯示html，但沒有收到來自服務器的數據。

Answer 1

由於url是「/ nearest_banks/radius」，並且它是get，請嘗試在瀏覽器中打開它以查看顯示的內容。您可能需要在返回的頁面上查看源代碼才能正確查看。你應該首先驗證Web服務的功能，返回一些東西，然後返回正確的東西。

接下來，在您的show_sec函數中，進行試驗和錯誤以查看會發生什麼。如果您將請求的內容移動到與正在執行的頁面相同的路徑，這是否有所作爲？