2015-07-03 94 views
2

我正在使用Polymer的鐵形式組件來提交我創建的這個表單,但問題是來自php腳本的響應不會輸出到實際的html。我被困在如何做到這一點,並嘗試了許多不同的事情。我究竟做錯了什麼?這裏是我的scrpits:聚合物鐵形式的響應

<dom-module id="user-signup"> 
    <template> 
     <form is="iron-form" id="formGet" method="post" action="/core/register.php"> 
     <paper-input char-counter autoValidate="true" error-message="{{item.error_name}}" label="Username" maxlength="25" required name="username"></paper-input> 
     <paper-input char-counter error-message="{{error_displayn}}" label="Display Name" maxlength="35" required name="displayname"></paper-input> 
     <paper-input char-counter error-message="{{error_password}}" label="Password" maxlength="25" required type="password" name="password"></paper-input> 
     <paper-input char-counter error-message="{{error_password}}" label="Confrim Password" maxlength="25" required type="password" name="cfmpassword"></paper-input> 
     <gold-email-input class="paper-input-input" label="Email" required name="email" auto-validate error-message="{{error_email}}"></gold-email-input> 

     <br /> 

     <br> 

     <paper-button raised onclick="clickHandler(event)"><iron-icon icon="check"></iron-icon>Submit</paper-button> 
    </form> 

</template> 

<script> 

    function clickHandler(event) { 
     Polymer.dom(event).localTarget.parentElement.submit();   
    } 

    Polymer({ 
     is: 'user-signup', 
     properties: { 
      error_name: { 
       type: String, 
       value:"Username Is Invalid!" 
      }, 
      error_displayn: { 
       type: String, 
       value:"Display Name Is Invalid!" 
      }, 
      error_password: { 
       type: String, 
       value:"Password Is Invalid!" 
      }, 
      error_email: { 
       type: String, 
       value:"Email Is Invalid!" 
      } 
     }, 

     listeners: { 
      'iron-form-response': 'formResponse', 
      'iron-form-submit': 'formSubmit', 
      'iron-form-error': 'formError' 
     }, 
     formSubmit: function(event) { 
      var pmn = document.querySelector('#waitForResponse'); 
      pmn.setAttribute("opened", "true"); 
      console.log("Form was submitted"); 

     }, 
     formResponse: function(event) { 
      setTimeout(function(){ 
      var pmn = document.querySelector('#waitForResponse'); 
      pmn.removeAttribute("opened"); 
      }, 5000) 
      console.log('There was a response'); 
      var response = event.detail; 
      alert(response);     
     }, 
     formError: function(event) { 
      console.log('Form Error, no actual response'); 
      setTimeout(function(){document.querySelector('#errorToast').show(); 
      var pmn = document.querySelector('#waitForResponse'); 
      pmn.removeAttribute("opened"); 
      }, 5000) 
     } 
    }); 
</script> 
</dom-module> 

現在的偵聽器的工作,當有來自PHP頁面的響應,警告彈出,但它說:[Object對象。下面是PHP腳本:

<?php 
    $data[] = array(
     "id" => $id, 
     "error_name" => $error_name, 
     "success" => true 
    ); 

    echo 'dd'; 
?> 

我試圖呼應$data爲JSON,但什麼也不能工作。我試圖在谷歌和堆棧上搜索它,但沒有發現任何東西。我究竟做錯了什麼?

+0

哪裏是實際連接到服務器的XHR請求?接口是否真的把WIRE上的jsonRepose放回客戶端。爲什麼不在curl發佈登錄和測試之前進入聚合物代碼 –

+0

@RobertRowntree當我按下提交時,它會提出請求「/core/register.php?username=h&displayname=h&password=h&cfmpassword=h&email=hjk%40gklj。 com「,響應是[[{」id「:null,」error_name「:」你選擇的用戶名已經存在。「,」success「:true}]'這裏有一對截圖[截圖1](http ://prntscr.com/7oa7hk)[截圖2](http://prntscr.com/7oa7je) – user3339454

+0

響應如圖所示不合法json –

回答

4

根據the docs你已經將你的監聽器綁定到一個主機元素,而不是形成自己。

也許這將幫助:

listeners: { 
     'formGet.iron-form-response': 'formResponse', 
     'formGet.iron-form-submit': 'formSubmit', 
     'formGet.iron-form-error': 'formError' 
    } 
0

什麼模型對象,你的成功的登錄調用PHP會返回?

您可以使用以下cosume的JSON回來JS承諾內

$myPhpCallLogon.then(function(user) { 
    user.firstName... 
    user.id... 
    user.email... 

    var polyListUser = document.querySelector('#userView'); 

    set watch vars in polyListUser element.... 
} 

,然後用戶模板拿到姓名,ID,電子郵件等成顯示用戶的元素的DOM。

+0

我將如何去添加此? – user3339454

+1

關於鐵形式似乎只有問題,沒有答案。任何人都可以確認鐵形式是否真的有效?我從來沒有見過任何地方的工作案例,沒有工作的例子,沒有工作文件......只是很多未回答的問題。有人知道應該返回什麼嗎?我得到的只是HTMLElement - 根本沒用。 – Typel