ExtJS 4 recaptcha表格

我已經設置了一個鍵，並且可以讓recaptcha在頁面上顯示它自己，但我不知道如何將它變成表單。ExtJS 4 recaptcha表格

其實我不想使用一個id，因爲我稍後會在應用程序內部重複使用它，所以要使用itemId將是首選。我假設該元素尚未創建。

我包括： HTML代碼：（從recaptcha_ajax.js產生不能獲得ID爲 '驗證碼' 控制）

<script type="text/javascript" src="http://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

錯誤：遺漏的類型錯誤：無法設置屬性 '的innerHTML'空

下面的代碼：

Ext.define('Login.view.Login', { 
extend: 'Ext.form.Panel', 
alias: 'widget.Login.view.Login', 


border: false, 
bodyPadding: 5, 


initComponent: function() { 


    var config = { 
     layout: 'anchor', 
     defaultType: 'textfield', 
     defaults: { 
      anchor: '100%', 
      allowBlank: false 
     }, 
     items: [{ 
      fieldLabel: 'Company Id', 
      name: 'companyId' 
     },{ 
      fieldLabel: 'Username', 
      name: 'username' 
     },{ 
      fieldLabel: 'Password', 
      name: 'password', 
      inputType: 'password' 
     },{ 
      /*xtype: 'panel', 
      itemId: 'reCaptcha', 
      border: false,*/ 
      html: '<div id="recaptcha">adsf</div>' 
     }], 
     buttons: [{ 
      text: 'Login' 
     }] 
    }; 
    Ext.apply(this, config); 


    this.callParent(); 
}, 
afterRender: function() { 
    Recaptcha.create("heres_my_public_key", 
     document.getElementById('recaptcha'), 
     { 
      theme: "clean"/*, 
      callback: Recaptcha.focus_response_field*/ 
     } 
    ); 
    this.callParent(); 
} 
});

人這樣做使用ExtJS的4？

來源

2011-10-15 Asken

請不要在您的帖子中使用外部鏈接。如果他們打破了整個職位是毫無價值的... – sra

指出。其實很有趣。煎茶今天下來...並仍然下降。 – Asken

captcha創建過早。解決方案：

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <link rel="stylesheet" href="ext-4.0.6/resources/css/ext-all.css" type="text/css"> 
    <link rel="shortcut icon" type="image/png" href="../Icon.png"> 
    <script type="text/javascript" src="ext-4.0.6/ext-all-debug.js"></script> 
    <script type="text/javascript" src=""></script> 
    <script type="text/javascript"> 

Ext.define('Login.view.Login', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.Login.view.Login', 

    border: false, 
    bodyPadding: 5, 

    initComponent: function() { 

     var config = { 
      layout: 'anchor', 
      defaultType: 'textfield', 
      defaults: { 
       anchor: '100%', 
       allowBlank: false 
      }, 
      items: [{ 
       fieldLabel: 'Company Id', 
       name: 'companyId' 
      },{ 
       fieldLabel: 'Username', 
       name: 'username' 
      },{ 
       fieldLabel: 'Password', 
       name: 'password', 
       inputType: 'password' 
      },{ 
       xtype: 'panel', 
       itemId: 'reCaptcha', 
       border: false, 
       html: '<div id="recaptcha">adsf</div>', 
       listeners:{ 
        { 
         console.log(Ext.getDom(this.body)); 
         Recaptcha.create("heres_my_public_key", 
          Ext.getDom(this.body), 
          { 
           theme: "clean", 
           callback: Recaptcha.focus_response_field 
          } 
         ); 
        } 
       } 
      }], 
      buttons: [{ 
       text: 'Login' 
      }] 
     }; 


     Ext.apply(this, config); 

     this.callParent(); 
    }/*, 
    afterRender: function() { 
     var captchaEl = Ext.get('recaptcha'); 
     console.log(captchaEl); 
     Recaptcha.create("heres_my_public_key", 
      document.getElementById('recaptcha'), 
      { 
       theme: "clean", 
       callback: Recaptcha.focus_response_field 
      } 
     ); 
     this.callParent(); 
    }*/ 
}); 

// entry point 
Ext.onReady(function() { 
    var l = Ext.create('Login.view.Login', {renderTo:Ext.getBody()}); 
}); // eo onReady 

</script> 
</head> 
<body> 
</body> 
</html>

來源

2011-10-19 09:36:08 Asken

//創建reCaptcha div後調用以下幾行。

< DIV ID = 「驗證碼」> </DIV>

如果（$（「＃驗證碼」）。長度> 0）

 showRecaptcha("reCaptcha");

功能showRecaptcha（元件）{

$.getScript('http://www.google.com/recaptcha/api/js/recaptcha_ajax.js', 
    function() { 
     Recaptcha.create("your public key", element, { 
      theme: "red", 
      callback: Recaptcha.focus_response_field 
     }); 
    });

}

來源

2013-06-20 10:27:56

已經很久以前回答了，並且不是真正的問題答案... – Asken

ExtJS 4 recaptcha表格

回答

相關問題