Questions tagged [javascript]

JavaScript (JS) is a client side script language which allows to interact with the user, control the browser, communicate asynchronously, and alter the document content that is displayed. By default Magento 1 comes with the prototype.js library and Magento 2 comes with jQuery. Use 'prototype-js' and 'jquery' tags for questions about those libraries.

Filter by
Sorted by
Tagged with
33
votes
2answers
42k views

Extending / Overriding JS in Magento 2

As Magento2 is using RequireJS for loading scripts, and there's no more skin folder, I've stuck with a problem: How can I replace Magento's module JS file by my modified version? For example — the ...
38
votes
5answers
48k views

How To add JS file in frontend for all pages

I've read 3 pages of Google Results on how to load a JS file for all pages and still am not able to do it. I've got a few doubts, hope somebody can clear them out. Do I need to create a module ...
14
votes
4answers
25k views

PageSpeed - Eliminate render-blocking JavaScript and CSS in above-the-fold content

I am running magento 1.9, and I am using the RWD slider that comes with Magento 1.9 on the home page. Google's PageSpeed doesn't like this and says: Eliminate render-blocking JavaScript and CSS ...
35
votes
7answers
34k views

Move all Javascript includes to before </body>

Does anyone know how to have all of Magento's JS script tags e.g. <script type="text/javascript" src="http://sitename.com/js/prototype/prototype.js"></script> render out before the closing ...
9
votes
5answers
20k views

How to call Owl Slider in Magento2

If we want to add Owl Slider in Magento 1.X then we follow below steps. Copy owl.carousel.min.js and owl.carousel.js and paste into skin/frontend/pakage_name/theme_name/js Copy owl.carousel.css and ...
36
votes
1answer
13k views

Product.OptionsPrice is not a constructor magento 1.9.3

I have upgrade magento 1.9.2.4 to 1.9.3. I am facing the following error in the console in product page. TypeError: Product.OptionsPrice is not a constructor var optionsPrice = new Product....
4
votes
1answer
3k views

Unable to use jQuery

Alright, I am trying to do a very simple thing: use jQuery in my myScript.js file. I'm on Magento 1.9.0.1. The theme I am building is based on the built-in rwd theme, which by default loads jQuery 1....
18
votes
2answers
9k views

Google CDN jQuery with Local Fallback in Magento Layout XML

I've done the following to include jQuery from Google CDN in Magento: <default> <reference name="head"> <block type="core/text" name="google.cdn.jquery"> <...
11
votes
3answers
11k views

JS errors Magento 2

I've been trying to finish something and publish it online this entire weekend, it's some how broken and I have no idea why so I hope someone can help me out. I've tried adding custom jQuery into my ...
16
votes
3answers
10k views

Get Base Url Or Dynamic Url In view Js or html files

I figure it out to get dynamic url in the front end if I need I can simply define mage/url and the use it as url.build('<Modulename>/<controllername>/<action>/') When I tried the ...
15
votes
1answer
7k views

Magento2: How can I override core js module price-box.js

I need to extend Magento_Catalog/js/price-box.js. I have used the 'mixins' feature, but it's not working for price-box.js. requirejs-config.js: var config = { config: { mixins: { ...
7
votes
2answers
16k views

How to add external js in Magento 2

I want to add the following link in the head tag, but its returning 404 error. Can anyone help me on this? <script type="text/javascript" src="https://www.google.com/recaptcha/api.js"></...
7
votes
3answers
4k views

Magento 2 add script before closing body tag

What is the proper way to add a script before the closing body tag in magento 2? I want it to be available to all pages. UPDATE: I've got in myvendor/mytheme/Magento_Theme/layout/default.xml with: ...
5
votes
3answers
1k views

Custom javascript not working

I'm trying to inject a scroll to anchor javascript globally in Magento 2. More specifically this script: $('a[href^="#"]').on('click', function(event) { var target = $(this.getAttribute('href'));...
1
vote
2answers
86 views

Magento 2: jQuery Datatables Button Extentions Not Working

============================UPDATED 1.1============================ I'm new to Magento 2.3, I'm trying to apply jQuery DataTable(DONE), after than, I want to add it's Button Extension, for that i ...
0
votes
2answers
4k views

Adding JS to the checkout

How to add custom JS to just the checkout page? I found this tutorial, but as far as I can tell it will add JS to the entire site.
24
votes
10answers
22k views

Merged JS and CSS do not work when Production mode

I was in developer mode, everything was great, when I changed to Production mode, the Merged options of CSS and JS seem to be ignored, it was back listing all css and js. Also the product page only ...
18
votes
4answers
18k views

Magento 2: requirejs-config.js in themes?

Is it possible to include a requirejs-config.js file (or otherwise configure RequireJS) via a Magento theme? Or is the capability reserved for Magento modules? The dev docs information on theme ...
11
votes
9answers
19k views

Magento 2: Not loading CSS and JS after successful installation in windows

CSS and JS not loading after installation of Magento 2 default template OS: Windows 10 Xampp Control panel V3.2.2 PHP version: 5.6.28 Server: Apache/2.4.23 (Win32) phpmyadmin Version information: 4....
6
votes
3answers
5k views

Magento 2: How to Solve Defer parsing of JavaScript on CDN?

My website in Production Mode & I set Javascript to be Merged. So we have only one JS file. On Speed related website it keep saying F grade on Defer Parsing of Javascript. I'm using CDN. <...
16
votes
4answers
5k views

Magento2 localisation Javascript

A similar question was already asked here: Magento 2 javascript text translations, but Magento updated this translation technique in the beta version. How can I add or update translations used by ...
6
votes
1answer
2k views

Magento 2 Plugin implementation for js frontend?

A plugin as far as I read is created for intercepting a PHP function call and running code before, after, or around that function call. Is there a way how to accomplish that in js file? How can i ...
7
votes
2answers
1k views

Extend massactions.js

I need to extend a javascript from the new ui module that features the new admin grid system. Extend a default Ui component give me a hint, and I was able to setup some code: # file: app/code/My/...
3
votes
1answer
9k views

Magento 2: How to include JS on the product page?

I'm trying to get a custom js on the product page, I'm using Magento 2, what's the page I need to edit to do that? I've already tried to create a local.xml into /app/design/frontend/Venustheme/yume/...
3
votes
1answer
1k views

Call to a member function getAccountNo() on null Magento 2

I'm extending shipping method section in checkout page, and it's showing well. But it's throwing error while clicking next button after filling shipping address and shipping method information in ...
1
vote
1answer
925 views

Managing extension conflict on js files

I have and (community) extension that switches the product images when you change the options of a configurable product. This works great. I've also developed some extension that changes the select ...
3
votes
1answer
2k views

Changing the address book drop down (for shipping) from drop down list to radio buttons

I need to know how to change the address book drop down on a registered account checkout to radio buttons (similar to Amazon)
16
votes
4answers
19k views

Adding a jQuery Library to Magento 2

How can a third party developer add a jQuery library to Magento 2? While Magento 2 includes a version of jQuery in their frontend themes, the jQuery object is not immediately available in the global ...
18
votes
2answers
30k views

Custom form Validation - Magento

I am trying to implement some custom form validation in Magento using jQuery but I am not sure if I have the correct method. Basically, I need to validate the following: Only number fields need to ...
14
votes
3answers
5k views

Magento 2: Syncing Backend and Frontend State/Cache

Does Magento 2 have any systems or abstractions for managing state between the backend and the local storage on the frontend? I'm working on porting a feature for restoring a user's abandoned cart ...
8
votes
4answers
23k views

Use require-config.js to load files needed on all pages

I know how to use require-config.js in custom theme, but I would like to use custom javascript file (myfile.js) on all pages. In which directory should I add require-config.js and how to use it, so ...
4
votes
4answers
16k views

Defer parsing of JavaScript in Magento

i analyzed my website on Gmetrix.com for for optimization and the result was this: 361.0KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page ...
9
votes
1answer
6k views

How to access the Magento API from native client with JavaScript

I need to access the Magento API from a local JavaScript based application (Titanium Desktop) and wondering what's the best way to do so. What I found out so far: The only authentication mechanism ...
2
votes
2answers
5k views

Magento2: Add external JS globally

I'm trying to add external js in my module which will be applicable on all pages on frontend. This is the process I've followed: 1. Code in my layout file app/code/Lapisbard/General/view/frontend/...
5
votes
2answers
18k views

Add custom js in head in magento2?

I have custom module. I want add file my.js in folder app\code\Xanka\Slider\view\frontend\web\js\slider\my.js. I used code in app\code\Xanka\Slider\view\frontend\layout\default.xml <head> &...
2
votes
2answers
7k views

How to add external JS to CMS Page

I'm trying to add an external javascript file to a CMS page using the Layout Update XML feature, and have had no luck. I have tried the following <action method="setText"><text><![...
7
votes
4answers
4k views

Magento2 getting 'Constr is not a constructor' error for custom theme

I am not sure what this error is and if it is affecting anthing, however this is coming into my console: layout.js:64 Uncaught TypeError: Constr is not a constructor (layout.js line 64)
4
votes
2answers
4k views

Configurable product image not switching with swatch change

I am trying to get configurable swatches working in a custom theme in a 1.9 build. I am basically using this method of importing the functionality in the theme. The swatches are working fine, they are ...
2
votes
2answers
2k views

overriding/extending price-options.js does not work

I need to override/extend the file price-options.js. But it does not work, I always get the error TypeError: undefined is not a constructor on this line $.widget('myCompany.mypriceoptions', $....
2
votes
1answer
5k views

Magento 2 - Load custom javascript with requirejs

The Problem I want to use custom JavaScript in Products/Inventory/Catalog page to modify the "Add Product" button behavior and hide some fields in product edit form (where the SKU, weight, name, qty, ...
1
vote
2answers
2k views

How to use Javascript to display page messages

Is it possible to use JavaScript to display a page message? I would like to display one when I receive an ajax response on a custom module I'm working on. You can see an example of one of these ...
0
votes
1answer
8k views

Selecting Default option for configurable product

I have a website selling handsets. The flow of website is. There are two categories 1) Phone on plans 2) prepaid phones Now what we have set is a configurable product having two drop down 1) Phone ...
12
votes
2answers
1k views

Magento 2: What's an `<each/>` Tag?

As near as I can tell, when you view a Grid in Magento's backend, the following "loaded over XHR" KnockoutJS template is what starts rendering things File: vendor/magento//module-ui/view/base/web/...
4
votes
3answers
2k views

Magento 2: move the javascript to the end of the body

As Magento 2 migrated away from Prototype I was expecting that this would be fixed in M2. So, is there a way (easy or not) to move all the <script> tags to the end of the <body> tag ...
6
votes
6answers
6k views

Why is js breaking with requirejs in templates on Magento 2 and how to fix?

I am using a custom theme called Porto for Magento 2. I have found an issue where when I load the page with dev tools enabled and having disable cache checked, a number of js errors pop up. Most of ...
5
votes
4answers
9k views

Magento 2 customer-data.js:90:23 [object Object]

I'm using Magento 2.2 with Porto theme and getting an [object Object] javascript error at customer-data.js line 90 in the console after logging into the store and refreshing the page or switching to ...
4
votes
3answers
26k views

Add a javascript to any cms page magento

I would really like to use this on a single cms page in magento. For some reason it will not show the content. page with script <script type="text/javascript" src="http://code.jquery.com/jquery-1....
3
votes
1answer
6k views

How use RequiredJS to execute the JS after the DOM ready?

I'd like to execute my JS after the DOM ready using RequiredJS instead of this: $(window).load()
3
votes
1answer
8k views

Add Javascript File To Head For Create Block

I need to create a block programatically (for various reasons): $myblock = Mage::app()->getLayout()->createBlock('namespace_module/path', 'my_block', $params); This works fine, but the ...
3
votes
5answers
4k views

Magento2 does not showing images/css/js

I have installed Magento 2 but for some reason all the css/js/images are not loaded. Below are the steps I follow to install Magento 2 Create a sub-domain on cpanel Downloaded Magento and uploaded ...