0

私はextjsでプロジェクトを行っています。キャプチャコードチェック付きの登録フォームをデザインしています。extjsで直接キャプチャを実行するための情報は見つかりませんでした。だから私はjavascriptを使用してキャプチャコードを作成しようとしていますが、このjavascriptキャプチャをextjsに統合したいと思います。私はjavascriptキャプチャコードを持っています-

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"                   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     <html xmlns="http://www.w3.org/1999/xhtml" >
     <head>
     <title>BotBoot</title>

     <script type="text/javascript">
      var a = Math.ceil(Math.random() * 10);
      var b = Math.ceil(Math.random() * 10);       
      var c = a + b
      function DrawBotBoot()
     {
        document.write("What is "+ a + " + " + b +"? ");
        document.write("<input id='BotBootInput' type='text' maxlength='2'   size='2'/>");
     }    
     function ValidBotBoot(){
     var d = document.getElementById('BotBootInput').value;
     if (d == c) return true;        
     return false;
     }
     </script>


    </head>
    <body>

    Are you human?<br />

    <script type="text/javascript">DrawBotBoot()</script>
    <input id="Button1" type="button" value="Check" onclick="alert(ValidBotBoot());"/>
    </body>
    </html>

このjavascriptをextjsに統合するために、私は別のCaptcha.jsファイルをas=として作成しました。

Ext.define('Balaee.view.sn.user.Captcha',   {
extend: 'Ext.container.Container',
alias: 'widget.captcha',
initComponent: function(config){
    this.a = Math.ceil(Math.random() * 10);
    this.b = Math.ceil(Math.random() * 10);       
    this.c = this.a + this.b;
},

DrawBotBoot: function(){

},

ValidBotBoot: function(){

}
});

そして、それを私の登録フォームに含めるために、私は使用しています-items:[{xtype:'captcha'、
}]

しかし、私は何の出力も得ていません。では、JavaScript関数のDrawBotBootとValidBotBootをextjsに変更する方法は?登録フォームでこのキャプチャを取得するには、さらにどのような変更を行う必要がありますか?私はextjsを初めて使用します。誰か助けてもらえますか?

4

1 に答える 1

2

了解しました。コードを作成しました。テストしませんでしたが、動作するはずです:)

Ext.define('Balaee.view.sn.user.Captcha',   {
    extend: 'Ext.container.Container',
    alias: 'widget.captcha',

    renderTo: Ext.getBody(),

    initComponent: function(config){
        var me = this;
        me.inputField = Ext.create('Ext.form.field.Text',{
            name: 'BotBootInput',
            fieldLabel: 'BotBootInput'
        });

        me.checkButton = Ext.create('Ext.Button', {
            text: 'Check',
            handler: function(btn){
                alert(me.ValidBotBoot());
            }
        });

        me.DrawBotBoot();

        Ext.apply(me, {
            items: [me.inputField, me.checkButton]
        });
        me.callParent(arguments);
    },

    DrawBotBoot: function(){
        this.a = Math.ceil(Math.random() * 10);
        this.b = Math.ceil(Math.random() * 10);       
        this.c = this.a + this.b;
        this.inputField.fieldLabel = "What is "+ this.a + " + " + this.b +"?");
    },

    ValidBotBoot: function(){
        var d = this.inputField.getValue();
        if (d === this.c){ 
            return true; 
        } else {
            return false;
        }
    }
});

//instantiate
var captcha = Ext.widget('captcha');
//to renew the captcha use captcha.DrawBotBoot
于 2013-01-10T13:08:25.243 に答える