I have the following code written in Dojo. It works fine and as expected in all browsers except Firefox (25,26) The error from the console is: typeError: this.getParent() is null which is really not helpfull a lot.
The onclick event does't fire giving the above mentioned error.
Where could the problem be:
var pMenu = new dijit.Menu({
targetNodeIds: [ContainerNode]
});
var t = new dijit.MenuItem({
label: "test",
iconClass: "context_paste",
});
dojo.connect(t, 'onclick', function(){alert("test")});
I created a fiddle and filled in the missing code and was not able to reproduce the error on Firefox 25. Some of the changes that I made were:
Removed the trailing comma at the end of the iconClass line
Place the menu item in the menu with placeAt(pMenu)
Ran the code on load. I'm not sure you were doing this from the code provided.
http://jsfiddle.net/RichAyotte/okvp0hpu/
dojo.require('dijit.Menu');
dojo.require('dijit.MenuItem');
dojo.addOnLoad(function() {
var ContainerNode = document.getElementById('container');
var pMenu = new dijit.Menu({
targetNodeIds: [ContainerNode]
});
var t = new dijit.MenuItem({
label: "test",
iconClass: "context_paste"
}).placeAt(pMenu);
dojo.connect(t, 'onClick', function(){alert("test")});
});
Related
Have run into a problem wiht jqGrid when I try to export a table to PDF, Excel or CSV.
Every time I run the code I get "Call to Undefined Method::jqGrid::exportToPdf" (or Excel or CSV, depending on which method I am using.
Here is a snip of the client side:
.jqGrid('navButtonAdd', '#ors_registrant_pager', {
id: 'exportToPdf',
caption: '',
title: 'Download PDF',
onClickButton: function(){
grid.jqGrid('excelExport',{tag:"pdf","url":"info.php"});
}
Here is the server side php script in info.php:
$conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD);
$conn->query("SET NAMES utf8");
$grid = new jqGrid($conn);
$grid->SelectCommand = "SELECT lastName, firstName FROM user_table";
$grid->ExportCommand = "SELECT lastName FROM user_table";
$grid->dataType = "json";
$export = $_POST["oper"];
if($export == "pdf") {
$grid->exportToPdf();
} else {
$grid->queryGrid();
}
The grid loads correctly on the pageload, but as stated, when you click the PDF button on the bar I get that error. I've tried using all the parameters for the method to what is above with the same result. I've traced and the exportToPdf method does indeed exist in the jqGrid class.
I've searched and can't find any references to the problem. Any help would be much appreciated.
UPDATE
moved to Answer
Ok, as it happens so many times, as soon as I posted I found the answer. The documentation is not correct in the Trirand site for PHP help. In the help it states to use the jqGrid class for PDF exports, but apparently you have to use the jqGridRender class instead.
To do the PDF export I had to change the $grid declaration as follows:
$grid = null;
$export = $_GET["oper"];
if($export == "pdf"){
$grid = new jqGridRender($conn);
} else {
$grid = new jqGrid($conn);
}
Doing so allows the grid to be exported.
I was going to delete the thread but I am leaving in case others run into the same problem in hopes this will help them out.
I want to change the label of a widget when user click it, then I write the code looks like this:
var widgets = require("sdk/widget");
var statusBar = widgets.Widget({
id: "patchouliStatus",
label: "Wait Page Loading...",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(){
this.contentURL = "http://www.google.com/favicon.ico";
this.label = "Clicked";
}
});
When I click the widget, the icon has changed, but nothing happen to the label.I move the mouse to the widget and it still show "Wait Page Loading...".Is there a way to dynamically change the label?
Firefox: v27.0.1
Add-on SDK: v1.15
Widget's label is read-only. You must use tooltip attribute to show the user a text on mouse hover, this way:
var widgets = require("sdk/widget");
var statusBar = widgets.Widget({
id: "patchouliStatus",
label: "Wait Page Loading...",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(){
this.contentURL = "http://www.google.com/favicon.ico";
this.tooltip = "Clicked";
}
});
As docs says somewhere in this section -I think it could be more clearly documented-, tooltip value is an "optional text to show when the user's mouse hovers over the widget. If not given, the label is used". Also, examples in that section don't make it clear enough as I think they should.
Ok man thanks for the XPI, change changeLabel function to this, my above was really bugged.
function changeLabel(str){
var DOMWindows = Services.wm.getEnumerator('navigator:browser');
while (DOMWindows.hasMoreElements()) {
var aDOMWindow = DOMWindows.getNext();
var myWidget = aDOMWindow.document.getElementById('widget:jid1-njALX8gXKY872g#jetpack-patchouliStatus');
if (myWidget) {
Services.appShell.hiddenDOMWindow.console.info('myWidget:', myWidget);
myWidget.setAttribute('label', str);
myWidget.setAttribute('tooltiptext', 'tooltip changed');
} else {
Services.appShell.hiddenDOMWindow.console.info('myWidget null:', myWidget);
}
}
}
It also seems that the id of your widget starts with tyour addon id name.
Now I gave you the enumerator function because that goes over all windows and you can add event listener. But really if you just want to target the one that was clicked just get the most recent window, as that will obviously hold the correct window with your widget as we just clicked there and the event listener fires on click.
Change changeLabel to this:
function changeLabel(str){
var aDOMWindow = Services.wm.getMostRecentWindow('navigator:browser');
var myWidget = aDOMWindow.document.getElementById('widget:jid1-njALX8gXKY872g#jetpack-patchouliStatus');
if (myWidget) {
Services.appShell.hiddenDOMWindow.console.info('myWidget:', myWidget);
myWidget.setAttribute('label', str);
myWidget.setAttribute('tooltiptext', 'tooltip changed');
} else {
Services.appShell.hiddenDOMWindow.console.info('myWidget null:', myWidget);
}
}
Also that Services.appShell.hiddenDOMWindow.console.info is just something nice to debug, I left it in there so you can see how it works. It logs to "Browser Console" (Ctrl+Shift+J).
As a final note I used a non-sdk solution by requiring chrome. they advise you not to do that because they want you to use the SDK functions I don't know about SDK but you can use the getEnumerator and recentWindow function by requiring window/utils it looks like:
Read window/utils article here
I'll give you non-sdk solution here but someone will have to help convert it to sdk solution. You can paste this in your code it will work though.
Im not sure how the element is inserted into the dom but I guessed.
var {Cu, Ci} = require('chrome'); //if you want to paste this into scratchpad with with Environemnt set to Browser than dont need this line, this line is for sdk
var DOMWindows = Services.wm.getWindowEnumerator(null);
while (DOMWindows.hasMoreElements()) {
var aDOMWindow = aXULWindow.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowInternal || Ci.nsIDOMWindow);
var myWidget = aDOMWindow.querySelector('#patchouliStatus'); //im not exactly sure how the element is inserted in the dom but im guessing here
if (myWidget) {
myWidget.label = 'rawr';
}
}
I've been playing with this for a couple days now to no avail. I've googled just about every descriptive phrase I can think of and nothing useful has turned up.
I have installed Epiceditor in Codeigniter and I have gotten it to the point that the preview button and full screen buttons 'work' and the css is properly working. The issue is that the preview text(in both the preview button and the full screen side-by-side) does not show the proper formatting (bold, italic, etc.). There are no console errors and I'm out of ideas at this point.
Code:
require(['epiceditor'], function() {
var opts = {
textarea: 'page_text',
basePath: '/css/epiceditor',
autogrow: true
}
var editor = new EpicEditor(opts).load();
});
I had the same issue as you when using EpicEditor with requirejs. It seems that the epiceditor script includes marked at the bottom and it is this that is being injected when require the script. Try this:
require(['epiceditor'], function(marked) {
var opts = {
textarea: 'page_text',
basePath: '/css/epiceditor',
autogrow: true,
parser: marked
}
var editor = new EpicEditor(opts).load();
});
I'm using the toolbarbutton library, because the normal widgets would not store their positions if I restart Firefox.
Unfortunately I want to change the icon on runtime. With the widgets I did:
widget.contentURL = "http://127.0.0.1:8082/static/icons/eth_16.png";
With the toolbarbuttons I tried:
Toolbarbutton.image = "http://127.0.0.1:8082/static/icons/eth_16.png";
without any effect. The image seems to be only used when construction the toolbarbutton.
Also tried to destroy and recreate the button with a different icon, but that causes annoying flickering.
Any idea would be appreciated.
I did a quick test and this should work as expected so I'm not sure what issue you're running into here. Here's some example code that works just fine:
var toolbarbutton = require("toolbarbutton");
var timer = require("timer");
var TEST_ICON_M_URL = "http://www.mozilla.org/media/img/favicon.png";
var TEST_ICON_G_URL = "http://www.google.com//images/google_favicon_128.png";
console.log("TEST_ICON_URL", TEST_ICON_M_URL);
var options = {
id: "test-tbb",
label: "TEST BUTTON",
toolbarID: "nav-bar",
image: TEST_ICON_M_URL,
forceMove: true
};
var tbb = toolbarbutton.ToolbarButton(options);
tbb.moveTo(options);
timer.setTimeout(function () {
tbb.image = TEST_ICON_G_URL;
console.log("switched", TEST_ICON_G_URL);
}, 5 * 1000); // 5 seconds
Is there more code you could post? The problem must be somewhere else.
I'm trying to create a Firefox add-on using the online Add-On SDK.
I'm starting with something simple - I want to add a toolbar button that reads the current selected text.
The documentation for the Selection object makes this looks simple enough:
var selection = require("selection");
if (selection.text)
console.log(selection.text);
This doesn't seem to work for me, I just get null.
Here's my complete code:
var selection = require("selection");
require("widget").Widget({
id: "widgetID1",
label: "Test Mozilla Widget",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(event) {
console.log('selection.text = ' + selection.text);
}
});
I've also tried to create the selection object inside the onClick even, with the same effect.
I am able to use the select event to get notified on new selections, so I guess I can use that instead (and keep the value), but I wonder why the above code isn't working... What am I doing wrong?
The selection variable as defined will only have the selected text as long as it is in focus. Clicking on the widget icon takes focus away from the selected text, so it sees no text selected.
Thats why it works when used inside the listener function.
To confirm this, I tried logging its value when a toolbar button is pressed (using the toolbarbutton module), and it works. Pressing a toolbar button (presumably) does not steal focus.
Here's the code, and you can test it online too:
var selection = require("selection");
var tbb = require("toolbarbutton").ToolbarButton({
id: "test",
label: "test",
image: "http://www.mozilla.org/favicon.ico",
onCommand: function(event) {
console.log('selection = ' + JSON.stringify(selection)); // works!
}
});
Here is a solution using the select event:
var selection = require("selection");
var selectedText = '';
function selectionChanged(event){
//todo: check for selection.isContiguous
selectedText = selection.text;
}
selection.on('select', selectionChanged);
require("widget").Widget({
id: "widgetID1",
label: "Test Mozilla Widget",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(event) {
console.log('Selection: ' + selectedText);
}
});