Results 1 to 4 of 4

Thread: Form with non ajax and ajax buttons

  1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    4
    Vote Rating
    0
      0  

    Default Form with non ajax and ajax buttons

    Hello Can I make a form button with standard Submitting and a few other buttons that will send some data using Ajax?
    If it is real tell me, please, how can this be done?
    Adding standart submits to the form make that all other buttons also using this method.

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Answers
    3931
    Vote Rating
    1272
      0  

    Default

    you can set standardSubmit on the form and the button to submit in the standard way should work by calling the submit method on the BasicForm. For your Ajax button, you can manually do an Ext.Ajax.request call to send data via Ajax.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    4
    Vote Rating
    0
      0  

    Default

    I have already done so, but does not work. this is my code:
    Code:
    Ext.require([
        'Ext.form.*',
        'Ext.loader.*',    
        'Ext.button.*'
    ]);
    Ext.Loader.setConfig({enabled: true});
    
    Ext.Loader.setPath('Ext.ux', '../ux/');
    Ext.onReady(function() {
    
    
    function ajaxButtonFunction()  {
           
    var formdesc = Ext.getCmp('description').getValue();
    
            Ext.Ajax.Request({
            url : 'ajax.php' ,
     params : { action : 'getData'},
     method: 'POST',
     success: function ( result, request ) { 
      Ext.MessageBox.alert('Success', 'Data return from the server: '+ result.responseText); 
     } ,
     failure: function () { 
      Ext.MessageBox.alert('Failed', 'Data NOT');} 
      });
            } 
       var top = Ext.create('Ext.form.Panel', {
     renderTo:'order-edit',
     style: {margin: '0px auto 15px auto'},
            frame:true,
     method: 'POST',
     url: 'addcom.php',
     standardSubmit: true,
     id: 'top',
            title: 'Some edit',
            bodyStyle:'padding:5px 5px 0',
            width: 800,
             fieldDefaults: {
                labelAlign: 'top',
                msgTarget: 'side'
            },
    
            items: [
     {
                    xtype: 'numberfield',
                    fieldLabel: 'Some number',
                    id: 'rate',
                    anchor:'90%'
                },{
            xtype: 'filefield',
            name: 'sfirstform',
            fieldLabel: 'Document',
            labelSeparator: "",
            labelWidth: 50,
            msgTarget: 'side',
            anchor: '80%',
            buttonText: 'Select file'
        },
       {
                        xtype: 'htmleditor',
                        name: 'description',
          id: 'description',
                        hideLabel: true,
                        width: 730,
                        height: 120
                      
                        }, {
                        xtype:'button',
                        text: 'Add comment',
                        name: 'addcomment',
           handler: ajaxButtonFunction          
                    }
           ],
         buttons: [{
                text: 'Save',
          handler: function() {
                        var form = top.getForm();
      form.submit();
                            }
      },{
                text: 'Delete'
            }]
        });
    
    });
    firebug writes: Ext.Ajax.Request is not a function
    What in my code wrong? How to make correctly? Help me,please!

  4. #4
    Sencha User
    Join Date
    Feb 2011
    Posts
    174
    Answers
    10
    Vote Rating
    2
      0  

    Default Case senstivity

    Replace 'R'equest by 'r'equest and I think your code should work, that is, use Ext.Ajax.request instead of Ext.Ajax.Request

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •