problems using the append() within a forloop - javascript

With an onclick="throw()" in one of my buttons and the value from a select tag, I want to spawn some dices in a div. so far I have this.
function throw() {
var i = document.getElementById('quantity').value;
for (var b = 1; b <= i; b++) {
$("#dices").append("<canvas class="canvasstyle" id='dice"+b"' height='200' width='200'></canvas>");
}
}
I can't get the (yet still empty) dices to spawn. It keeps giving me
Uncaught SyntaxError: missing ) after argument list, somewhere within the forloop. Anyone who can see the problem?

Ok, first thing is you are trying to use double quotes inside double quoted text; you should be using single quotes. And you are also missing a plus sign as Festive Turnip said. So the line should be
$("#dices").append("<canvas class='canvasstyle' id='dice" + b + "' height='200' width='200'></canvas>");

You are missing a +.
id='dice" + b "' should be id='dice" + b + "'

Related

Im doing a JavaScript CodeHS course, but what am I doing wrong?

Im doing intro to JS in a site called CodeHS. I believe I did the assignment its asking of me right but it says its wrong?
Here is what it wants me to do:
Here is what I did:
Heres what I apparently got wrong:
Ive run this code many times and it worked flawlessly, so why does it give me these errors?
You forgot to add a blank line inside the end of your while block, which also accounts for the line number. You should check the IMPORTANT note on the assignment.
I agree with #Jorge. You need to include the new line character '\n' at the end of the appropriate print statements, for the sake of the marking program. Try it like this:
while(numItems > 0) {
println('We have ' + numItems + ' in inventory.');
var buy = readInt('How many items would you like to buy?');
if(buy <= numItems) {
numItems -= buy;
println('Now we have ' + numItems + ' left.' + '\n');
} else {
println('There is not enough in inventory for that purchase.' + '\n');
}
}

How to mix string with variables in an input needing mutiple values in js? (In this case, the coord attribute of the area tag)

So what the problem I have been facing so far is that I am currently trying to use javascript so that the coords attribute of my area tag is set according to some variables(what it is doesn't really matter). However, the coords require 4 inputs (x1,y1,x2,y2) and I have some values that I am not going to use the variable for. Which means that I have to mix string and variables in the input which I have no idea on how to do.
To give you a better sense on what I am doing, here is a summary:
var p = some random value
var q = some random value
var a1 = document.getElementById(areaID);
a1.setAttribute("coords", "0,0, p,q")
Of course this didn't work as the "" made it think that p,q are strings instead of variables. So I tried some other where it all failed(some desperate attempts).
a1.setAttribute("coords", 0,0,p,q);
a1.setAttribute("coords", "0,0," + p + "," + q);
document.getElementById(areaID).coords = 0,0, p,q;
const list = ["0","0", p,q];
a1.setAttribute("coords", list);
So does anyone know how could I possibly do this?
The second option you tried should work. In your example, is areaID a variable or the actual id of the element? If it is the latter, then you need to put it in quotes: document.getElementById("areaID")
var p = "val1"
var q = 23
var a1 = document.getElementById("areaID");
a1.setAttribute("coords", "0,0," + p + "," + q)
console.log(a1);
<div id="areaID"></div>

Javascript syntax error? "Unexpected Indentifier"

sorry I just started with javascrippt and html and I am having trouble finding out what the unexpected identifier is?
here is my function
function fillSearchPlayer(data){
$('#searchPlayers tbody').html('');
for (var i = data.length - 1; i >= 0; i--) {
var p = data[i]
var item = '<tr><td>'p.firstname + ' ' + p.lastname'</td><td>'p.job'</td><td><button class="cbtn" onclick="requestPlayer("'+ p.identifier + '")">More</button></td></tr>'
$('#searchPlayers tbody').append('item');
}
}
maybe you guys could help me, it's saying its coming from the line that starts with "var item"
'<tr><td>'p.firstname look like you missed a plus sign over there. The other thing is .append('item'); - you probably intented to do .append(item);.
As the guys mentioned in the direct comments above you should try to use some templating engine instead of constructing the strings the way you did it.
I would recommend you to read these pieces:
Handlebars - simple and convenient template engine in JavaScript - give it a try!
Template strings in ES2016 - a cleaner way to do what you did with manual string concatenation
There are several errors. String concatenation works with +, and you're missing a semicolon.
Try:
function fillSearchPlayer(data) {
$('#searchPlayers tbody').html('');
for (var i = data.length - 1; i >= 0; i--) {
var p = data[i];
var item = '<tr><td>' + p.firstname + ' ' + p.lastname + '</td><td>' + p.job + '</td><td><button class="cbtn" onclick="requestPlayer("'+ p.identifier + '")">More</button></td></tr>';
$('#searchPlayers tbody').append('item');
}
}
The var item = ... item mixes variable and literal definitions without the real concatenation going on. Just put a + between each varying element to achieve your goal.
You need to enclose the concatenation operator around the p.job variable.
Your assignment should look like this...
var item = '<tr><td>'+p.firstname + ' ' + p.lastname+'</td><td>'+p.job+'</td><td><button class="cbtn" onclick=requestPlayer('+ p.identifier + ')>More</button></td></tr>'

Javascript Error: 'missing ) after argument list"

I am making an image for my webpage through javascript like so:
photoHTMLString = '<li class = "SliderPhoto"><img src = "' + ImageArray[x].src_small + '" size = "thumb" onclick = "ShowImagePopUP(' + ImageArray[x].src_big + ')" class = "FacebookSliderPhoto"/></li>';
Whenever I try and click a photo go into ShowImagePopUP I get this error:
missing ) after argument list
[Break On This Error] ShowImagePopUp(http://a8.sph...389_84095143389_5917147_2636303_n.jpg)
It doesn't look like I am missing any ')'s so I am lost on the error.
Any suggestions?
You need to wrap the contents of ShowImagePopUP in quotes:
"ShowImagePopUp(\'' + ImageArray[x].src_big + '\')"
Which should render as:
ShowImagePopUp('http://a8.sph...389_84095143389_5917147_2636303_n.jpg')
^ note the quote here
Example: http://jsfiddle.net/V23J6/1/
try
photoHTMLString = '<li class = "SliderPhoto"><img src = "'
+ ImageArray[x].src_small
+ '" size = "thumb" onclick = "ShowImagePopUP(\"'
+ ImageArray[x].src_big + '\")" class = "FacebookSliderPhoto"/></li>';
should do the trick and solve your problem leaving intact the uglyness of you code
A function like this one should be a bit readable and ready to use...
function slideElement(image){
var li=document.createElement('li');
var img=document.createElement('img');
li.appendChild(img);
li.setAttribute('class','SliderPhoto');
img.setAttribute('class','FacebookSliderPhoto');
img.setAttribute('size', 'thumb');
img.setAttribute('src', image.src_small);
img.setAttribute('onclick', function(){showImagePopUP(image.src_big);});
return li;
}
The value in ImageArray[x].src_big needs to be quoted.
Try to avoid building HTML by mashing strings together. Using a DOM builder gives code that is much easier to debug.
You'd probably be better off writing this so the function computes the large URI based on the small URI rather than having it hard coded.
Here's some general advice, build up the strings into intermediate variables and then assemble it at the end. You can then use the debugger to find out where you're getting your ' or "s unbalanced. When you have it all built you can coalesce it into a single line if you want or leave it with the intermediate variables.

Why does eval() give undefined value in Javascript?

I am working in JavaScript coding. I have created a text area with name OQ_0 and value "0". When i use eval() method for that field in JavaScript it is giving the value undefined. The below are the part of JavaScript code
var tempOpenQtyStr = "document.InitiateReturnsForm.OQ" + "_" + 0;
var tempOpenxQtyStr = eval(tempOpenQtyStr).value;
alert('Manuals =' + document.InitiateReturnsForm.OQ_0.value);
alert('eval(tempOpenxQtyStr ) =' + eval(tempOpenxQtyStr));
alert('eval(tempOpenxQtyStr).value =' + eval(tempOpenxQtyStr).value);
Output:
Manuals = 0
eval(tempOpenxQtyStr ) = 0 --- Here it is suppose to show "[object]"
eval(tempOpenxQtyStr).value = undefined.
Kindly help me out what is change to do. Thanks in advance.
Why not just use document.InitiateReturnsForm["OQ_" + 0].value?
Try
alert('eval(tempOpenxQtyStr ) = ' + eval(tempOpenQtyStr));
alert('eval(tempOpenxQtyStr).value = ' + eval(tempOpenQtyStr).value);
In the second and third alert you are evaluating the second variable which stores the value of the first evaluated object. That's why the error occurs.
alert('eval(tempOpenxQtyStr ) =' + eval(tempOpenxQtyStr));
Since you put a string, not an object, inside tempOpenxQtyStr, it evaluates that string and returns 0.
alert('eval(tempOpenxQtyStr).value =' + eval(tempOpenxQtyStr).value);
Here you're using a method on a variable that contains a string. That doesn't work. It doesn't have that method, that's why it returns undefinied.
You might want to try doing eval(tempOpenxQtyStr.value) instead of eval(tempOpenxQtyStr).value since the last one does basically nothing, just evaluating an object and then fetching the objects value (it doesn't eval the value itself).

Categories