Search code examples
javascriptformsservletsextjsextjs4

extjs4: how to submit the same form data twice


I have an input form with 2 buttons, submit and save. Initially both buttons will be disabled. Once,the user enters the data, the submit button will be enabled and he submits the form,which goes to the servlet for validating(By validating,I mean I send the userID and password to check if it is existing in the database)

Here is my handler for submit button:

validateForm: function(button){
        console.log('Validatingform');
        var formData=button.up('form').getForm();
        if(formData.isValid()){
            Ext.Ajax.request({
                url : 'MyServlet',
                params : {
                    inputData:Ext.encode(formData.getValues()),
                    validate:"valid"
                },
                scope : this,
                success : this.onValid,
                failure : this.onInvalid
            });
        }
    },

onValid: function(response,button){
        console.log("Valid");
        //on valid-enable save button,disable submit button
        Ext.getCmp('myFormSubmit').setDisabled(true);
        Ext.getCmp('myFormSave').enable();

    },

After checking for validation. In the OnValid method, I enable the save button and click on save button to save the form data now.

But since,the form was already submitted,the input to my servlet is "null".

I am not sure on how to hold this form data entered by the user for multiple submits. Can anyone please guide me on solving this.

Thanks in advance


Solution

  • Would something like saving the data on the button/form be suitable? Probably not the best idea but it's a thought

        validateForm: function(button){
        console.log('Validatingform');
        var formData=button.up('form').getForm();
        if(formData.isValid()){
            //
            if (!button.savedData){
                button.savedData = formdata;    
            }
    
            //
            Ext.Ajax.request({
                url : 'MyServlet',
                params : {
                    inputData:Ext.encode(formData.getValues()),
                    validate:"valid"
                },
                scope : this,
                success : this.onValid,
                failure : this.onInvalid
            });
        }
    },
    
    onValid: function(response,button){
        console.log("Valid");
        var submitBtn = Ext.getCmp('myFormSubmit');
    //on valid-enable save button,disable submit button
        submitBtn.setDisabled(true);
        Ext.getCmp('myFormSave').enable();
        if (submitBtn && submitBtn.savedData){
            formdata = submitBtn.savedData;
            delete submitBtn.savedData;
       }
    //
    },
    
    onInvalid: function(response,button){
        var submitBtn = Ext.getCmp('myFormSubmit');
        if (submitBtn && submitBtn.savedData){
            formdata = submitBtn.savedData;
            delete submitBtn.savedData;
         }
    }