2011-02-07 16 views
5

Küçük bir sorunum var, bana bir POST_TITLE ve bir POST_ID döndüren canlı bir arama yapmak istiyorum. başlık, kullanıcıların görmesi gereken ancak ana nedenim POST_ID'nin onunla çalışmasını istediğim. Birisi bana yardımcı olabilir, ben aşağıdaki kodu yayınlanmıştırAjax Live Search - 1 yerine 2 Alan Al

...

<script> 
//Gets the browser specific XmlHttpRequest Object 
function getXmlHttpRequestObject() { 
    if (window.XMLHttpRequest) { 
     return new XMLHttpRequest(); 
    } else if(window.ActiveXObject) { 
     return new ActiveXObject("Microsoft.XMLHTTP"); 
    } else { 
     alert("Your Browser Sucks!\nIt's about time to upgrade don't you think?"); 
    } 
} 

//Our XmlHttpRequest object to get the auto suggest 
var searchReq = getXmlHttpRequestObject(); 

//Called from keyup on the search textbox. 
//Starts the AJAX request. 
function searchSuggest() { 
    if (searchReq.readyState == 4 || searchReq.readyState == 0) { 
     var str = escape(document.getElementById('txtSearch').value); 
     searchReq.open("GET", '/wp-content/themes/twentyten/livesearch.php?search=' + str, true); 
     searchReq.onreadystatechange = handleSearchSuggest; 
     searchReq.send(null); 
    }   
} 

//Called when the AJAX response is returned. 
function handleSearchSuggest() { 
    if (searchReq.readyState == 4) { 


      var sx = document.getElementById('restaurantid') 
     sx.innerHTML = ''; 

     var ss = document.getElementById('search_suggest') 
     ss.innerHTML = ''; 
     var str = searchReq.responseText.split("\n"); 
     for(i=0; i < str.length - 1; i++) { 
      //Build our element string. This is cleaner using the DOM, but 
      //IE doesn't support dynamically added attributes. 
      var suggest = '<div onmouseover="javascript:suggestOver(this);" '; 
      suggest += 'onmouseout="javascript:suggestOut(this);" '; 
      suggest += 'onclick="javascript:setSearch(this.innerHTML);" '; 
      suggest += 'class="suggest_link">' + str[i] + '</div>'; 
      ss.innerHTML += suggest; 
      ss 
     } 
    } 
} 

//Mouse over function 
function suggestOver(div_value) { 
    div_value.className = 'suggest_link_over'; 
} 
//Mouse out function 
function suggestOut(div_value) { 
    div_value.className = 'suggest_link'; 
} 
//Click function 
function setSearch(value) { 
    document.getElementById('txtSearch').value = value; 
    document.getElementById('restaurantid').value = value; 
    document.getElementById('search_suggest').innerHTML = ''; 
} 
</script> 


<form id="frmSearch" action=""> 
    <input type="text" id="restaurantid" name="restaurantid" style="display: none;" /> 
        <input type="text" id="txtSearch" name="txtSearch" alt="Search Criteria" onkeyup="searchSuggest();" autocomplete="off" /> 
        <input type="submit" id="cmdSearch" name="cmdSearch" value="Search" alt="Run Search" /> 
        <div id="search_suggest"></div> 
       </form> 
</code> 

livesearch.php - THE AJAX PAGE 

<code> 
<?php 

$con = mysql_connect('x', 'x', 'x); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("xx", $con); 
if (isset($_GET['search']) && $_GET['search'] != '') { 
    //Add slashes to any quotes to avoid SQL problems. 
    $search = addslashes($_GET['search']); 
    //Get every page title for the site. 
    $suggest_query = mysql_query('SELECT * FROM `mrr_posts` WHERE `post_title` LIKE \'%'.$search.'%\' AND `post_status` LIKE \'publish\' LIMIT 0, 30') or trigger_error("Query: $suggest_query\n<br />MySQL Error: " .mysql_error());    
    while ($suggest = mysql_fetch_array($suggest_query, MYSQL_ASSOC)) {  
    //while($suggest = db_fetch_array($suggest_query)) { 
     //Return each page title seperated by a newline. 
     echo $suggest['post_title'] . "\n"; 
    } 
} 





mysql_close($con); 
?> 
+1

+1 uyarı mesajı için – yoda

+0

Ayrıca +1 uyarı için - beni güldürdüğünüz için teşekkürler - bekarların cevabı durumunuza en uygun şekilde görünüyor. İyi şanslar! – Zydeco

cevap

0

Sen JSON yılında sunucudan veri dönmelidir (veya XML, ancak JSON daha kolaydır) ve sonra JavaScript ayrıştırmak. Kullanıcılara başlıkları göster, id kendiniz için saklayın.

+0

ayrıca istediğiniz herhangi bir biçimde döndürebilir ve javascript'inizde ayrıştırabilir. Ancak JSON kesinlikle standarttır - sadece gerekli değildir. – Prescott

+0

@Prescott Dediğin gibi, bu gerekli değil, ama PHP'de json_encode' sayesinde bu en basit çözüm. – singles

+0

1-TITLE gibi bir şeye sahip olduğum bu koddan girebildim ve javascript'te ID başlığından patladım? – WilfredMifsud

1

: Burada cevabım bakın. Sorunu jQuery ile etiketlediğini fark ettim, sanırım bunu kullanıyorsun. Bu, sorunuzun bir cevabı değildir, ancak kodunuzu basitleştirmenize yardımcı olacak jQuery ile kodlanan javascript için bazı ipuçları aşağıda verilmiştir. yerine doğrudan XMLHttpRequest nesnesini kullanarak ajax çağrıları yapmanın

  • , sadece ($ kullanmak yerine getElementById ('bazı-id') kullanma (successFunction url)
  • $ .get kullanmak '# bazı- id '), daha sonra iç html'yi boşaltma gibi şeyler yapmak için $ (' # some-id ') yapabilirsiniz. html (' '). HTMLElement yerine jQuery öğesini kullanarak, DOM'yi çapraz tarayıcı uyumlu bir şekilde de işleyebilirsiniz: http://api.jquery.com/category/manipulation/
  • javascript'inizi HTML'nize yüklemek yerine (tüm bu ve onmouseout işleyicileri) $ ('div.suggest_link') ') "suggest_link" sınıfına sahip olan sayfadaki tüm div'ları seçmek için. Ardından, dinamik olarak oluşturulmuş html üzerinde çalışacak bir canlı etkinlik işleyicisi ekleyin, bunun gibi: $ ('div.suggest_link'). Live ('mouseover', handleMouseOverForSuggestLink). Sen jQuery'nin sayfasında bu konuda daha fazla bilgi edinebilirsiniz: http://api.jquery.com/live/

Bütün bu öneriler modern tarayıcılarda çalışır ve bir sürü kod kısmak yardımcı olacaktır. İyi şanslar!