views:

77

answers:

2

I'm trying to intercept the submission of a form in order to create an Ajax request in a Viewport using ExtJS. Some forms have no name (or not Id) and in many cases the submit button has been changed by a simple buttom.

case 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>

case 2

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

I have in my javascript code

    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
       }  

   },    

thks in advance for the help

+1  A: 

algoritm:

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
Thau
Thanks Thau.I found the solution to identify by the submit actions; but still fighting on how send --using ajax-- the form and assign the response to a Tab. The form has hidden fields and one only button to send the hidden values, when I receive the response a 302 error is received.
P.j.Valle
+1  A: 

I figure it out, the solution was there ...

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){

} 
P.j.Valle