I have this object that I would like to append to my div#doctors-list.
Firefox,Chrome work like a charm.But all IE fail. No errors are shown in the console.
$.each(sorteddoctorsArray[i2], function(idx, val) {
if ( !$.browser.msie ) {
$('div#doctors-list').append(val);
}else{
console.log(val);
// this logs [object Object]
$('div#doctors-list').append(val); // fails
}
});
any suggestions?
open it in IE and firefox to see the difference
try:
$('div#doctors-list').html($('div#doctors-list').html()+val);
It's hard to say when you disable the IE-Code(it currently is commented out).
But one issue I see so far(a few lines above the code posted by you) :
$('div#doctors-list').html('');
for(var i in priority){
for(var i2 in sorteddoctorsArray){
Both, priority and sorteddoctorsArray are native Arrays, you should never walk native Arrays by using for...in, always use for(var i=0;i<array.length;++i)
The for...in -Syntax will walk trough all members of an object. Also the build-in Array-members, e.g. length , will be fetched, what may result in errors.
Related
I have some code that I have been using in an application for some time now where all of our internal users are using firefox for running the app. There are a few people wanting to run IE and there is a block of code that I believe is hitting an error and I don't know exactly why..
// Given a field name, check to see if its in our output. If so, return the formatted link
function createLink(field, val) {
var output = {
'ntid': 'https://web.internal/profile/' + val,
'email': 'mailTo:' + val
};
for (var key of Object.keys(output)){
if (field.toLowerCase().includes(key)){
return `${val}`;
}
}
return val;
}
In IE 11, I get a console error SCRIPT1004: Expected ';' which refers to the line for (var key of Object.keys(output)){.
Is this not supported in IE11 or is there some type of syntax that FF handles correctly that IE doesn't?
Instead of the "for...of", try a "for...in" which is supported by every browser for a long time now. Syntax is exactly the same.
(There is a difference between them but I guess in your case it's not relevant... More about this here: What is the difference between ( for... in ) and ( for... of ) in javascript? )
Instead of the "for...of", try a "for...in" which is supported by
every browser for a long time now. Syntax is exactly the same.
Not entirely:
https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/for...of
I'm creating a few specific functions for a compiler I'm working on, But certain restrictions within the compiler's nature will prevent me from using native JavaScript methods like Array.prototype.pop() to perform array pops...
So I decided to try and write some rudimentary pseudo-code to try and mimic the process, and then base my final function off the pseudo-code... But my tests seem to fail... based on the compiler's current behavior, it will only allow me to use array.length, array element assignments and that's about it... My code is below...
pop2 = function(arr) {
if(arr.length>0){
for(var w=undefined,x=[],y=0,z=arr.length;y<=z;y++){
y+1<z?(x[y]=arr[y]):(w=arr[y],arr=x);
}
}
return w;
}
Arr = [-1,0,1,2];
// Testing...
console.log(pop2(Arr)); // undefined... should be 2
console.log(Arr); // [-1,0,1,2]... should be [-1,0,1]
I'm trying to mimic the nature of the pop function but can't seem to put my finger on what's causing the function to still provide undefined and the original array... undefined should only return if an initial empty array is sent, just like you would expect with a [].pop() call...
Anyone have any clues as to how I can tailor this code to mimic the pop correctly?
And while I have heard that arr.splice(array.length-1,1)[0]; may work... the compiler is currently not capable of determining splice or similar methods... Is it possible to do it using a variation of my code?
Thanks in advance...
You're really over-thinking [].pop(). As defined in the specs, the process for [].pop() is:
Get the length of the array
If the length is 0
return undefined
If length is more than 0
Get the item at length - 1
Reduce array.length by 1
Return item.
(... plus a few things that the JavaScript engine needs to do behind the scenes like call ToObject on the array or ensure the length is an unsigned 32-bit integer.)
This can be done with a function as simple as the one below, there's not even a need for a loop.
function pop(array) {
var length = array.length,
item;
if (length > 0) {
item = array[length - 1];
array.length -= 1;
}
return item;
}
Edit
I'm assuming that the issue with the compiler is that Array.prototype.pop isn't understood at all. Re-reading your post, it looks like arrays have a pop method, but the compiler can't work out whether the variable is an array or not. In that case, an even simpler version of this function would be this:
function pop(array) {
return Array.prototype.pop.call(array);
}
Try that first as it'll be slightly faster and more robust, if it works. It's also the pattern for any other array method that you may need to use.
With this modification, it works:
http://jsfiddle.net/vxxfxvpL/1/
pop2 = function(arr) {
if(arr.length>0){
for(var w=undefined,x=[],y=0,z=arr.length;y<=z;y++){
if(y+1<z) {
(x[y]=arr[y]);
} else {
(w=arr[y],arr=x);
break;
}
}
}
return w;
}
Arr = [-1,0,1,2];
// Testing...
console.log(pop2(Arr)); // 2
The problem now is to remove the last element. You should construct the original array again without last element. You will have problems with this because you can't modify the original array. That's why this tasks are maded with prototype (Array.prototype.pop2 maybe can help you)
I'm trying to call document.getElementsByTagName, and I'm getting back undefined as a result, no matter what parameter I pass. (Even if I pass "*".)
I tried Googling for it, but all the search results were about elements of the getElementsByTagName result array being undefined. What I'm getting is undefined as the result itself, and it's driving me up the wall.
Does anyone know what can cause this? (Using Firefox 12.0. In Chrome I get the expected results.)
EDIT: OK, here's sample code:
function buttonClick(){
var xhr = new XMLHttpRequest();
var msg = document.getElementById('message');
var buttons = document.getElementsByTagName("button");
var button, i;
for (i = 0; i < buttons.length; ++i){
button = buttons[i];
msg.removeChild(button);
}
xhr.onreadystatechange = function() {
if(xhr.readyState == 4){
handleResult(xhr.responseText, msg);
}
};
xhr.open("POST", location.href, true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send("cmd=MyCommand");
}
And the getElementsByTagName always returns undefined, whether I trace it in Firebug's Script tab or call it from the Console tab. (Also in Firebug, since this seems to be confusing people. Apparently there are way too many consoles floating around.).
As proof, here's what I've been getting when I tried to use the Firebug console:
>>> document.getElementsByTagName("button");
undefined
>>> msg.getElementsByTagName("button");
undefined
>>> msg.getElementsByTagName
getElementsByTagName()
>>> msg.getElementsByTagName("BUTTON");
undefined
>>> msg.getElementsByTagName("*");
undefined
>>> document.getElementsByTagName("*");
undefined
>>> document.getElementsByTagName("body");
undefined
The markup is (or ought to be) irrelevant. It's a valid, well-formed HTML page with some buttons and other elements on it. This JS function is attached to the onclick of one of the buttons. But it looks something like this:
<html xmlns="http://www.w3.org/1999/xhtml"><head>
blah
</head>
<body>
<script type="text/javascript" src="/myJS.js"></script>
<div id="page-container">
<div id="message"><button onclick="buttonClick();">Button 1</button><button onclick="ButtonClick2()">Button 2</button></div>
</div>
</body></html>
edit:
This is a bug in firebug and is fixed by upgrading to 1.10.0a7
Because it is impossible for this method to return undefined, there are 2 possibilities:
Your debugging tools are lying to you
document.getElementsByTagName is not referencing the original host object. It should print
function getElementsByTagName() {[native code]} when referenced in console.
You should be able to reliably to see if it's in fact undefined (in firefox) with this:
delete window.alert;
window.alert(buttons);
The delete is a NOOP if window.alert is already referencing the original host object, otherwise
it will restore it.
If it alerts undefined, you should be able to do
delete document.getElementsByTagName
to restore the host object reference.
All console references here refer to the built in Web Console that comes with firefox by default.
I got the problem when I made a difficult to see syntax error. I used parenthesis when I should have used square brackets
Wrong:
selectedItem._element.childNodes(0).getElementsByTagName('input').item();
Right:
selectedItem._element.childNodes[0].getElementsByTagName('input').item();
See the difference? Note, the top syntax works is older versions of IE, like IE8, but it doesn't work in ie10, ie11, Edge etc
Isn't REPL a stand-alone, browser-independent JavaScript environment? While, in your case, in just happens to be running in your browser as a plugin, it's supposed to mimic a "clean room" per say...
To summarize this guy's answer: document.getElementById() returns null when using mozrepl (but not in firebug)
By default, you'r in the browser's context, not the document's.
Try this to switch to the document instead:
repl.enter(content)
You can't alert an Array, you should do a for loop to alert it. Example:
var x = document.getElementsByTagName('a');
for (var i = 0, c = x.length ; i < c ; i++) {
alert('Element n° ' + (i + 1) + ' : ' + x[i]);
}
This issue is also raised when we try to access element without array index. Because document.getElementsByTagName('tag') returns an array.
This question already has answers here:
How can I display a JavaScript object?
(40 answers)
Closed 2 months ago.
I tried to do a debug but I am having problems. Now I try with alert(). For example I want to see the value of:
var product = { ProductName: $('!Answer_Response[0]').val(),
UnitPrice: $('#Price').val(),
Stock: $('#Stock').val()
};
When I say alert(product) it just gives me [object Object]. How can I make alert show what's really there?
you can use the JSON.stringify() method found in modern browsers and provided by json2.js.
var myObj = {"myProp":"Hello"};
alert (JSON.stringify(myObj)); // alerts {"myProp":"Hello"};
or
also check this library : http://devpro.it/JSON/files/JSON-js.html
you can use toSource method like this
alert(product.toSource());
If you want to easily view the contents of objects while debugging, install a tool like Firebug and use console.log:
console.log(product);
If you want to view the properties of the object itself, don't alert the object, but its properties:
alert(product.ProductName);
alert(product.UnitPrice);
// etc... (or combine them)
As said, if you really want to boost your JavaScript debugging, use Firefox with the Firebug addon. You will wonder how you ever debugged your code before.
This is what I use:
var result = [];
for (var l in someObject){
if (someObject.hasOwnProperty(l){
result.push(l+': '+someObject[l]);
}
}
alert(result.join('\n'));
If you want to show nested objects too, you could use something recursive:
function alertObject(obj){
var result = [];
function traverse(obj){
for (var l in obj){
if (obj.hasOwnProperty(l)){
if (obj[l] instanceof Object){
result.push(l+'=>[object]');
traverse(obj[l]);
} else {
result.push(l+': '+obj[l]);
}
}
}
}
traverse(obj);
return result;
}
You should really use Firebug or Webkit's console for debugging. Then you can just do console.debug(product); and examine the object.
Try this:
alert(JSON.parse(product) );
Use Javascript native JSON.stringify method. To visualise it in a nicer way, you can use, like: JSON.stringify(obj,null, 4)
var obj = {data:[{"empmenuid":"1","empid":null,"deptid":"66","aliasid":"66","firstname":"66","lastname":"66","sin":"66","status":"66","empclass":"66","hiredate":"66","seneoritydate":"66","separationdate":"66"},{"empmenuid":"3","empid":null,"deptid":"12","aliasid":"12","firstname":"12","lastname":"12","sin":"12","status":"12","empclass":"12","hiredate":"12","seneoritydate":"12","separationdate":"12","recalldate":"12","martialstatus":"12","gender":"12","pager":"12","locid":"12","jobtitle":"12","jobtitlestart":"12","fullpart":"12","manager":"12","managername":"12","middlename":"12","nickname":"12","paytype":"12","payfreq":"12"}],
recordType : 'object'};
alert(JSON.stringify(obj,null, 4));
Depending on which property you are interested in:
alert(product.ProductName);
alert(product.UnitPrice);
alert(product.Stock);
alert( JSON.stringify(product) );
alert (product.UnitName + " " + product.UnitPrice + " " + product.Stock)
or else create a toString() method on your object and call
alert(product.toString())
But I have to agree with other posters - if it is debugging you're going for then firebug or F12 on IE9 or chrome and using console.log is the way to go
I've written this code in Firefox JS extension
var results = gBrowser.contentDocument.getElementsByClassName("b-serp-item__title-link");
alert(results.length);
var countToDelete = results.length - 10;
alert(countToDelete);
if (countToDelete > 0)
{
for (var i = 0; i < countToDelete; i++);
{
alert("I prepare");
results.shift();
alert("I done");
}
}
alert("succ");
And I've got this output
results.length=12
countToDelete=2
(I prepare)
and... that's all
There is a problem at results.shift();
I looked in Firefox Error Console and I found this
"results.shift is not a function"
Why? Is shift a js function?
When I try to run this code in firefox console I've got this error again
What's the matter?
My version of Firefox is 4.
Tested url is http://yandex.ru/yandsearch?text=%D0%BE%D0%B1%D0%BE%D0%B9%D0%BD%D1%8B%D0%B9+%D0%BA%D0%BB%D0%B5%D0%B9+%D0%BA%D1%83%D0%BF%D0%B8%D1%82%D1%8C&lr=37
this will convert your nodelist to a real Array, which has a usable shift method:
var results = Array.prototype.slice.call(
gBrowser
.contentDocument
.getElementsByClassName("b-serp-item__title-link")
);
I think it's clear that there is no such thing as shift() in Gecko:
https://developer.mozilla.org/En/DOM/NodeList
The main question is what you want to achieve by it? By removing items form the NodeList you are certainly not removing them from the DOM document. What is your quarrel with removeChild()?
You need to convert the HTMLCollection to an array if you want to use shift() :
Most efficient way to convert an HTMLCollection to an Array