I am working in Extjs. I have fileuploadfield. It shows default browser tooltip as 'no files chosen' in chrome and 'no files selected'in firefox.
I want to disable or hide this tooltip. So how to perform this in extjs. Please help me.
You can add a buttonConfig to your filefield object and specify these settings to get around the default for Chrome. I haven't yet been able to find a way to get rid of it in Firefox.
{
xtype: 'filefield',
buttonConfig: {
xtype: 'filebutton',
text: 'MyButton',
tooltip: ' ',
tooltipType: 'title'
}
}
Related
I have an textfield in Sencha Touch 2 and a button. I would like to get the input of the textfield when button is pressed. I tried it with Ext.ComponentQuery, but it didn't work. Have someone an example how to do that?
{
xtype: 'textfield',
cls: 'inputfields',
id: 'title',
},
{
xtype: 'button',
ui: 'action',
name: 'textfieldButton',
handler : function(){
// what should go here ?
}
}
My way of doing it is Ext.getCmp('title').getValue();
Also please refer to the Docs (Docs API). They are really Helpful.
You could do:
var value = Ext.ComponentQuery.query('#title')[0].getValue();
// test by writing in console
console.log(value);
TIP 1: It's helpful to have API reference of Sencha open all the time when you use this framework (likewise for any other framework, programming language etc.). For speed, I suggest downloading it.
TIP 2: In Chrome Ctrl+Shift+I for developer tools; you can access console there.
I am trying to remove the toolbar from Sencha Picker (I only need the scrolling area with the event 'pick') - but nothing seems to work. The problem is that we must copy the sencha docs code of Picker (WITH slotpicker code) and try to remove it from there. However - this doesn't work and removed the whole slot area.
Can anyone help?
Just set the toolbar invisible
toolbar: {
hidden: true
}
BTW why not just to do
doneButton: false,
cancelButton: false,
toolbar: {
ui: 'light',
title: 'My Picker!'
}
?
I have an Ext TabPanel, and I am trying to set the hidden property for one of the Tabs, programmatically. I am able to select the object and call methods such as disable() and enable() but so far have been unable to find a means by which I can manipulate the Tab's 'hidden' property.
The Tab is defined as
{
id: "view-task",
hidden: false,
title: "View"
}
and the code attempting to manipulate it
twin = ( Ext.getCmp('view-task'));
twin.disable();
The above call to disable works, so the component is being correctly selected but I do not know how to manipulate the hidden property.
Any assistance will be much appreciated.
N. Euzebe
Try this:
var tabs = Ext.createWidget('tabpanel', {
items: [{
itemId: 'home',
contentEl:'script',
title: 'Short Text',
closable: true
}]
});
tabs.child('#home').tab.hide();
You can find this code in examples on the API page
You haven't explained which version of ExtJS you're using. But in version 3.x you can do the following (I don't know, but it might also work in ExtJS 4.x):
var tabPanel = Ext.getCmp('myTabPanel');
var tabToHide = Ext.getCmp('myTab');
tabPanel.hideTabStripItem(tabToHide);
To show the tab again:
tabPanel.unhideTabStripItem(tabToHide);
Hope this helps you :)
Can someone tell me how to get rid of the feature that filters combo box items.
when i click on the trigger of the combo, i want to display ALL menu items regardless of what text is already in the box, NOT filtered. I've tried several different config options with no luck.
make sense ?
for example, if i have 'View' as my text in the combo, and i click on the trigger, it will only show 'View1' and 'View2' items, i want it to include all the others...
Thanks!
heres my current config
{
...
items: [{
xtype: 'combo',
id: 'myViewsCombo',
emptyText: 'Select View',
selectOnFocus: true,
listeners: {
select: function(combo, record, index) {
L3.handlers.loadView(combo.value);
}},
store: ['View1', 'View2','blahblah']
}]
}
Setting triggerAction: "all" solved the same problem for me.
Try the setting the 'disableKeyFilter' config option to true.
See the ext combobox api.
I have a combobox inside of a ext.panel, inside of an ext.window. When I click the down arrow to show the possible SELECT options, the options pop up at the top-left of the browser window, instead of below the SELECT box. The funny thing is if I attach the drugDetailsPanel (see code below) to a div on the page (instead of inside an ext.window), the combobox works correctly. This also happens when I change ext.panel to ext.form.formpanel, by the way.
Any ideas?
My code:
drugDetailsPanel = new Ext.Panel({
layout:'form',
id:'drug-details-panel',
region:'center',
title:'Drug Details',
height:200,
collapsed:false,
collapsible:false,
items:[
new Ext.form.ComboBox({
fieldLabel:'What is the status of this drug?',
typeAhead:false,
store:drugStatusStore,
displayField:'lookup',
mode:'remote',
triggerAction:'all',
editable:false,
allowBlank:false,
emptyText:'Select a status..',
name:'/drug/drug-status',
id:'drug-status'
})
]
});
newDrugWindow = new Ext.Window({
title: 'Add Drug',
closable:true,
width:650,
height:650,
//border:false,
plain:true,
layout: 'border',
items: [drugDetailsPanel],
closeAction:'hide',
modal:true,
buttons: [
{
text:'Close',
disabled:false,
handler: function(){
newDrugWindow.hide();
}
},
{
text:'Save Drug',
handler: function(){
newDrugDialog.hide();
}
}]
});
Try to add shim: true to combo-box control.
Older versions of Ext had issues like this in certain browsers (FF 2.x) in certain situations dealing with nested positioning, the specifics of which escape me now. If that's the case, search the Ext forums for more info. If not, then I'm not sure...
This forum thread helped me: http://www.sencha.com/forum/showthread.php?177677-IE-displays-combobox-dropdown-in-the-top-left-corner-of-browser-window
Just give the combobox a (unique) name. Giving the combobox an inputId should also help
Seems like IE does not respect the position of the element if it does not have an explicit name/inputId. This thread goes more deeply into it: http://www.sencha.com/forum/showthread.php?154412-Combo-Box-options-appears-in-Top-Left-Corner-in-IE-9