Hello, I'm new to using Ext JS and am having the hardest time doing such a simple, simple thing. Normally I would perform this task in jQuery since it's what I code with, and have been for over a year, but even that is having no effect.
I have a form that is being created using Ext.FormPanel. My buttons attribute contains two buttons: Save and Cancel. By default I want Save to be disabled when the form is loaded because I want to validate the required fields before allowing the user to submit. My validation is in place, and all that's left is to determine if the button should be enabled or disabled. Here's the buttons setup:
Initially I was under the impression that cRegisterSave would be the id of my button, so I kept trying to modify that element's attributes, but no dice. I eventually realized that id of the button was generated in some type of order, while the specified id was applied to the table it was contained in. I've gone as far as trying to apply specific attributes to the button using its id (ext-gen39), but again, I'm not getting the desired results. I have the functionality in place to track validation on required fields and when to check if all fields are valid to allow the form to be submitted:
valid's value is either true or false and ext-gen39 is the id of the button. I'm using jQuery to disable it, yet it doesn't disable and I can still click on it. It's been a pretty frustrating experience trying to learn how to effectively use Ext JS for such a simple task. While the API is chock full of information, it took me about 30 minutes to finally find out how to properly select cRegisterSave (not from ExtJS.com). I really feel that it lacks the simplistic examples that something like jQuery has, where it's all there in front of you to see how to accomplish 'this', 'that' and 'that' in a minute or two, if not seconds. Anyways, this is somewhat of a lament, but I really want to figure out how to properly and effectively get this working because the web app is going to heavily use ExtJS, so the more I know, the better.
$('#ext-gen39').attr('disabled', (valid ? false : true)).parent().attr('unselectable', (valid ? 'off' : 'on'));