I want to hide a button in a window: I have tried the following code it doesn't work
var myButton = Ext.ComponentQuery.query('#mainWindow> #mytab> #submitbuttonid')[0];
myButton .setHidden(true);
Help?
You should use the hide() method to hide the component.
var myButton = Ext.ComponentQuery.query('#mainWindow> #mytab> #submitbuttonid')[0];
myButton.hide();
Do it like this:
Take the reference of the button in controller like :
myButton: 'button[name="name_of_btn"]'
And when you are adding that window to the viewport, do the below after adding:
this.getMyButton().hide();
Or you can do the above on "activate" or "initialize" event of that window.
Related
I have created a modal with a parent id of "abandon-cart-message" . The two ways I want someone to dismiss the popup is clicking outside the modal, and clicking the "x" on the top right of the modal. I created an array of those two selectors, and on click i want to add a class of "hidden". However it's not adding the class and I can't understand WHY!
//popup dismissal
const dismissSelectors = ["#abandon-cart-message .evg-overlay", "#abandon-cart-message .evg-btn-dismissal"];
Evergage.cashDom(dismissSelectors.join(",")).on("click", () => {
console.log("I HAVE BEEN CLICKED.");
const dismissPopup = document.querySelector("#abandon-cart-message");
dismissPopup.classList.add("hidden");
});
}
On click, i tried to add class "hidden" on the parent ID of my modal but it is not showing up.
Clicking on the Canvas creates a Grid that contains the Textbox. Hover over the TextBox, a Button is added in this Grid. How to check the existence of the button in the Grid, not to create a duplicate. I tried
if(!((Grid)sender).Children.Contains(Button))
{
DeleteButton deleteButton = new DeleteButton();
((Grid)sender).Children.Add(deleteButton);
}
But it's not working.
Try this:
var yourButton = ((Grid)sender).Children.OfType<Button>().FirstOrDefault();
This will return the first child of type Button if one exists.
I have panel wiht toolbar with buttons. Panel resizable when it small buttons hide in menu. In menu it show icon and value of overflowText. But on click button i need change overflowText.
expandClick: function (btn) {
var me = this;
btn.blur();
btn.overflowText = btn.overflowText === "expand" ? "reduce" : "expand";
view.fireEvent('expandGraph', view);
}
in browser's console on breckpoint i see right value but there is no change in interface. Why?!
btn.setConfig( name, [value] );
try to use this function to set specific initial configs dinamically.
Sometimes the button din't refresh his state if you modify directly the variable
Try to refresh component layout with doLayout() method after you change overflowText property.
Hello i am have form with grid and button, and when i am click button then open new form with edit records in grid. But how refer to grid from child window.
I am make this but have error:
Pricebook: function(button) {
var win = button.up('window'),
grid = win.down('grid');
}
You can use Ext.getCmp Component id. Take a look at this example:
https://fiddle.sencha.com/#fiddle/850
I have an MVC app which has a Tab Panel rendered as the only item in the viewport. Within the tabs I would like to put the same type of component, for which the event handling is equal within all tabs.
Therefore I need an ExtJS MVC Controller ref to the active tab, that would lead me to execute events on the components in the active tab. Is it possible to have such a ref?
My current approach is this:
get reference to Tab Panel
call getActiveTab()
call the controller events for the component in active tab
Is it possible to encapsulate the above 3 steps in one controller ref? Would be beautiful :-)
I'm using ExtJS 4.1.
Personally, I think controller refs are overrated. This sounds like a simple case where you can use one as you describe, but I prefer to listen to the event, and navigate from the firing component to the one I need.
In your case, assuming your tab panel contains regular ext panels, I'd do something like the following:
onButtonClick: function (button) {
var panel = button.up('panel[tab]');
if (panel) {
panel.someMethod();
}
}
The up method will find the closest ancestor that is of xtype panel and has a property named tab. If you have more specific xtypes or known properties, use those instead.
The panel should be the active one (else how was its button clicked?) but you can check that by going up another level to the tab panel and getting the activeTab there.
onButtonClick: function (button) {
var panel = button.up('panel[tab]'),
tabPanel = button.up('tabpanel'),
activeTab = tabPanel && tabPanel.getActiveTab();
if (panel && panel === activeTab) {
panel.someMethod();
}
}
Say your tabPanel has itemId: 'content'. Inside that panel you will have bunch of tabs and on each tab you will have bunch of buttons (as an example). And you want to handle all these button's click in one controller. Do I understand you correctly?
I believe that simple ref inside your controller would work:
this.control('#content button', {
click: this.buttonClicked
}
});