[RESOLVED] Passing a variable as a parameter into getElementById()?
Is it possible to pass a variable as the parameter into a getElementById()? I've been trying to find answers on google and not having much luck. I've heard some say you can but with no examples.
This is what I'm trying to do.
Code:
function showImage(file1) {
var largeImage = document.getElementById(file1);
largeImage.style.display = 'block';
largeImage.style.width=500+"px";
largeImage.style.height="auto";
var url=largeImage.getAttribute('src');
window.open(url,'Image','width=largeImage.stylewidth,height=largeImage.style.height,resizable=1');
}
Re: Passing a variable as a parameter into getElementById()?
well, yes, that's the only way getElementById works... is if you pass it a parameter... it doesn't work if you don't... what it does need to be is a string... and it should be an id that exists in the html... otherwise it returns Nothing.
Re: Passing a variable as a parameter into getElementById()?
Hello..
yes only one way to use getElmentById works.which is u use but if u pass it's parameters it is don't work it returns only when you pass id which is exist in html otherwise it returns nothing
in short you can't pass variables as parameter into getElmentById ().
Re: Passing a variable as a parameter into getElementById()?
Originally Posted by Siddhi Patel
Hello..
yes only one way to use getElmentById works.which is u use but if u pass it's parameters it is don't work it returns only when you pass id which is exist in html otherwise it returns nothing
in short you can't pass variables as parameter into getElmentById ().
That makes no sense... you HAVE to pass it a parameter... it can be a hard coded string, or a string variable... but you have to pass it a string parameter.
To answer Blake's question directly - yes you can, as long as it is a string variable and it is a valid ID of an element.
Re: Passing a variable as a parameter into getElementById()?
Think about how things work in VB. If a method has a parameter of type String then you need to pass a String as an argument, but that can be any String, e.g.
vb.net Code:
Dim x = SomeMethod("Some text")
Dim y = "Some other text"
Dim z = SomeMethod(y)
I doubt that you'd find this confusing in VB, so why should it be in JavaScript?
Re: Passing a variable as a parameter into getElementById()?
Originally Posted by blakemckenna
So, is my example correct? If it is, it's not working. I keep getting this error: "Uncaught SyntaxError: Unexpected end of input"
Where exactly does that happen? On the line that calls getElementById? If that line successfully returns an element then you're looking in the wrong place for a problem. You need to identify the actual problem before you can find a solution.
If it is on that line, what's the value of file1 and have you confirmed that an element with that id actually exists?
That third argument is a literal string and yet you have included variable names in there as though they will be automatically replaced with values. That should be:
Note that you were missing a dot too, so it wouldn't have worked even if they were replaced automatically.
Note that JavaScript also supports a feature akin to .NET string interpolation but it's not supported in (at least some versions of) IE so you can't use it if you want that wide browser support.
Re: Passing a variable as a parameter into getElementById()?
jmc,
I've attached a screenshot from Chrome DevTools. Also, the entire javascript is below. The getImages() function works as far as loading all the images onto the page. It's only when I click on a thumbnail do I get the error in the screenshot.
The showImage() function never executes because the alert statement never fires.
Code:
<script>
function getImages(dirLocation) {
var dir = dirLocation;
var fileextension = "jpg";
$.ajax({
//This will retrieve the contents of the folder if the folder is configured as 'browsable'
url: dir,
success: function(data) {
//This empty() statement clears the canvas so a new directory can be reloaded
$("#container1").empty();
//List all png file names in the page
$(data).find("a:contains(" + fileextension + ")").each(function() {
var pathName = this.href;
var strLen = pathName.lastIndexOf('/');
var fileName = pathName.substring(pathName.lastIndexOf('/') + 1);
var newFileName = pathName.slice(0, strLen, pathName) + "/" + dir + fileName;
var fileName2 = fileName.split('.', 1);
var div = "<div class='images'>" +
"<a href=''><img id='" + fileName2 + "' onclick='showImage('" + fileName2 + "')' src='" + newFileName + "' width='450' height='auto'>" +
"<div class='caption'></div></a></div>"
alert(div);
$("#container1").append($(div));
});
}
});
}
//
//
//
function showImage(file1) {
alert(document.getElementById(file1).value);
var largeImage = document.getElementById(file1).value;
largeImage.style.display = 'block';
largeImage.style.width=700+"px";
largeImage.style.height="auto";
var url=largeImage.getAttribute('src');
window.open(url,"_blank");
// window.open(url,'Image','width=largeImage.stylewidth,height=largeImage.style.height,resizable=1');
}
</script>
I'm assuming you mean the code in red. I'm trying to build this statement dynamically using single quotes and double quotes. If it is incorrect, I'm just not sure how to string that section of code together.
and that will be valid. You might also look into the string interpolation option I mentioned, if it will work for all the browsers you need to support. I can't recall the name used to refer to it in JavaScript.