Welcome Guest, Not a member yet? Register   Sign In
using CI variables BASE_URL in JavaScript
#1

[eluser]Blues Clues[/eluser]
I am trying to use base_url value for accessing certain asset (jpg image) in my javascript and not able to get get the image loaded.

my view has the following code under "head"

_________________________________________________________
<head> content
_________________________________________________________

<head>
<link rel="stylesheet" type="text/css" href="<?php echo site_url('assets/css/droplinebar.css'); ?>" />
(script) type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">(/script)
(script) type="text/javascript" src="<?php echo site_url('assets/js/droplinemenu.js'); ?>">(/script)
(script) type="text/javascript">
//build menu with DIV ID="myslidemenu" on page:
droplinemenu.buildmenu("mydroplinemenu")(/script)
</head>

----------------------------------------------------------
my javascript has this code
----------------------------------------------------------
var droplinemenu={

arrowimage: {classname: 'downarrowclass', src: "<?php echo site_url('assets/images/down.gif'); ?>", leftpadding: 5}, //customize down arrow image
animateduration: {over: 200, out: 200}, //duration of slide in/ out animation, in milliseconds

buildmenu:function(menuid){

....
------------------------------------------------------------
The result (when I hover over the image location in the final html, I see this below...
Can someone help me with this...What's wrong with my code?
my assets folder is right in the same location as index.php
The same thing works fine, if I replace php code with the full URI string...
src: 'http://localhost/codeigniter172/assets/images/down.gif'
------------------------------------------------------------

http://</&lt;?php echo site_url('assets/images/down.gif'); ?&gt;
#2

[eluser]danmontgomery[/eluser]
Searching reveals a few solutions for this common problem Wink

http://ellislab.com/forums/viewthread/143381/
http://ellislab.com/forums/viewthread/139795/
#3

[eluser]Blues Clues[/eluser]
Thanks for quick response and they would work for me as well. But my question is what is wrong with my approach. I would like to understand the internals (how CI, CSS, JQUERY, and JS work together plus any caveats) a bit clear and avoid any similar pitfalls for the rest of adventure into this CI.
#4

[eluser]danmontgomery[/eluser]
The problem is unrelated to codeigniter, php tags aren't parsed in .js files
#5

[eluser]Blues Clues[/eluser]
Thanks so much. Makes perfect sense for security reasons etc.,.
I didn't know that for sure. But I read different confusing threads in different forums.

However my question is then, if I have view html file (main html), all the php snippets that I have in &lt;head&gt; section do get parsed and executed by the server. So the server looking for &lt;?php tags and replacing with the results. Are you saying it doesn't do the same with javascript files with the same &lt;?php tags?
#6

[eluser]MurkeyDismal[/eluser]
If you need to address the base_url() from within javascript set it as a variable in the head section.
Code:
&lt;script type=“text/javascript” src=”&lt;?php echo base_url();?&gt;assets/js/droplinemenu.js”>&lt;/script&gt;
&lt;script type=text/javascript&gt;
//&lt;![CDATA[
base_url = '&lt;?php echo base_url(); ?&gt;';
//]]>
&lt;script&gt;
Then you call it as part of the javascript
Code:
$('#exit').click(function() {
       location.href = base_url + "controller/method";
});
#7

[eluser]ggoforth[/eluser]
PHP parses/evaluates PHP files, not javascript files. If you want PHP to do what your wanting, you need to follow MurkeyDismal's advice, set the js value via php in the head of the php file being parsed.
#8

[eluser]icomefromthenet[/eluser]
If I'm using a jQuery closure e.g ($(document).ready()) and still need the base_url for non jQuery scripts. I use the alternate declaration.

Code:
$(document).ready(function(){
  window['BASE_URL'] = '&lt;?php echo base_url(); ?&gt;';
});
#9

[eluser]MurkeyDismal[/eluser]
Why would you want to decleare it in the document ready? Declare it in the head an then it is available throughout the document.
Code:
&lt;head&gt;
&lt;script type=“text/javascript” src=”&lt;?php echo base_url(); ?&gt;assets/js/droplinemenu.js”&gt;&lt;/script&gt;
&lt;script type=text/javascript&gt;
//&lt;![CDATA[
base_url = '&lt;?php echo base_url(); ?&gt;';
//]]>

$(document).ready(function(){
   $('#exit').click(function() {
       location.href = base_url + "controller/method";
   });
});
&lt;script&gt;
&lt;/head&gt;




Theme © iAndrew 2016 - Forum software by © MyBB