How to pass PHP value to external JavaScript file

Question

I am trying to pass my variables from my main page to external JS file. Please see my code.

Main page:

<script type="text/javaScript">
$(document).ready(function(){

var add_project_link="<?= base_url().'add_project/show_form'; ?>";
var add_agent_link="<?= base_url().'agent/add_agent';?>";
});

</script>

External JS

 $(document).ready(function(){
    alert(add_project_link);
    alert(add_agent_link);
  });

I got:

uncaught referenceError add_project_link is not defined.

I thought the external JS would catch the variable declared in main page. Any thoughts? Thanks a lot!

Don't define your JavaScript variables inside jQuery's $(document).ready(function(){ }); on the main page. The entire point is to define them BEFORE you call jQuery's external file. Look at my answer. — hohner
– hohner, Commented Mar 7, 2012 at 10:43

hohner · Accepted Answer · 2012-03-06 15:49:47Z

13

Before you call your external JavaScript file, define your variables using PHP:

<script type="text/javascript">
   var site_url = '<?php echo site_url(); ?>';
   var current_url = '<?php echo current_url(); ?>';
</script>
<script type="text/javascript" src="file.js"></script>

In your external file.js you can now use site_url as a variable.

edited Mar 6, 2012 at 15:49

answered Mar 6, 2012 at 15:36

hohner

11.6k8 gold badges51 silver badges85 bronze badges

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

1 Comment

Yoann Over a year ago

I think it echo and not return you should use to make this code works

charlietfl · Accepted Answer · 2012-03-06 15:37:00Z

5

Take your php generated variables out of document ready. They are not accessible anyhwere else in your code due to closure of the ready event function they are in

answered Mar 6, 2012 at 15:37

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Comments

mikevoermans · Accepted Answer · 2012-03-06 15:38:20Z

3

What I would do is to store those variables to something easily called by JS later.

<input type="hidden" id="hidden_var" value="<?= base_url().'add_project/show_form'; ?>" />

var add_project_link = $('#hidden_var').val();

answered Mar 6, 2012 at 15:38

mikevoermans

4,00725 silver badges27 bronze badges

Comments

Ngalam City · Accepted Answer · 2012-03-07 01:58:28Z

2

You just write in the head tag

<script type="text/javaScript">    
var add_project_link="<?= base_url().'add_project/show_form'; ?>";
var add_agent_link="<?= base_url().'agent/add_agent';?>";
</script>

Then load your External JS after the script above

answered Mar 7, 2012 at 1:58

Ngalam City

1121 silver badge6 bronze badges

1 Comment

FlyingCat Over a year ago

this is what I have. no luck though. +1

Ankit · Accepted Answer · 2017-07-26 14:40:06Z

2

best way is to to store those path in some tags like

<span id="site_url" style="display:none;"><?php echo site_url(); ?></span>
<span id="current_url" style="display:none;"><?php echo current_url(); ?></span>

then you can access this this using jquery like

$('#site_url').html();
$('#current_url').html()

edited Jul 26, 2017 at 14:40

Ankit

33 bronze badges

answered Mar 7, 2012 at 11:30

karan

2222 silver badges7 bronze badges

1 Comment

mickmackusa Over a year ago

While this technique can work as desired, this advice may be needlessly bloating the DOM with otherwise unnecessary elements/nodes.

Mild Fuzz · Accepted Answer · 2012-03-06 15:35:01Z

1

the simplest thing to do is to bring the script into a script tag on the php page

you can go down the URL string variable route, but it's unnecessary I think

answered Mar 6, 2012 at 15:35

Mild Fuzz

31.3k34 gold badges106 silver badges152 bronze badges

Collectives™ on Stack Overflow

How to pass PHP value to external JavaScript file

6 Answers 6

1 Comment

Comments

Comments

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

1 Comment

Comments

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related