代码之家 › 专栏 › 技术社区 › pablov

用ExtJs截获HTML表单和值

extjs javascript-events

2

pablov · 技术社区 · 16 年前

我试图截获表单的提交,以便使用ExtJS在视口中创建Ajax请求。有些表单没有名称(或者没有Id),在许多情况下,提交按钮被一个简单的按钮更改了。

案例1:

<form action="?m=pros&a=add" method="post">
   <input type="hidden" name="project_type value='software'>
   <input type="submit" class="button" value="Add Project"/>
</form>

案例2

<form action="?m=pros&a=edit" method="post">
   <input type="button" class="button" value="Edit Project"
    onclick="javascript:doTheSubmitting(this)
   />
</form>

我的Javascript代码中有:

    initEvents : function(){
        contentPanel.superclass.initEvents.call(this);
        this.body.on('click', this.myClick, this);
    },

    myClick: function(e, target){
        /*handler for intercept click over link, submit, buttons*/

        //first issue: how to identify: link, button, submit 

        targeIstLink   = e.getTarget('a:not(.exi)', 3); //target is a Link
        targetIsForm   = target.form;                   //target is a form????

        e.stopEvent();

        /*solved*/
        if(targetIsLink){ 
          //code to ajaxify a link and 
          //load it in the viewport pannel
        }else

        /*not solved*/ 
        if(targetIsForm){
           //code to ajaxify a form and load it in the panel ViewPort
        }else
        if(targetIsFileUpload) { /*coding*/
          //code here
       }  

   },

2 回复 | 直到 6 年前

1

Thau 16 年前

算法:

switch( link )

   1. link.parent is a Form Object?              /*Parent of a submit button*/
      1.1 if True, 
            newLink = serialize( Form Object )   /*No Break clause*/
   2. newLink = formatLinkAsYouLike( link )      /*In the case of a link nodeTag='A' */ 
   Default:                                      /*both cases */ 
      a) .load(newLink, Params)
      b) handle whatever you want: onSubmit, onSuccess, onError, onEtcetera 

end Switch

2

1

pablov 16 年前

我想,解决办法就在那里。。。

initEvents : function(){
    contentPanel.superclass.initEvents.call(this);

    //This intercept any click in my application  
    this.body.on('click', this.myClicksHandler, this);

    //Once handled the clicks, intercept submits  
    this.body.on('submit', this.myBeforeSubmittingHandler, this);
},

myClicksHandler: function(e, target){
 //code here
},

myBeforeSubmittingHandler: function(e, target){

}