How to add a JQuery library in Magento 1.9

0

I was needing to add a Jquery library in magento 1.9, to use in one of my phtml pages, to insert masks in my fields, such as cpf, cnpj and etc ...

I've done a lot of research and I've noticed that the subject is very scarce, but very necessary, and I want to share this knowledge with you. There are a lot of details to watch out for, but with a lot of patience it works, I discovered the right and proper method to do this, and I also discovered the fast method if the first method does not work.     

asked by anonymous 11.11.2017 / 08:27

1 answer

0

I've done a lot of research, and I've got two solutions, the first is like this, you add the Jquery.js file you want to the magento / js / jquery / your-lib.js .

Once you've done this, you'll look for the page.xml file, and add an addJs method that points to the location where you inserted yourjquery.js file. (AddJS function, I will explain below)

Location Ex: app/design/frontend/default/seutema/layout/page.xml .

Right, by reaching page.xml you will see a method called addJS which is basically a native function of magento that aims to search the magento JS directory, the file you want to add. Pay close attention here, it's already set to look in the JS folder of the magento, so basically you will only type after that folder.

So let's for example add a JQuery.js library:

<action method="addJs"><script>jquery/nome-da-sua-lib-jquery.js</script></action>

Note that I did not type js / jquery /..... I just typed jquery /.... and so following what I said above, that js is already set and does not need to be referenced in your directory information.

Following these steps you will already have your Jquery library in your Magento, and then just use it to your liking. To find out what is working, reload the magento, activate the browser console and search the html for the head tag and see the jquery libraries there, if it is showing up there, it is ok.

IF YOU DID NOT GET USING THE FIRST (MOST RECOMMENDED) METHOD ... Remember it may be easier, but I advise you to use the first way ...

SECOND FORM

It's basically the first thing you think about doing something like that.

<script type="text/javascript" src="<?php echo $this->getJsUrl('jquery/nome-da-sua-lib-jquery.js')?>"></script>

Concluding Remarks: Jquery Magento 1.9 Syntax

In your .phtml file, when you try to use a function in your Jquery, using your library you just added, and receive some error. Try using this syntax style:

jQuery('input[id="billing:exemplo"]').mask("(00)00000-0000");
    
14.11.2017 / 21:13