4

I need to pass a php var to a jQuery script. They are in separate files, one file to php code and another file to jQuery scripts. Is there a way of doing it? I am using Joomla 3.4.1. I just need to get Joomla version in the jQuery script.

4

Javascript have global variables : http://www.w3schools.com/js/js_scope.asp

inside you php file you call: JFactory::getDocument(); and you can now add some javascript at the current page with addScriptDeclaration()

In this example, we declare a myJoomlaVersion variable

    <$php 
$jdocument = JFactory::getDocument(); 
$jversion = new JVersion(); 
$short = $jversion->getShortVersion(); 

// Add Javascript 
$jdocument->addScriptDeclaration(' var myJoomlaVersion = '.$short ); ?>

More info about "Inserting inline scripts from within a PHP file" https://docs.joomla.org/J3.x:Adding_JavaScript_and_CSS_to_the_page

Now you can use this variable into your javascript.

2
  • Thank you for your help. I'm getting the following SyntaxError: expected expression, got '<' – n.h. Jun 24 '15 at 14:53
  • I have edited my code. A small type on it This new one should work better – Pierre-André Vullioud Jun 25 '15 at 14:45
8

After this question was originally answered, Joomla introduced in version 3.5 another way of passing variables to javascript, using the addScriptOptions() method of the Joomla Document class. So I'm just adding this to make other people who are interested in this question aware of this alternative.

In your php file you can write eg:

$phpvars = array('alpha' => 1, 'beta' => 'test', 'gamma' => null);
$document = JFactory::getDocument();
$document->addScriptOptions('myvars', $phpvars);

Then in your javascript you can retrieve the values using:

var jsvars = Joomla.getOptions('myvars');
console.log(jsvars);

which will output on the browser console the Javscript Object structure:

{alpha: 1, beta: "test", gamma: null}

You can obviously use this multiple times in your code, using different keys (the key being 'myvars' in the example above).

4
  • 2
    Though this is a more recent addition to Joomla than the original answer, this is the correct answer for any modern Joomla component – user101289 Jan 5 '20 at 20:45
  • @Robbie Jackson, I am trying to implement an Openlayer map into my application i accordance with your tutorial. In order to reduce overhead I need to compile an openlayers "bundle" in node.js but node.js does not know what "Joomla.getOptions" means. Do you happen to know how joomla has implemented this mechanism? Then I could probably create a "stub". Thanks a lot. – SoaringBird Apr 3 at 22:15
  • @SoaringBird as far as I remember, Joomla just puts these variables into a script tag which it embeds in the document. You should be able to see it via your browser devtools inspector. The Joomla.getOptions js code is in /media/system/js/core-uncompressed.js in your joomla (3.9 ish) instance. Looking at it, it does a document.querySelectorAll() call to find them, so I reckon you could replicate that code without a great deal of difficulty. Best of luck! – Robbie Jackson Apr 5 at 19:31
  • Thanks a lot @Robbie Jackson. We have been writing on our solutions simultaneously. I just updated my question at joomla.stackexchange.com/questions/28963/… with a solution I found myself but yours is better. You are definitely right in your tutorial at docs.joomla.org/J3.x:Developing_an_MVC_Component/Adding_a_Map: It takes a steep learning curve to get into Openlayers. – SoaringBird Apr 5 at 19:49
1

You can achieve this with the use of a global function.

So, in your JS file, you would do something like this:

<script>
    var myFunction;

    jQuery(document).ready(function($){

        myFunction = function(version)
        {
            console.log(version);

            // You have the version here
        }

    });
</script>

Then, in your default.php, you can get the Joomla version and call the function like so:

<?php 
    $jversion = new JVersion(); 
    $short    = $jversion->getShortVersion();
?>

<script>
    jQuery(document).ready(function($){

        myFunction('<?php echo $short; ?>');

    });
</script>

Hope this helps

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.