Questions tagged [javascript]
Use for questions about JavaScript code that is very specific to Drupal.
3,201
questions
-1
votes
1
answer
19
views
How to add a script tag into a twig page template?
I am trying to insert a script tag into a page twig template but it appears that Drupal 9 doesn't allow that. Specifically, this is what I am trying to do:
<script>data-entry-id="{{$id}}&...
- 1,485
-2
votes
0
answers
15
views
gutenberg module giving errors when adding web pages [closed]
i keep getting this error when i am trying to add a page to my website using gutenberg module. Added a picture of the display screen. Could someone help figuring out this issue.
TypeError: Cannot read ...
0
votes
3
answers
97
views
Why does not this code work?
attach: function(context, settings) {
console.log('enter');
var element = once('addedtocart', '#addtocart', context);
element.on('click', function () {
var ...
- 32
0
votes
1
answer
42
views
A Drupal.behaviors stops working when I update the module
I have checked the field_ui core module to understand how to update my code, but it doesn't seems to work.
This is the code.
(function ($, Drupal, drupalSettings) {
Drupal.behaviors....
- 966
-1
votes
1
answer
54
views
jQuery selector does not find the view content after document.ready event
I am applying some jQuery to make a slick carousel from a Drupal view.
The carrousel does not work erratically on page load; sometimes, it does, sometime it doesn't.
jQuery(($) => {
$(document)....
- 3,329
0
votes
0
answers
38
views
Form States not working when compressed javascript is enabled
I have visible states setup for a 2 fields that correctly work when javascript aggregation is disabled. When I turn JS aggregation on both fields are visible no matter what option I select on the ...
- 438
0
votes
0
answers
84
views
How can I disable a specific javascript function in my base theme?
There is a single javascript function in my base theme that I want to disable and I haven't been able to figure out how to do that.
I have read the documentation on how to disable a whole file with ...
- 329
0
votes
1
answer
46
views
How can I add an external/third party library with type = 'module' using drupal_add_js()?
drupal_add_js('path_to_external_JS_file_on_CDN', [
'every_page' => TRUE,
'type' => 'external',
'defer' => 'defer',
'attributes' => [
'async' => true,
'type' =...
0
votes
1
answer
92
views
How can I add drupalSettings values with the #attached array?
In D7, we have used drupal_add_js with DrupalSettings for accessing php variables to javascript files, for that we have used in D7 in my custom function like below
function custom_function($data)
{
...
0
votes
0
answers
28
views
Why is my javascript settings variable empty in Chrome/Edge, but it works in Firefox?
My javascript file starts like this...
var my_global_var;
(function ($, Drupal, drupalSettings) {
'use strict';
Drupal.behaviors.myBehavior= {
'attach': function attach(context, settings) {
...
- 1,059
0
votes
0
answers
72
views
Select media popup is not opening after upgrade ckeditor from 4 to 5 Drupal
We have drupal version 9.5.7 in our website, When we had upgrade ckeditor4 to ckeditor5 then Select media popup(for image and video) is not opening.
Console error: ajax.js?v=9.5.7:411 An error ...
- 101
0
votes
0
answers
92
views
How can I fire a Google analytics tag event on every form post?
I want to see statistics for forms submissions, grouped by type of forms. I am using Google Analytics 4 (https://www.drupal.org/docs/contributed-modules/google-analytics/using-google-analytics-4x). I ...
0
votes
0
answers
34
views
Use javascript code in a specific div of the webform page
I have a website that was set up using Webforms with page breaks. So on the same URL, there are multiple "pages" and div blocks on each page, with a progress bar on top so you know what &...
- 1
1
vote
0
answers
95
views
How do I alias jQuery to $ before loading a remote library?
I am trying to use Bootstrap autocomplete in my module. I added this to my .libraries.yml.
bootstrap-autocomplete:
remote: https://bootstrap-autocomplete.readthedocs.io/en/latest/
version: 2.3.7
...
0
votes
1
answer
118
views
Use AJAX On Node Add Form To Change Field Required Status
On a node/add form I have a pair of fields that need to be able to control one another. The first field allows a user to enter a birthdate, the second field allows the user to say the birthdate is ...
1
vote
0
answers
59
views
How to subscribe to a view render event?
I'm writing a module that will inject javascript into the page when a view is rendered. The contents of the javascript will depend on the results returned in the view, so ideally I would have access ...
0
votes
0
answers
65
views
Views UI javascript is broken
I discovered today that the Views UI is broken on one my sites. I'm not sure when it broke, because the Views UI is not one of the things I check after updates.
I'm currently at 9.5.3.
My Views UI ...
0
votes
0
answers
79
views
Close menu (details element) after klicking anchor menu link
I have made a "Table of contents menu" on my Drupal 9 website. Here a link to a page with the menu. I use the "Paragraphs module" to add headers to my content and use views to ...
- 69
0
votes
1
answer
207
views
Dynamicaly add ajax form item and add event on checkbox
I've added an ajax callback to my form to add some data on it :
$form['add'] = [
'#type' => 'button',
'#value' => t('add'),
'#ajax' => [
'callback' => [$this, '...
- 103
0
votes
1
answer
160
views
Add js library to custom ckeditor4 plugin
How can an external JS library be integrated into Drupal for use within a custom Ckeditor4 plugin?
My custom plugin needs to set a javascript cookie each time I click on the plugin icon and unset when ...
- 1,700
1
vote
1
answer
56
views
How to translate a link defined in javascript with Drupal.t()
I have a template string that contains a link, which I want to translate afterwards throught the Drupal UI:
var html = `<p>${Drupal.t('<a href="/node/16">Check this out</a>'...
- 43
0
votes
1
answer
46
views
How do I lock down a child theme to use jQuery 3.6.0?
My older site uses bootstrap 3 and has been working great when accessed from a mobile phone and the hamburger menu kicks in, but something has happened in jQuery 3.6.2 (In Drupal 9.5.0) that causes ...
- 1
0
votes
0
answers
64
views
Ajax call brings all the Javascripts of drupal ruining the original page javascript
Based on this solution https://www.drupal.org/docs/7/api/javascript-api/simple-drupal-ajax-load-with-jquery-and-delivery-callback
I'm brining with an ajax call, a multistep form. The ajax brought ...
- 41
1
vote
1
answer
75
views
Can we export json schemas for type script usage?
We have a Drupal installation that acts as a backend and a front end that uses the HttpClientModule from Angular to query this data.
Thanks to the typescript base, we can provide the functions of this ...
- 27
0
votes
1
answer
173
views
Why don't I see Asset Injector code directly in the HTML?
I’m having trouble getting the Asset_Injector module to work, and would like to find out why it's not working.
As a simple test, I want to insert some CSS using the module’s CSS injector:
#container ...
0
votes
3
answers
2k
views
Google API callback doesn't work
I've created this javascript (delivery.js) that is supposed to take a pre-existing div on a webform page and append a Google Map to it, along with a few circles of differing radius.
Here is my ...
- 21
0
votes
2
answers
130
views
Webform javascript CSS selectors with table
I'm currently trying to add javascript via the settings tab for a webform that is supposed to dynamically update the displayed totals at the bottom of the webform page for the user.
A part of this ...
- 21
-2
votes
1
answer
237
views
How to load a dependency in the <head> in drupal 9?
I have followed the official documentation, but it doesn't work
global-styling:
version: VERSION
js:
js/bootstrap.min.js: {}
js/custom.js: {}
css:
component:
css/style.css:...
- 99
0
votes
1
answer
72
views
I can't load inline jQuery
I have a Drupal 9 page, where I am trying to load some inline jQuery code, from CKEditor, but it isn't working and I am not getting any error on the console.
This worked perfectly in Drupal 8.
<...
- 31
0
votes
0
answers
80
views
Why does adding data- attributes to JavaScript libraries prevent them from being aggregated?
I'm having an issue with adding a data attribute to my preprocessed / aggregated javascript within my theme.
When I have preprocessing disabled, I am able to add a data attribute to individual files ...
- 1
1
vote
1
answer
93
views
drupalTranslations is not defined [closed]
I'm an Angular front-end developer. I work with a team that uses Drupal for content.
The scenario is that we use Drupal.t() to translate the strings.
When I translate the word from the back-office, it ...
- 111
0
votes
0
answers
75
views
Submit webform via custom button
I want to update a webform submission via custom button.
On the same page as my webform I created a custom button in a block.
<button id="myButton" onClick="submitWebform()" ...
0
votes
0
answers
128
views
How can I add inline JavaScript on a page returned from a custom controller (not with a library)?
How can I add another render element that contains my custom JavaScript code?
Do I use ['#attached']['html_head'] or code similar to the following one?
$build['body']['script'] = [
'#type' => '...
- 307
0
votes
0
answers
79
views
Cannot set properties of null (setting 'innerHTML') error for anonymous users when loading iframe
I have a custom module that is displaying a twig template with an iframe inside it:
There is JS file also being loaded and when I load the page while I'm logged in as an admin, the iframe shows up ...
- 81
3
votes
1
answer
312
views
Is there a way to define a JS library that will use a CDN as a fallback
Is there a way to define a JS library that will use the CDN as a fallback?
Example: Define a billboard.js library that will use the local version of files from libraries directory and fall back to one ...
- 165
-1
votes
1
answer
582
views
How do I implement an AJAX callback?
Given is a Drupal 9 project.
How can I make use of Drupal functionality through an AJAX call?
web/modules/custom/mymodule/src/Appointment.php
namespace Drupal\mymodule;
class Appointment {
public ...
-1
votes
1
answer
198
views
'setAttribute' causing UncaughtDOMException with jQuery Dialog?
I'm using jQuery and the jQuery UI Dialog module (here) to check for new nodes of type "call" every few seconds. Forgive me if I don't know too much about it as I just started using it. Here'...
- 21
0
votes
1
answer
107
views
Not receiving dropdown of custom autocomplete textfield
I am currently trying to create a postcode lookup which returns a street name in an autocomplete dropdown.
To do this I have created a new module containing the following files:
src/Controller/...
- 1
1
vote
0
answers
236
views
JSON-API upload image file
I have been struggling to set up headless Drupal with React js. I did manage to upload the image via JSON API, as per instruction here
But I am not able to display the image. It would be great if ...
- 11
0
votes
0
answers
169
views
Custom block JavaScript not loading for anonymous users
I've created a custom block (via Drupal admin) that uses Twitter's API to insert tweets into a page. The necessary JavaScript loads for authenticated users but not anonymous users.
I configured the JS ...
- 103
0
votes
1
answer
121
views
Toggle (show or hide) visibility of content type field in view depending on relationship with other content type
I have a member content type that displays info about a company's member. One of the fields is named member publications, and it's a link to a blog view where the publications of the member (another ...
- 3
0
votes
0
answers
84
views
Manipulate the DOM with jQuery just before the page loads
Because of accesibility tests i need to manipulate the html of my page just before it loads completely. I dont want to manipulate contrib modules i am using, so i need to do it with jQuery.
In fact, i ...
- 275
1
vote
2
answers
66
views
Make views output more dynamic with knockout.js or other similar framework?
I am currently experimenting with knockout.js so i can make views output more dynamic.
I know React and angular among other newer frameworks are recommended but i do not want to create single page ...
- 19
0
votes
1
answer
956
views
Is there a way to use jQuery?
I heard Drupal 10 will no longer support jQuery out-of-the-box.
Is there a way to use jQuery in Drupal 10?
My guess would be that adding jQuery to a module's composer.json file would allow jQuery code ...
- 667
1
vote
1
answer
1k
views
Drupal.Behavior fires multiple times while logged in
Some of my Drupal behaviors are firing multiple times while as a logged-in user:
(function myFunction (Drupal) {
"use strict";
Drupal.behaviors.myBehavior = {
attach: function attach ...
- 1,997
0
votes
1
answer
371
views
Behaviors are only executed on some pages, while on others jQuery is not defined
In Drupal 9, I put the following JavaScript code for an image slider and a mobile navigation into a script.js file.
(function($, Drupal, drupalSettings) {
Drupal.behaviors.swiper = {
attach: ...
- 433
1
vote
0
answers
39
views
How assign new simple_oauth scopes?
I've a problem with simple_oauth module and scopes, on a D 9.3.x site.
I'm using it to authenticate user in a decoupled front-end in Next.js.
The case is:
A (new) user log-in without roles expect ...
- 835
0
votes
1
answer
113
views
Add an event listener to select list
I've attached the following js to an exposed views form field and it works on first page load but when the form is changed (by ajax) it doesn't fire.
I can't quite work out where to add an event ...
- 572
0
votes
1
answer
295
views
check if a page has been redirected and then add a class to a certain div
Im using the redirect module to redirect /page/scheduling to /page.
I need to check if the user arrived to a certain page by this redirect.
by checking this i will then add a class to a certain div.
...
0
votes
1
answer
3k
views
How upload a file\image via json api?
I'm trying to upload a file or image on a D9 site via json api. The test is namely to upload the user picture on the user entity.
I've been following the documentation or read questions about, but I ...
- 835