Is there a way to change a tooltip text from a Tool placed in a panel? I looked at the ToolTip object and QuickTip but neither have a function like setTipText()
Thanks, Y_Y
I wasn't able to put an itemId on my tooltip, so I was able to dynamically update the tooltip of a tool this way:
var toolTip = Ext.get(tool.getEl().id + '-toolEl');
toolTip.set({
'data-qtitle': 'New Tooltip Title', //this line is optional
'data-qtip': 'Updated Tool Tip!'
});
I have two solutions for your problem!
Change HTML-attribute
toolTip=Ext.ComponentQuery.query('tooltip[itemId=myToolTip]')[0];
toolTip.html = "This is the new text!";
toolTip.setTitle("new Title");
toolTip.render();
Destroy the old one and make a new one...
tooltip.destroy();
var config = {
target: 'bottomCallout',
anchor: 'top',
anchorOffset: 85, // center the anchor on the tooltip
html: "Fancy new ToolTip with a totally different config..."
};
Ext.create('Ext.tip.ToolTip', config);
Related
I have the following code for adding tooltip for onclick of a span id as shown below:
new dijit.Tooltip({
connectId: ['gridEditHelp'],
label: 'Double click on an item in the below table to perform inline editing of attributes',
position: ['above']
});
The problem is that I want the tooltip to be visible always on the web page.
Any ideas or existing API available for the same?
Use TooltipDialog instead - or else you will have to mess with the _MasterTooltip manager (there's more or less only one global, reusable tooltip). Then call dijit.popup.open - and never call .close
dijit.popup.open({
popup: new TooltipDialog({
id: 'myTooltipDialog',
style: "width: 300px;",
content: "<p>I have a mouse leave event handler that will close the dialog."
});,
around: dojo.byId('thenode')
});
I have an issue here. A new window is defined in a separate js file. And I want to add a menu to this window. So I used the following code:
var menu = Titanium.UI.Android.OptionMenu.createMenu();
var item1 = Titanium.UI.Android.OptionMenu.createMenuItem({
title : 'Item 1',
icon : '/images/item1.png'
});
var item2 = Titanium.UI.Android.OptionMenu.createMenuItem({
title : 'Refresh',
icon : '/images/refresh.png'
});
menu.add(item1);
Titanium.UI.Android.OptionMenu.setMenu(menu);
In doing so, the application has crashed. Could anyone help me figure this out?
thanks in advance!
NOTE: Developing Android application using Appcelerator.
always remember Set the menu on the current heavyweight window.
To create a heavyweight window, specify one or more of
fullscreen,
navBarHidden,
modal
otherwise you can use you app.js file this is working.... with specify this property.
var menu = Titanium.UI.Android.OptionMenu.createMenu();
var item1 = Titanium.UI.Android.OptionMenu.createMenuItem({
title : 'Item 1',
icon : '/images/item1.png'
});
item1.addEventListener('click', function(){
Ti.UI.createAlertDialog({ title : 'You clicked Item 1'}).show();
});
var item2 = Titanium.UI.Android.OptionMenu.createMenuItem({
title : 'Refresh',
icon : '/images/refresh.png'
});
item2.addEventListener('click', function(){
Ti.UI.createAlertDialog({ title : 'You clicked Refresh'}).show();
});
menu.add(item1);
menu.add(item2);
// Set the menu on the current heavyweight window. A heavyweight window maps to an Android
// Activity. To create a heavyweight window, specify one or more of [**fullscreen**,**navBarHidden**,**modal**] to createWindow.
Titanium.UI.Android.OptionMenu.setMenu(menu);
I want to update the toolbar's content of the main view from a subview (HotelApp.views.hotelDetail)
This is my toolbar from HotelApp.views.mainView
this.topBar = new Ext.Toolbar({
dock:'top',
id:'main_page_topbar',
title:'H10 Sencha Demo',
items:[this.back,
{xtype: 'spacer'}
]
});
The toolbar already have a back button. The problem is i can see the shape of a button, but no text either ID. What i'm doing wrong??
I use this code:
var toolbar = HotelApp.views.mainView.getDockedItems()[1];
var images = new Ext.Button({
text:'Images',
id:'images',
ui:'drastic'
})
toolbar.setTitle(record.get('nombre'));
toolbar.add({items: images});
toolbar.doLayout();
Thanks!!!
I think that your problem is only that you have to add your button calling
toolbar.add(images);
instead of
toolbar.add({items: images});
I even suggest you to don't use 'id' config for your components but 'itemId'.
In this way you can always get your views components by calling
myView.getComponent('myComponentItemId');
or
myView.getDockedComponent('myComponentItemId');
for DockedComponents like toolbars.
Hope this helps.
As title, how to make this? I have already done drag and drop using dnd.Source and dnd.Target. Have no idea if it possible to make it when drop and it creates/generates a div which it can closable.
I think it would be possible to hook up to the onDndDrop event of your dnd.Target by doing some along these lines:
dojo.connect(yourtarget, "onDndDrop", _dndHandler);
Then in the _dndHandler function you could create a new div using the dojo.create and dojo.place:
var newdiv = dojo.create("div", { innerHTML: "This is my new div" });
dojo.place(newdiv, dojo.byId("your_target_id", "first"));
Hope it helps
/Daniel
i have a module. I need it to be able to display a modal dialog.
Seems like I need to inject a div into the main DOM and then parse it. Is this the right approach. Are there samples (or even a util- seems like this would not be that uncommon)
There are samples for almost everything in DojoCampus and in the tests directory:
var pane = dojo.byId('thirdDialog');
thirdDlg = new dijit.Dialog({
id: "dialog3",
refocus:false,
title: "Programatic Dialog Creation"
},pane);
Note that this particular widget doesn't need to be inserted to the DOM manually - it appends itself to the end of the page. Here the second parameter to the Dialog constructor - pane - is a reference to the node whose content should be displayed inside the Dialog.
UPDATE: Based on the new information you should try this:
dojo.require("dijit.Dialog");
dojo.addOnLoad(function() {
secondDlg = new dijit.Dialog({
title: "Programatic Dialog Creation",
style: "width: 300px",
content: "Insert text here"
});
secondDlg.show()
});
As shown here, you can pass Dialog content in the content attribute. (This sample is executable in FireBug on any page that includes Dojo.)
UPDATE: So, you want to have a form inside the Dialog? Nothing special here. Hey, you can even have a dijit form over there! Be sure to check out that DojoCampus article on Dialogs to learn how Dialog can communicate with a dijit form.
dojo.require("dijit.Dialog");
dojo.require("dijit.form.TextBox");
dojo.addOnLoad(function() {
secondDlg = new dijit.Dialog({
title: "Programatic Dialog Creation",
style: "width: 300px",
content: "<h2>Sample Form</h2>" +
"name: <input dojoType='dijit.form.TextBox' type='text' name='name' id='name'>"
});
secondDlg.show()
});
(Again this sample is executable in FireBug on any page that includes Dojo.)