PHP base URL in external js file

Question

I have few JS in HTML page, if I use this in HTML view file then its working fine, my page submit form correctly without any issue.

But when I moved this JS codes to external JS file, then it shows error,

Below is my JS

$("#user_fm").submit(function (event) {
    event.preventDefault();
        $.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>index.php/admin/peoples/add_user",
            data: $("#user_fm").serialize(),
-----

my problem is clear to me, that in view page this is easily get decoded to my url

"<?php echo base_url(); ?>index.php/admin/peoples/add_user"

but when i keep this in JS file it show like below in console,

POST http://localhost/center/index.php/admin/peoples/%3C?php%20echo%20base_url();%20?%3Eindex.php/admin/peoples/add_user

How can we put PHP codes in JS file?

You can make a global base_url variable in javascript and assign it manually. — Tony
– Tony, Commented May 18, 2015 at 12:20
you can also write in the view file like <input type="hidden" name="baseurl" id="baseurl" value="<?php echo base_url(); ?>"> in javascript baseurl = $('#baseurl').val(); — NIRANJAN S.
– NIRANJAN S., Commented May 18, 2015 at 12:22
Note that you can refer to base url using a slash /. In JS, you can use location.host or location.hostname. — kosmos
– kosmos, Commented May 18, 2015 at 12:23

n-dru · Accepted Answer · 2015-05-18 12:43:07Z

9

To be able to embed PHP in html or javascript code, like <?php echo base_url();?>, the file must have .php extension, while your external javascript file certainly has .js extension. Besides .js files are parsed by the browser, while PHP files must be executed on the server.

What you can do is to first define a variable in inline javascript, and then use it in code of external .js files. In index.php or whatever main file you use, place this before you use your external js code:

<script type="text/javascript">
var baseURL = "<?php echo base_url(); ?>";
</script>

And then in your external code:

$("#user_fm").submit(function (event) {
    event.preventDefault();
        $.ajax({
            type: "POST",
            url: baseURL + "index.php/admin/peoples/add_user",
            data: $("#user_fm").serialize(),
-----

edited May 18, 2015 at 12:43

answered May 18, 2015 at 12:21

n-dru

9,4402 gold badges31 silver badges43 bronze badges

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

1 Comment

always-a-learner Over a year ago

For Using This Solution Just Keep in mind that you have to put the Script tag before the external js script. Thanks @n-dru

Vipul sharma · Accepted Answer · 2015-05-18 12:46:56Z

1

clearly you cant access. Run your script with XXAMP YOU need to turn apache service on so that php can read YOUR base URL

answered May 18, 2015 at 12:46

Vipul sharma

1,2551 gold badge15 silver badges35 bronze badges

Collectives™ on Stack Overflow

PHP base URL in external js file

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related