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表格

回答

相关问题