2016-11-24 71 views
0

好吧,卡在這裏... 我有一個twitter typeahead自動完成框。用JS和PHP重新加載autocomplete頁面的一部分?

 <div id="sites"> 
      <span></h4>Site Review</h4><input class="typeahead form-control" type="text" placeholder="Spot Check for..."></span> 
     </div> 

在自動完成的選擇,而不是重新加載頁面或一個iframe,我想刷新包含獨特的存儲在MySQL服務器的每個「網站」列表元素一個div。這些將get_site_attributes.php

$('.typeahead') 
    .typeahead(/* pass in your datasets and initialize the typeahead */) 
    .on('typeahead:selected', onAutocompleted) 
    .on('typeahead:autocompleted', onSelected); 


function onAutocompleted($e, datum) { 
... 
} 

function onSelected($e, datum) { 
... 
} 

現在被拿來我怎麼重新加載該分區與get_site_attributes.php而不使用iframe的內容?

- 提前感謝

+0

javascript和一些Ajax。使用ajax從數據庫獲取信息,然後使用javascript或jQuery更新div內容 – Icewine

回答

2

正如在評論中說的,你必須使用ajax。

電話,無論你需要刷新DOM內容的方法AjaxCall的

比方說,你有這樣的:

<h1 class='site_title'></h1> 

然後在您的JS:

var ajaxCall = function(){ 
    $.ajax({ 
    url : 'get_site_attributes.php', #or relative path 
    type : 'GET', 
    dataType:'', #whatever get_site_attributes.php is returning: html/json/... 
    success : function(data) {    
     updateDatas(data); 
    }, 
    error : function(request, error) { 
     console.log(request, error); 
    } 
}); 
} 

var updateDatas(data) = function(){ 
    # replace whatever you want in the DOM with your datas 
    # for example: 
    # $('.site_title').empty(); 
    # $('.site_title').append(data.site_title); 
}