2013-04-29 59 views
0

我試圖爲我的窗戶,營造了登錄頁面8的應用程序,我使用HTML5和JavaScript ..所以儘量選用winjs.xhr張貼什麼是在文本框爲變量到一個特定的URL這是一個PHP腳本,所以這是我的例子中的網址「http://example.com/api/username=username&password=password」正在使用winjs.xhr將這些變量發佈到網址,但即使在console.log中也沒有得到任何響應使用WinJS.xhr張貼變量到URL

這是我的代碼

<script> 
function handlelogin(){ 
    document.getElementById("box").onsubmit = function(){ 
     if(document.getElementById("email_address").value ==""){ 
      document.getElementById("errormessage").innerHTML= "Please Provide Your Email Address"; 
      return false; 
     }else{ 
      var email_address = document.getElementById("email_address"); 
      var password = document.getElementById("password"); 
      var formparams = "?username=" + email_address.value + "&password=" + password.value; 
      document.getElementById("errormessage").innerHTML = ""; 
      WinJS.xhr({type: "POST", 
         url: "http://example.com/api/", 
         data: formparams, 
         headers: { "Content-type": "application/x-www-form-urlencoded" } 
         }).then(
          function (success) { 
           console.log(success.statusText); 
           if(success == 1703){ 
            WinJS.Navigation.navigate("home.html"); 
           } 
          }, 
          function (error) { 
           console.log(error); 
          } 
         ); 
     } 
    }; 
} 
window.onload = function() { 
    handlelogin(); 
} 
</script> 


<form id="box" method="post" name="loginform"> 
      <p>Email address</p> 
      <div class="email_address"><input type="text" id="email_address" /></div> 
      <p>Password</p> 
      <div class="password"><input type="password" id="password" /></div> 
      <p><span id="errormessage"></span></p> 
      <div class="button"><input type="submit" id="login" value="Sign In"/></div> 
      <p>ForgotPassword?</p> 
     </form> 
+0

你確定你其實並不意味着有網址在WinJS.xhr請求包括形式參數的拉'{類型:「後',網址:'http://考試ple.com/api/」 + formparams,頭:...}'? – GotDibbs 2013-04-29 19:15:22

+0

您是否嘗試過放置斷點並進行調試?儘管代碼還存在其他問題 - 請求會到達example.com,並有200個響應。 – Sushil 2013-04-30 03:47:52

回答

0

首先 - 不要使用提交按鈕。使用輸入類型=「按鈕」。無需提交,您只需閱讀頁面上的值即可。

二 - 附加的事件處理程序的按鈕的單擊事件。這樣做「的onload」的窗口是不正確的地方。

三 - 不使用「的onsubmit」你「盒子」的元素。這裏沒有表單提交。不應該有,通常是一種形式,WinJS提交 - 這是對瀏覽器發佈的網頁服務器。您已經在發佈您的數據。請參閱更新的代碼:

我強烈建議將ALL JavaScript放入單獨的文件中,因爲您將以這種方式獲得字節碼優化。內聯Javascript未針對下一次加載進行優化。你可以做到這一點的常用方法是直接在您的js文件下面的onload事件代碼(這裏我給你的onclick)像這樣

 
app.onactivated = function (args) { 
    .. 
    .. 
    .. 

    args.setPromise(WinJS.UI.processAll().then(function() { 
    document.getElementById("login").onclick = handlelogin; 
    })); 

    .. 
    .. 
    } 
}; 

但是我的回答你的問題上面:

 
<script> 
function handlelogin() { 
    if (document.getElementById("email_address").value == "") { 
     document.getElementById("errormessage").innerHTML = "Please Provide Your Email Address"; 
     return false; 
    } else { 
     var email_address = document.getElementById("email_address"); 
     var password = document.getElementById("password"); 
     var formparams = "?username=" + email_address.value + "&password=" + password.value; 
     document.getElementById("errormessage").innerHTML = ""; 
     WinJS.xhr({ 
      type: "POST", 
      url: " http://example.com/api/&quot ;, 
      data: formparams, 
      headers: { "Content-type": "application/x-www-form-urlencoded" } 
     }).then(
      function (success) { 
       console.log(success.statusText); 
       if (success == 1703) { 
        WinJS.Navigation.navigate("home.html"); 
       } 
      }, 
       function (error) { 
        console.log(error); 
       } 
     ); 
    } 
}

window.onload = function() { document.getElementById("login").onclick = handlelogin; }; </script>

檢查出一些應用程式製作環節中,他們討論的JavaScript項目http://aka.ms/stackbuilder