document.getElementById(control).value not working with IE8 - html

var tagID = document.getElementByn("<%=ddlSectionHeaderID%>").value;
var tagIndex = document.getElementById("<%=ddlSectionHeaderID%>").selectedIndex;
var tagName = document.getElementById("<%=ddlSectionHeaderID%>").children(tagIndex).innerText;
var exportID = document.getElementById("<%=hdnExportID%>").value;
This gives me "Object doesn't support this property"

It would help to see the rendered output and what references resulted in the rendered script.
The "Object doesn't support this property" error means that you are trying to access a property that does not exist for that object. perhaps when this script is rendered, what you think should be a select element is actually a text input. If that is the case, the selectedIndex property wont exist (this is just one possibility - you will know more if you were able to see the resulting string).

Related

setting the playback rate of html5 video in html

When watching a video, its possible to enter developer mode in the browser and enter the following command in the console to change the playback speed of a video
document.getElementsByTagName('video')[0].playbackRate = 0.9
When I try however to code this in html I am unable to access the video object.
var obj = document.getElementsByTagName('video');
console.log(obj);
returns an object of length 0
also trying
var player1 = document.getElementById("video");
console.log(player1);
player1.playbackRate = 2;
returns null
A demo of the not working code so far is here:
https://jsbin.com/peludojisi/1/edit?html,js,console,output
Can someone please help me figure out how to set the playbackRate from html
many thanks in advance
Jesse
document.querySelector does not work across iframes. Since the video in your example is within an iframe, your query returns null.
The error message in you snippet tells you almost as much:
"TypeError: Cannot set property 'defaultPlaybackRate' of null
at :16:59
Line 16 of your script:
document.querySelector('video').defaultPlaybackRate = 2.0;

FireFox Add-on: retrieve text from textbox in current tab gives no result

I am trying to create an add-on that gets the contents (textbox.value) from a textbox with ID = city from the current webpage and write it to a text file.
The file can be written without getting the textbox value. But, If I update the code then it writes nothing. Below is the code I used to get the textbox value.
var cityfromfield = window.content.document.getElementById('city').value;
var date = new Date();
var TimeStamp = date.toLocaleString();
var wstrtotext = TimeStamp + cityfromfield;
fos.write(wstrtotext, wstrtotext.length);
Any help would be appreciated.
Without more information, it is necessary to guess at what your problem is. The most likely issue is that you are attempting to find the textbox element with ID=city in the wrong document.
Firefox add-ons generally run in a scope where the global window object is not defined (if it is defined depends on how the portion of your code that is currently running was entered). Even if it is defined, it is often not defined as the window which you are expecting (the window of the current tab). You will probably need to obtain a reference to the window object for the most recently accessed window/tab.
If a browser window exists (in some instances you could be running where no browser window exists, yet, e.g. at start-up), you can obtain a reference to the most recent browser window, document, and gBrowser with:
if (window === null || typeof window !== "object") {
//If you do not already have a window reference, you need to obtain one:
// Add/remove a "/" to comment/un-comment the code appropriate for your add-on type.
/* Add-on SDK:
var window = require('sdk/window/utils').getMostRecentBrowserWindow();
//*/
//* Overlay and bootstrap (from almost any context/scope):
var window=Components.classes["#mozilla.org/appshell/window-mediator;1"]
.getService(Components.interfaces.nsIWindowMediator)
.getMostRecentWindow("navigator:browser");
//*/
}
if (typeof document === "undefined") {
//If there is no document defined, get it
var document = window.content.document;
}
if (typeof gBrowser === "undefined") {
//If there is no gBrowser defined, get it
var gBrowser = window.gBrowser;
}
If you are running the code in response to an event (e.g. a button command event), you can obtain the current window with:
var window = event.view
The lack of having the global window object available, or having it reference something other than what you are expecting, is something that many people encounter as a problem when writing Firefox add-ons.
Note: If you are wanting to be natively compatible with multi-process Firefox (Electrolysis, or e10s), then gaining access to the contents of the current document is more complex. There are shims in place which should make your code continue to work with multi-process Firefox for some time, but they may/will eventually go away.
References:
nsIWindowMediator
Working with windows in chrome code
SDK: window/utils
SDK: windows
Large portions of this were copied from my earlier answers, including this link.

Ext JS bug in WebKit Browsers

I encountered a problem of declaring a variable "location" for extjs store where it runs without any problem in IE but browsers that has webkit like FireFox, Chrome..etc trying to redirected to unknown page with [object, object] in the end.
Was there any list of reserved variables like "location" we should not use it in extJS?
It has nothing to do with Ext. The browser window object has a location property:
https://developer.mozilla.org/en-US/docs/Web/API/window.location
This is caused by the different designs of 'Global' object in different browsers.
In Chrome/Firefox/Opera, it will add the 'Global' object as a property to 'window'(host object). Like,
"var test = 'test';alert(window.test);",
the result will be: test.
But, in IE, it doesn't add the global object to 'window'.
So, here, the statement var location = "Some value"; equals to window.location = "Some value";.

Why is e.parameter.source undefined?

I am trying to find out where a callback function came from, but e.parameter.source has been undefined.
The code I'me using to create the callback event is:
var temp_handler = app.createServerHandler("do_things");
container.add(app.createButton(s_list[i][2]).setId("goto_"+s_list[i][1]).addClickHandler(temp_handler));
container.add(app.createLabel("goto_"+s_list[i][1]));
where container is later added to the app.
The first part of the function that gets called is:
function do_things (e)
{
var app = UiApp.getActiveApplication();
Logger.log(e.parameter);
var src = e.parameter.source;
From this, I have been able to tell that e.parameter is:
{clientY=61, clientX=38, button=1, alt=false, eventType=click, screenY=278, ctrl=false, screenX=493, y=11, shift=false, meta=false, x=34}
This does not include source. I find this peculiar because as far as I can tell, other callback functions in the same file have been able to access and use e.parameter.source without issue.
Does anyone know what I am doing wrong in this callback such that the source parameter is inaccessible?
The other answers do not make much sense to me.
First, because the source parameter is filled by the element id that generated the event, not its name.
Also it's filled automatically, there's no need to addCallbackElement, which is required for accessing widgets contents by their name. And last, set a name for a label is only useful when you're setting a tag on it, as there's no "content" for a label.
All that said, the only problem I can imagine is if you're setting the same id on another widget and it's messing with your original one (the button). But I haven't tested that to be sure.
You simply forgot to give a name to your Label widget. The value returned by the e.parameter is assigned to a widget by its name.
The ID is used to access the widget from outside the UiApp creation function when you need to modify it.
In addition to what Serge answered, you might want to supply a callback element on the handler using
ServerHandler.addCallbackElement()

event.DataTransfer doesn't transfer ID of dragged object when running in Jetty

I have a Maven Jetty project with JSPs using JavaScript. I want to be able to highlight parts of a canvas corresponding to the dragged image's size.
When I look at my JSP by simply opening it in the browser everything works as expected but when I start the Jetty Server with the goal jetty:run the ID of the dragged object is not being set or cannot be retrieved from the transferData of the event.
The relevant code: All draggable images have a unique ID. On drag start I set the ID of the dragged image on the event's transferData like this:
function dragShipFromTable(event) {
event.dataTransfer.setData("id",event.target.id);
}
When the image is dragged over the canvas I call the following function
function allowDrop(event) {
event.preventDefault();
var id = event.dataTransfer.getData("id");
var img = document.getElementById(id);
// Do the highlighting stuff
....
}
The problem is that when the server is started and I do the above action then in allowDrop(event) the ID of the dragged image is not being retrieved from the transferData. It is undefined and therefore the highlighting fails. This is not the case when simply opening the JSP as a File.
Well I kind of found the answer to my own question. First of all the setData method on the dataTransfer object only allows certain formats as first parameter. I interpreted it as an associative array but this is not the case. So it should be
event.dataTransfer.setData("text/plain", id);
event.dataTransfer.getData("text/plain");
to set and retrieve the id correctly.
But in the end everything failed due to chrome as there is a bug in Chrome which prevents me from using dataTransfer as intended (see How do you get the selected items from a dragstart event in Chrome? Is dataTransfer.getData broken? ).
I now use global variables to store the information I need. And still I am wondering why everything worked fine when the page was displayed as a file instead of as a response from the webserver.