enter code herevar text ='Fill' ;
if(value != undefined && value !=''){
text = Ext.Date.format(value,'Y-m-d');
}
return ' '+text+' '
this above code is link to a new page when clicking 'Fill' link . i need that 'Fill' link to be as a button. How do i define a button instead of a text as a link using extjs
The code is simple with JavaScript:
var btnLink = new Ext.Button({
text: 'Fill',
handler: function(){
//you can put here any controls
window.open("http://your-link-here.com", "_self")
}
});
This will act as href opening link on the same page, and if you want to open it on a new window you can try window.open(url) instead..
My implementation of LinkButton for ExtJS. It can be used as a link directly (set 'stopEvent' to false) or as a button (use subscription to 'click' event)
LinkButton for ExtJs
Related
I want to open a dialog box when clicking on a cell.I am using dgrid/editor.
editor({field: "column1",label: "col1",editor: "text",editOn: "click"})
I am getting text box when using the above code.I want a dialog box.Please tell me how to get a dialog box.I am using OndemandGrid with JSONReststore to display the grid.
You don't need use editor to trigger a dialog, use click event on a cell is ok:
var grid = new declare([OnDemandGrid,Keyboard, Selection])({
store: Observable(new Memory({data: []}))
}, yourGridConatiner);
grid.on(".dgrid-content .dgrid-cell:click", function (evt) {
var cell = grid.cell(evt);
var data = cell.row.data;
/* your dialog creation at here, for example like below */
var dlg = new Dialog({
title: "Dialog",
className:"dialogclass",
content: dlgDiv //you need create this div using dojo.create or put-selector
});
dlg.show();
});
If you want show a pointer while mouse over that cell, you can style it at renderCell method with "cursor:pointer"
From the wiki:
editor - The type of component to use for editors in this column; either a string specifying a type of standard HTML input to create, or a Dijit widget constructor to instantiate.
You could provide (to editor) a button that pops up a dialog when clicked, but that would probably mean two clicks to edit a cell: one to focus or enter edit mode or otherwise get the button to appear and one to actually click the button.
You could also not bother with the editor plugin and attach a click event handler to the cell and pop up a dialog from there. You would have to manually save the changes back to your store if you went that route.
If I understand you right - you could try something like this:
function cellFormatter1(value) {
//output html-code to open your popup - ie. using value (of cell)
}
......
{field: "column1",label: "col1", formatter: cellFormatter1 }
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);
I can markup a Heading or ListItem to have a moveTo attribute and that transition works perfectly.
Is there a way perform a transition to a named view programmatically say, on a button click?
Somewhere on the net I found below code, but its not working. I need something similar to this -
function moveTo(){
var w = dijit.byId('currentView');
w.performTransition('#newView',1,"fade",null);
}
This code sample registers an onclick event handler on a button with the id "ButtonID". After pressing the button, a lookup in the dijit registry will be performed to find the displayed view.
You can call the function performTransition(...) on any dojox.mobile.View.
require(["dijit/registry"], function(registry) {
dojo.ready(function() {
// Button Listener
registry.byId("ButtonID").on("click", function(){
var oldView = dijit.registry.byId("ID_View1");
oldView.performTransition("ID_View2", 1, "slide", null);
});
});
But:
Changing "moveTo" parameters programmatically is much more difficult than performing transitions between views. You have to do some nasty things to override the moveTo Attribute of a widget like for example a Backbutton in a dojox.mobile.Heading
var heading1 = dijit.registry.byId("ID_Heading");
heading1.destroyDescendants();
heading1.moveTo = viewId;
heading1.backButton = false;
heading1._setBackAttr("Zurück");
I have created two Pages Page1.xaml and Page2.xaml in windows8 metro apps.
I have created one textbox and Hyperlink in Page1.xaml. Clicking that Hyperlink button after entering some text in textbox in Page1.xaml. Then its navigating to the Page2.xaml. In Page2.xaml I am going to show the text which was entered in the Page1.xaml textbox.
Here after coming to the Page2.xaml I am clicking the back button for going to previous page Page1.xaml. Here I want to show the text in the textbox which I have entered earlier.
But I am getting error when clicking the back button.
Could you please provide me the solution for displaying the text in TextBox of Page1.xaml
Thanks in advance
One way to make code available across different script scopes is to use a WinJS namespace.
For example, in page1.js, you would have:
(function(){
function setText(){
var mytext = "";
WinJS.Namespace.define("page1", {
text: mytext
});
}
})();
in page2.js, you'd put the text in that namespace:
(function(){
page1.text = "page 2 text!";
})();
Back in page 1, you can retrieve that value later on:
(function(){
function setText(){
var mytext = "";
WinJS.Namespace.define("page1", {
text: mytext
});
}
function getText() {
document.querySelector("#myTextField").value = page1.text;
}
})();
I'd suggest being a bit more formal about what you put in namespaces, but that's one way to do it.
If there is a html form with a button, with normal html, we would be able to retrieve form element from the onclick event object as follows.
ev.target.form
As Dojo contains a its normalize event object, how can we retrieve event generated form element when a button is clicked ? (I require this as my dom tree contains duplications of same form element)
Thank you,
nimp
dojo.connect(dojo.byId("formsContainner"), "click", function(evt){
dojo.stopEvent(evt); // assuming you don't want to actually go to a new page
var n = evt.target;
while(n.tagName != "form"){
if(n.tagName == "body") break;
n = n.parentNode;
}
if(n.tagName == "form"){
myFormMethod(n);
return;
}
console.error('no form for button - clicked on something else')
});