2011-04-08 58 views
1

我是一個完整的初學者,當談到阿賈克斯,出於某種原因,我不能得到一個簡單的示例正常工作,使用Ajax與JSF的麻煩......有一個Tomcat 7.0服務器

的JavaScript:

var xmlhttp; 
function reloadIssues() 
{ 
    if (window.XMLHttpRequest) 
    { 
     xmlhttp = new XMLHttpRequest(); 
    } 
    else 
    { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange = function() 
    { 
     if (xmlhttp.readyState == 4) 
     { 
      document.getElementById("tester").innerHTML = xmlhttp.responseText; 
     } 
    }; 


    xmlhttp.open("GET", "test.xhtml", true); 
    xmlhttp.send(); 

} 

和測試XHTML頁面:

<div id="test"> 
    TEST TEXT 
</div> 
<button type="button" onclick="reloadIssues()">Change Content</button> 

JS文件被調用。

我測試了一些,它似乎「xmlhttp.onreadystatechange」總是爲空,它永遠不會進入其功能。

是否還有其他的東西可以成爲問題的代碼?也許在tomcat服務器上?

回答

2

有問題的元件具有test

<div id="test"> 

一個id但你被tester

document.getElementById("tester") 

修復它的相應定位它。


無關的具體問題,要對阿賈克斯的時候,我建議採取一個體面的框架,而不是一個homegrowing。我可以熱烈推薦jQuery做ajax作品。它是那麼容易,因爲:

<script src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script> 
    $(document).ready(function() { 
     $('#change').click(function() { 
      $.get('test.xhtml', function(responseText) { 
       $('#test').text(responseText); 
      }); 
     }); 
    }); 
</script> 

<body> 
    <div id="test">TEST TEXT</div> 
    <button id="change">Change content</button> 
</body> 

此外,結合使用Ajax和基於MVC框架,像JSF組件時,你必須採取的事情很多考慮,以保持客戶端和服務器端狀態同步中。我不會推薦自己生長。無論是升級到JSF 2.0附帶的內置AJAX魔術

<h:form> 
    <h:commandButton value="Change content" action="#{bean.change}"> 
     <f:ajax execute="@form" render=":test" /> 
    </h:commandButton> 
</h:form> 
<h:panelGroup id="test" layout="block">#{bean.text}</h:panelGroup> 

用這種方法

public void change() { 
    this.text = "new text"; 
} 

或當你仍然在JSF 1.x中,然後採取ajaxbased組件庫RichFaces的一樣,ICEfaces的,PrimeFaces等。

+0

「測試」和「測試儀」在複製粘貼時出錯。 我不知道JSF支持Ajax,我試過了,它完美的工作!我感謝幫助,謝謝:) – David 2011-04-08 11:35:34

+0

不客氣。 – BalusC 2011-04-08 11:38:03

+0

是否可以使用PrimeFaces for JSF 1.2?我認爲它只適用於JSF 2.0 – lkdg 2011-04-11 05:28:48