Last call to make your voice heard! Our 2022 Developer Survey closes in less than a week. Take survey.

Questions tagged [javascript]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
1 vote
1 answer
17 views

Escaping quotes of an entry string used inside a script tag

How can I display an entry string, with included special characters (like single and double quotes) , inside a script tag without translating these special characters into html entities but escaping ...
user avatar
  • 49
1 vote
1 answer
34 views

Hiding categories in real time with Sprig in a faceted search

I've built three buttons with checkbox dropdowns that display categories that filter the content below based on categories. I am currently using the relatedTo function to only display the categories ...
user avatar
0 votes
0 answers
17 views

Entry Looping Template With Javascript and 500 Internal Server Error

I'm working with a looping mechanism in my Twig code that loops through entries and displays them for a kiosk type of application. The loop itself works for the most part, although after a few hrs, it ...
user avatar
  • 368
1 vote
1 answer
119 views

404 Error Controller Action From Jquery But Not Url

I'm able to call my controller action directly from a url in the browser and get the proper response but when I call it from a page with js I get a 404 error. I'm working off the solution found here ...
user avatar
1 vote
1 answer
13 views

I have a custom table in my craft plugin at the backend and I have to include custom sorting on each field of the table using javascript

The Table includes this field: Name Age City State
user avatar
1 vote
1 answer
53 views

Loading JavaScript on Template Load

I'm working on a kiosk-type plugin which will cycle through all news entries, beginning upon template (or page) load. It needs to load a JavaScript ajax script for this on page/template load. Would ...
user avatar
  • 368
1 vote
1 answer
36 views

Showing and hiding details (price, sale price, sku etc)when product variant is selected on details page

I currently have price, sku and variant title swapping when clicking between variants on a products details page. This works with AlpineJS and looks something this. https://codepen.io/amasci/pen/...
user avatar
  • 1,824
2 votes
1 answer
70 views

Re-initialize / layout Masonry after a sprig change

I've got Sprig set up to filter entries by a few categories. I'm trying to re-layout Masonry JS after this update takes place. For starters, I add Masonry to the window variable (defined as global in ...
user avatar
  • 251
3 votes
1 answer
353 views

Interpret TWIG's {% js %} as <script> in PHPStorm

Does anyone know how to get PHPStorm interpret {% js %} as <script> for correct syntax highlighting in PHPStorm? Background: I'am always doing this: {% js at endBody %} {% if false %}<...
user avatar
1 vote
1 answer
61 views

Populating Matrix Blocks with JavaScript

I need to populate a matrix block field with JavaScript in the control panel. I've got the data ready, but i can't figure out how to add it. I've located a function called addBlock() in MatrixInput.js ...
user avatar
  • 155
1 vote
1 answer
262 views

Output javascript inside twig variable

I am using the Enupal Stripe Payments plugin to pass line items to Stripe. The line items get passed in an array. I want to use a javascript cart to hold the items in local storage, reformat that and ...
user avatar
1 vote
1 answer
121 views

How to include Inline JavaScript?

Is there any way to add javascript in craft
user avatar
1 vote
1 answer
740 views

How to include external JavaScript in place?

We include an external script from a vendor and the URL doesn't end in .js. It returns JavaScript that creates a widget in place. I was able to fake it out by adding a '&js=.js' parameter but it ...
user avatar
  • 387
1 vote
2 answers
226 views

How to get an input value without refreshing with twig?

One way to read a dynamically inserted value is to refresh the page and get it in a twig variable through the url, something like this: {% set amount = craft.app.request.getQueryParam('amount') %} ...
user avatar
1 vote
2 answers
25 views

Plugin Settings Color Input Javascript Event Listeners

Is it possible to attach JavaScript event listeners to the colour input field in a plugin's settings page, so that when a user selects a colour with the picker I can run an AJAX request?
user avatar
1 vote
0 answers
56 views

Sprout Forms Recaptcha js error - everything flagged as spam

I'm using the Google reCAPTCHA plugin with Sprout forms. I'm trying to use an invisible reCAPTCHA badge, but I'm getting a js error on page load: Unhandled Promise Rejection: TypeError: null is not an ...
user avatar
  • 950
1 vote
1 answer
477 views

Input and Use Twig Variable in External JS Script Across Different Pages

I have created a _layout.twig file which acts as my base to hold content on the page -> _layout.twig: <!DOCTYPE html> <html lang="{{ craft.app.language }}"> <head> ...
user avatar
  • 111
2 votes
2 answers
80 views

javascript module question

Hi hope you can help with this and hoping it's simple. I need to write a javascript module and would like to use the js tag: {% js %} //script here {% endjs %} This is good because it only ...
user avatar
  • 177
2 votes
1 answer
516 views

JS login form on different domain and handling the CSRF token

Having sorted out the CORS issue and succesfully logging into Craft from a different domain using Javascript, I've now turned CSRF protection back on. I've got a module returning the CSRF token name ...
user avatar
0 votes
0 answers
144 views

How to load more entries of a category on that category's page with Element API?

Following up on previous questions of mine: How to use multiple different instances Element API "Load More" button? I have a website that utilizes the "load More" (button) method ...
user avatar
1 vote
1 answer
79 views

How to use multiple different instances Element API "Load More" button?

Following up on a previous question of mine: How to skip the first few entries in a "load more" scenario with Element API? I have a website that utilizes the "load More" (button) ...
user avatar
1 vote
1 answer
73 views

How to skip the first few entries in a "load more" scenario with Element API?

I have a website that uses a "load more" button. The process for this button can be found here: http://craftsnippets.com/articles/infinite-scrolling-and-lazy-loading-with-craft-cms I made it ...
user avatar
1 vote
2 answers
973 views

Load More Entries Button

I am trying to make my entry loop have a load more button, and not sure how to do it. I tried the method from http://craftsnippets.com/articles/infinite-scrolling-and-lazy-loading-with-craft-cms but I ...
user avatar
0 votes
0 answers
24 views

Undefined this.$overflowTabBtn.data(...) initTabs Craft.js:11326:51

I'm getting this error on one Solspace calendar (2.x) event entry form, but not another. The only difference seems to be two asset fields, and one entry reference field. It's the only page the error ...
user avatar
  • 387
1 vote
1 answer
85 views

Click counter for links (craft v2)

So I'm new to PHP and ok with Javascript. I have a page on my site with a long list of external links, would it be possible to add a counter to be displayed next to each link that shows how many times ...
user avatar
2 votes
2 answers
553 views

How can I get cookies that were set in javascript from a twig template? [NEW]

This question was already asked a few years ago, and the way of doing it was through a plugin. I was wondering if there is a way of doing it just using Craft and Twig. I set up a cookie using ...
user avatar
1 vote
1 answer
561 views

Ajax post request front-end csrf token

I'm trying to make a simple post request with ajax to a controller in plugin. The problem I'm having is that I always get a 400 Bad request because I don't send a valid CSRF Token. But I can't figure ...
user avatar
  • 195
1 vote
1 answer
68 views

Access table from Globals in script

In the Globals I have a field which is of type table. I was trying to access this table in the javascript in order to get the values of particular rows. <script> var myTable = "{{ ...
user avatar
1 vote
2 answers
1k views

Can a plugin add JS or CSS to the control panel in Craft 3?

I want entries in a specific PlainText field for a named group to be pre-filled with random content. I am aware of the https://github.com/lukeyouell/craft-randomkeygenerator plugin and am aware that I ...
user avatar
1 vote
1 answer
91 views

Craft 2, MySQL database, Twig, JavaScript files

I have created in Craft 2 CMS, under the profile of users (ex. parents), new tab for (children), where parents can fill in there children information. The data is saved in a database under the ...
user avatar
0 votes
1 answer
163 views

For loop through custom field in JavaScript

I'm using a script to animate four sets of numbers on a page. I would like the numbers to be editable from within the admin (a SuperTable field). Currently I have this: <ul class="counters"> ...
user avatar
  • 1,173
1 vote
0 answers
43 views

Can scripts loaded as ES Modules work with Live Preview?

How can a script loaded as an ES module be reinitiated after changes are made in Live Preview? In my experience a script loaded as a module is executed the first time Live Preview is opened, but then ...
user avatar
2 votes
2 answers
102 views

How can I add Google MarkerClusterer library to Smart Map?

I started to work with Craft CMS a couple month ago, I have a client that wants to have a clustered map, I went over Smart Map documentation but I couldn't find anything about on how to add Google ...
user avatar
  • 99
1 vote
1 answer
203 views

Setting a new / override shippingAddress via axios

I am trying to change/set a customers shippingAddress via axios It does work e.g. for setting the shippingMethod or the quantity for a product. However if i want to set a new shippingAddress the ...
user avatar
  • 1,064
1 vote
1 answer
149 views

Setting Google maps circles using Smart Map plugin

So, I'm trying to set circles around marker locations using Smart Map and some JS. I've got the following which gives no errors, but outputs no circles. $(function () { $.each( smartMap.marker, ...
user avatar
  • 912
1 vote
0 answers
324 views

How can I edit multiple entries via multiple front-end forms using Vue.js?

I found this post. However, writing a plugin in currently not an option, and I'd like to do this with Vue.js since I'm already using it for form validation & other stuff. Also, this involves ...
user avatar
1 vote
1 answer
122 views

includeJs not consistently working

Using Craft 2 and I have a Matrix Block which can contain a carousel item, which uses JS/jQuery. Because the content editor can add multiple instances of this Matrix Block I can’t set up these ...
user avatar
1 vote
1 answer
74 views

Can I add custom JS to Sprout Form?

I'd like to be able to attach custom JS to a Sprout Form which can be managed in the form builder. I need to add logic that will switch the email address of the recipient based on a choice from a ...
user avatar
3 votes
1 answer
211 views

Setting the position of a Smart Map marker on the front end

I'm using Smart Map in a front end entry form and trying to set the position of a marker as the user enters their address. I can get the lat/lon lookup working but I'm stumped with the marker itself. ...
user avatar
  • 1,979
1 vote
1 answer
751 views

Make an Ajax call to plug-in controller

I am trying to send data to my plug-in controller using jquery $.post() method. here is my form: <form method="post" action="" accept-charset="UTF-8" id="testForm"> {{ csrfInput() }} <...
user avatar
1 vote
2 answers
397 views

Verbb Comments plugin - Can't see comment replies

I recently installed Verbbs Comments plugin on my Craft site, which seems all well and good except that I can't toggle the comment replies. ('2 comments' when clicked does nothing) Everything else ...
user avatar
  • 407
1 vote
1 answer
181 views

Plugin field-type not getting javascript variable?

Updating a plugin from Craft 2 to Craft 3, so this logic used to work. The plugin has a field-type which is a button. When clicked, the button does stuff depending upon another field. That handle(ID) ...
user avatar
  • 1,263
1 vote
1 answer
150 views

Garnish event when changing category group

When I am on the categories index (admin/categories), is there a Garnish event that fires when you select a different category group in the sidebar? I want to add some custom JS after the AJAX request ...
user avatar
1 vote
1 answer
88 views

How to initiate a date picker when template is loaded remotely from controller action

I have a controller action which returns JSON with a rendered template. This template uses date picker form fields. How can the date picker JS be initialized since the html is returned through JSON. ...
user avatar
  • 2,707
1 vote
1 answer
723 views

How can I reload the Live Preview Iframe window using JS

I tried to reload the iframe window using JS but haven't had any luck getting the lp-iframe iframe element, I was thinking I could do it using the Window.Craft object but not sure how? setTimeout(()=&...
user avatar
0 votes
1 answer
397 views

Ajax pagination not loading last entries if not equal to pagination number

I've got ajax working on a page but if the number of articles is not exactly 3 (this is the pagination limit) then the remaining 1 or 2 entries do not get loaded. I'm not sure why or how to resolve ...
user avatar
  • 1,897
2 votes
1 answer
309 views

Craft 3 js - extend the field layout designer field settings

I would like to have the ability to include a custom option in the field layout designer field settings. There is already a plugin for Craft 2 that uses this feature Relabel for Craft And I would ...
user avatar
1 vote
1 answer
429 views

Craft 3 - custom callback after Garnish onDragStop

I would like to trigger a custom javascript function after an element in a matrix block was moved in the matrix but I'm not sure how to attach the event without changing the MatrixInput.js. So far I'...
user avatar
1 vote
1 answer
831 views

How to set up a social media feed with vue and axios

What I need is a social media stream with posts with the Hashtag mnbasel form Instagram, Facebook and Twitter. I couldn’t find any good tutorial. Hopefully someone can tell me what I miss or lead me ...
user avatar
2 votes
1 answer
199 views

How to extend Craft.BaseElementIndex for a custom Element Type

I have a custom Element and need to modify the Element Index page. I'm attempting to extend Craft.BaseElementIndex and register the extended class on my Element Index Page. I'm working on a plugin for ...
user avatar
  • 13.2k