9

You can do this using PhpStorm’s Language Injections feature. In fact, as of PhpStorm 2017.3, it has included support for {% script %} tags out of the box. To extend that to {% js %} tags, go to Preferences → Editor → Language Injections, and search for “twig: custom statement javascript”. Double-click on it to edit it, and add the following line to the ...


3

This is oddly similar to this question. The problem is that your Sprig component includes the wrapper (the div with the masonry class), so reloading the Sprig component not only replaces the items, but also the wrapper itself. Masonry keeps a reference to this wrapper (the element masonry was initialized with) and uses it to find new children. Since the ...


2

Yes you would do this using Javascript so is a little outside the scope of this StackExchange site but here's something that might help get you moving... Getting the value is easy with something like document.querySelector('#myElement').value You'd need to trigger that in some way, perhaps when the user leaves the field. So (assuming your input has an ID of ...


2

From Craft CMS documentation page about requesting controller action: when you send action as parameter, format should be without '/actions': <input type="hidden" name="action" value="plugin-handle/controller/action"> and you can directly open that URL directly- with 'actions' at the beginning as default actionTrigger - ...


1

Please follow the below steps. Use a sorting class for each field. <table class="data"> <thead> <tr> <th class="sorting" >Name</th> <th class="sorting">Age</th> <th class="sorting">City</th> <th class=&...


1

While there is no reason it wouldn't work using the onload attribute of the <body> element, you could also consider using a twig {% js %} tag. The {% js %} tag allows you to register JS to be added in your page from anywhere in your template. By default it will be added at the end of the <body> element, which guarantees your HTML document is ...


1

So, I actually decided a slightly different approach in the end and not sure if it is better or less performant, but I feel gives me a little more flexibility. Basically, more like a 'tabbed' approach that shows the right div based on the option selected. This allows me to be a little more flexible with the information and layout I want in that area of the ...


1

This is not documented because the P&T team sees this as internal functionality I guess. Looks like the control panel is going to be rebuilt in version 4 anyways probably in Vue. So you would have to rewrite your entire script too. If it‘s going to be Vue there is probably no way to use their JS API anyways. Even if it sounds funky I would suggest you to ...


1

Since Twig is server-side, and Javascript (usually) is client-side, you would need to change your code's logic so that the desired value you need inside that Twig command can be injected using javascript on the client's side. Then you could send that data back along with the rest of the submission. If you need server-side javascript, you would want to look ...


1

You can use {% js %} Twig tag. It is essential to using JS in Twig. It takes JS code passed to it and appends it at end of the template, right before ending body tag. Multiple js tags can be used - content from each of them will be concated with the rest. You don't need to wrap code passed to {% js %} into <script> tags - js will do that for you. {% js ...


1

In your template you can use the <script src=""> tag as it's a combination of the html and twig. So it will load your external javascript files. Also you can use the inline javascript or javascript file using this tag {% js %} like below. {# Use for JS file #} {% js "/assets/js/script.js" %} {# Use as a JS code block #} {% js %} ...


Only top voted, non community-wiki answers of a minimum length are eligible