Link to home
Start Free TrialLog in
Avatar of jellydeal
jellydeal

asked on

how to reference an element using a variable

Hi,

I am struggling to reference an element using the standard JQuery format :

This works using getelementbyid:
section=1
var log_var='log_id,'+ section 
$( document.getElementById( log_var )).val('TEST')	

HTML:
<input id="log_id,1" type="hidden" />

Open in new window


but this does not:
section=1
var log_var='log_id,'+ section 
$( '#'+ log_var )).val('TEST')	

HTML:
<input id="log_id,1" type="hidden" />

Open in new window


I seem to have to be referencing all my elements using the first method, Can anyone let me know what Im doing wrong? BTW.. The elements are not generated witin JQuery  dynamically, they are hardcaded in the html.

Thanks
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

 section=1;
var log_var='log_id\\,'+ section;
$( '#'+ log_var ).val('TEST');

Open in new window

Too many closing brackets

$( '#'+ log_var )).val('TEST')	

Open in new window

Should be
$( '#'+ log_var ).val('TEST')

Open in new window

Avatar of jellydeal
jellydeal

ASKER

Sorry Julian,
That's just a typo on the sample code.
There's the correct amount of brackets in the real code.
Hi scott,
Are you saying the comma is a special  character?
I have never used a character in the ID before so to be honest this was new to me.  Your first example you are using javascript and the 2nd jquery.  With jquery it looks like that has to be escaped.
ASKER CERTIFIED SOLUTION
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Works for me
<!doctype html>
<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript">
$(function() {
section=1;
var log_var='log_id,'+ section;
$( '#'+ log_var ).val('TEST');
});

</script>
<style type="text/css">
</style>
</head>
<body>
<input id="log_id" type="text" />
</body>
</html>

Open in new window

The comma is not an issue (refer previous post) - you should be able to refer to it directly

Online version here

Works in FF and Chrome
julianH, try using the input  id with a comma like "log_id,1"
<input id="log_id,1" type="hidden" />

Open in new window

http://jsbin.com/vosuquye/1/edit?html,output
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<title>Test</title>

<script type="text/javascript">
$(function() {
section=1;
var log_var='log_id,'+ section;
$( '#'+ log_var ).val('TEST');
section2=2;
var log_var2='log_id\\,'+ section2;
$( '#'+ log_var2 ).val('TEST2');
});  

</script>
<style type="text/css">
</style>
</head>
<body>
<input id="log_id,1" type="text" />
<input id="log_id,2" type="text" />
</body>
</html>

Open in new window

@Scott

You are correct - my test case excluded the comma in the input
I've requested that this question be closed as follows:

Accepted answer: 500 points for padas's comment #a39869938

for the following reason:

This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
Thank you