Setting a link name in javascript, with PHP variable

Question

What I am trying to do is load a page, get a PHP variable into JavaScript, and set my element (Link) to said variable. Then, when you click on the link, I would like it to change from open or close to close or open. For some reason, the other solutions I have looked at don't seem to work. What seems to be the issue with the following code? I'm slightly confused as to why this isn't working.

<script type="text/javascript">
var state =  "<?php echo $var; ?>";
document.getElementById('open').text = state;
function toggleText(button_id) 
{
   if (document.getElementById('button_id').text == "Open") 
   {
       document.getElementById('button_id').text = "Close";
   }
   else 
   {
     document.getElementById('button_id').text = "Open";
   }
}
</script>
<a id="open" onclick="toggleText('open')" href="#"></a>

Thanks a lot, this is the last leg of my project, and for some reason whatever I try wont make it work.

Notice: I have also tried instead of .text .innerHTML and it also did not work.

your script is running before the dom is ready, either use an onload event or put the script at the end of the body. Also its innerText,innerHTML,or textContent not text — Patrick Evans
– Patrick Evans, Commented Aug 31, 2014 at 23:40

Leetfail · Accepted Answer · 2014-09-01 00:10:30Z

1

<script type="text/javascript">
document.getElementById('buttonid').innerHTML = "<?php echo $var; ?>";
function toggleText(button) 
{
   if (button.innerHTML == "Open") 
   {
       button.innerHTML = "Close";
   }
   else 
   {
     button.innerHTML = "Open";
   }
}
</script>
<a id="buttonid" onclick="toggleText(this)" href="#"></a>

Put script after </body> tag

edited Sep 1, 2014 at 0:10

Leetfail

1331 gold badge3 silver badges12 bronze badges

answered Aug 31, 2014 at 23:42

user3874324

Sign up to request clarification or add additional context in comments.

Comments

Sheldon Juncker · Accepted Answer · 2014-08-31 23:44:51Z

1

Have you checked the console? It's always the place to start.

Part of the problem is that you have button_id in single quotes. I assume that button_id is a variable name, and should not be in quotes. Also, you should be using innerHTML instead of text.

This should work:

<script type=.innerHTML/javascript">
var state =  "<?php echo $var; ?>";
document.getElementById('open').innerHTML = state;
function toggleText(button_id) 
{
   if (document.getElementById(button_id).innerHTML == "Open") 
   {
       document.getElementById(button_id).innerHTML = "Close";
   }
   else 
   {
     document.getElementById(button_id).innerHTML = "Open";
   }
}
</script>
<a id="open" onclick="toggleText('open')" href="#"></a>

answered Aug 31, 2014 at 23:44

Sheldon Juncker

6171 gold badge7 silver badges18 bronze badges

Comments

andrew · Accepted Answer · 2014-08-31 23:40:13Z

0

try calling document.getElementById('open').innerText= state; on window.onload

window.onload=function(){
     document.getElementById('open').innerText= state;
}

The problem could be that the dom is not ready (the page is not fully loaded) when you try to set the text property

answered Aug 31, 2014 at 23:40

andrew

9,6039 gold badges36 silver badges62 bronze badges

Comments

Bob Brown · Accepted Answer · 2014-08-31 23:44:16Z

0

Try this: <a id="button_id" onclick="toggleText('open')" href="#">open</a> And put the script just before the closing </body> tag.

answered Aug 31, 2014 at 23:44

Bob Brown

1,5222 gold badges13 silver badges27 bronze badges

Collectives™ on Stack Overflow

Setting a link name in javascript, with PHP variable

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related