1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    1
    Vote Rating
    0
    codeathome is on a distinguished road

      0  

    Default Unanswered: Correct use of the id parameter

    Unanswered: Correct use of the id parameter


    Hi everyone. I'm new to Ext and am currently checking it out to see if I can use it in my future projects. I'm running into one snag.

    I have need to access the HTML DOM created by Ext using an external application. When I set the id parameter of a button, the id is added to the surrounding div element instead of the button itself. This example is taken from examples/form/contact-form.js.

    Code:
                    buttons: [{
                        text: 'Cancel',
                        handler: function() {
                            this.up('form').getForm().reset();
                            this.up('window').hide();
                        }
                    }, {
                        text: 'Send',
                        id: 'SendButton',
                        handler: function() {
                            if (this.up('form').getForm().isValid()) {
                                // In a real application, this would submit the form to the configured url
                                // this.up('form').getForm().submit();
                                this.up('form').getForm().reset();
                                this.up('window').hide();
                                Ext.MessageBox.alert('Thank you!', 'Your  inquiry has been sent. We will respond as soon as possible.');
                            }
                        }
                    }]
    This is the resulting HTML:

    HTML Code:
    <div id="SendButton"  class="x-btn x-box-item x-toolbar-item x-btn-default-small x-noicon  x-btn-noicon x-btn-default-small-noicon" style="margin-left: 0px;  margin-bottom: 0px; margin-right: 0px; margin-top: 0px; width: 75px;  left: 301px; top: 0px; ">
        <em class id="ext-gen1061">
            <button type="button" hidefocus="true" role="button" autocomplete="off" id="ext-gen1060" style="width: 69px; ">
                <span class="x-btn-inner" style="width: 69px; " id="ext-gen1062">Send</span>
                <span class="x-btn-icon" id="ext-gen1063"></span>
            </button>
        </em>
    </div>
    Is there a way to get Ext to put that id into the <button> tag instead?

  2. #2
    Sencha User skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,344
    Answers
    498
    Vote Rating
    249
    skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of

      0  

    Default


    That's a bit of an abuse of component ids.

    Doesn't your external application support a CSS-style syntax for grabbing child elements rather than needing everything to have an id?

    It looks like ExtJS 4.0.6 does assign an id to the button, take a look at the renderTpl in here:

    http://docs.sencha.com/ext-js/4-0/so...-button-Button

    Seems that wasn't in 4.0.2 though. You could do some tricks to add it (such as overriding the renderTpl) but I'd say it's a dangerous road to go down, twisting the framework to fit in with some external application.

  3. #3
    Ext JS Premium Member tvanzoelen's Avatar
    Join Date
    Apr 2008
    Location
    Groningen - Netherlands
    Posts
    1,108
    Answers
    83
    Vote Rating
    31
    tvanzoelen has a spectacular aura about tvanzoelen has a spectacular aura about tvanzoelen has a spectacular aura about

      0  

    Default


    It's strange, other formfield components have the same id value at dom level. Why is the Button different?

  4. #4
    Sencha User skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,344
    Answers
    498
    Vote Rating
    249
    skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of skirtle has much to be proud of

      0  

    Default


    I don't see any difference.

    Try putting an id on a textfield. You'll see the id is placed on the surrounding div element. This is exactly the same as what happens with a button. It is important to realize that ExtJS components do not map directly onto their HTML equivalents: a textfield isn't just an HTML input box and a button isn't just an HTML button. Generally the id is placed on the outermost element for a component, the one returned by comp.getEl().

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar