The functions mentioned here are deprecated. The correct way to use JavaScript in Moodle is documented on [[JavaScript_guidelines]]. ...you can use the Firefox [[Web developer extension]]: ''Information > View JavaScript''.

...relevant. See [[Javascript_Modules]] for information on Javascript coding guidelines in Moodle. To view the previous text for this page check the history.

...or plain HTML must be designed and tested according to aria accessibility guidelines. ...nterface complies with "Level AAA Conformance to Web Content Accessibility Guidelines 2.0"

== What is JavaScript? == JavaScript is a scripting language widely used for client-side web development. It is

This article will act as a guide for users reporting errors related to JavaScript in Moodle. Generally, when debugging JavaScript errors in Moodle, we will ask for a number of things. This will likely incl

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Form''' Date selection: use javascript selector (how about time?)

<h4 class="card-title">Guidelines</h4> * [[Coding|Coding guidelines]]

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Link''' ...are still bookmarkable, can be opened to a new tab, and still work without javascript.

Moodle has officially chosen to use the YUI JavaScript library and it is encouraged to use that wherever possible. That being said You will also need to decide where to load the JavaScript. Moodle can load JavaScript into either the pages head, or at the bottom of the page (footer). Loading

This page forms part of the [[Security|Moodle security guidelines]]. ...splaying an advert from <nowiki>http://makemerich.com/</nowiki>. Then, and JavaScript code in the advert cannot access anything on your page.

...ing, Javascript loaders, Javascript Build Tools, Javascript Combo Loading, Javascript Accessible Widget Libraries, Templates for Renderers === Prechecking against Moodle coding guidelines from your command line ===

== JavaScript == JavaScript is included in different ways now and will need to be migrated, see the PHP

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Radio button''' ...itation directly, but you can use checkboxes and then script it either in Javascript or server side, in PHP.

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Wizard''' ...be undone or is in some other way potentially dangerous, consider adding a javascript warning dialog confirming the user wants to continue.

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Checkbox''' ...not support this limitation directly, but it has to be scripted either in Javascript or server side, in PHP.

This page is the top-level page describing Moodle's coding guidelines. It's the place to start if you want to know how to write code for Moodle. ...portant that all developers strictly follow our [[Security|Moodle security guidelines]].

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Big Select List''' * Some users may not have javascript support on, so it cannot be depended on

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''User Data Always (Always) Safe''' ...n dialogs (such as preventing accidental leaving of an unsaved form with a javascript dialog) are frustrating to users. In some situations it may be smart to all

This page forms part of the [[Security|Moodle security guidelines]]. ...For example, by using a cross-site scripting vulnerability to include the JavaScript window.close() in a forum post.

# the forum code does not match the current coding guidelines. ...is one of the oldest components in Moodle and precedes many of the current guidelines and best practices that we currently follow. As a result, much of the code

...g forces behind updating the forms library are a desire to create forms in JavaScript, and to make the current mforms work in php 7. Current tests show that php ...nto the text. So alterations will be made to make these elements work with JavaScript.

This page also summarises all the key guidelines. ...s from teacher roles because even basic SCORM packages consist of html and javascript which needs to use user session.

The Moodle JavaScript coding style. ...eptions to the general Moodle [[Coding_style|Coding style]] which apply to JavaScript.

*** Policy for naming layout and CSS selectors should go into the coding guidelines as the consistency there is crucial. ** Totara has developed standard UI widgets, guidelines/style guide

[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Major usability issues in Moodle''' == Making Moodle more fluid with javascript/YUI controls/AJAX ==

1. Read All Coding guidelines. - javascript

It is written in JavaScript itself, and written as a [http://nodejs.org Node.JS] module which can be in Shifter takes your source JavaScript file(s), along with some meta-data, and wraps it all together into a built

==JavaScript and CSS required by your plugin== If your plugin needs custom CSS of JavaScript, you can just add files called styles.css and/or script.js in the plugin fo

...r simulation tools like Selenium, which interacts with browsers and allows JavaScript events simulation. === Javascript ===

Plugin's Javascript modules written using AMD or ES6 format. (AMD, supported since Moodle 2.9, * [[Javascript Modules]]

This document describes style guidelines for developers working on or with Moodle code. It talks purely about the me ...g/ LESS] works like CSS with some extra features. It should follow the CSS guidelines.

...d to upgrade your icons by adding some SVG files. Use the following design guidelines to produce an icon that plays well with the core ones. ...for advanced devs because you need to implement the mustache handlers for javascript as well as the php class. The icon_system_fontawesome is a working example

...way for developers and themers to deal with these issues (can go in coding guidelines) ==Proposed solution 3 - JavaScript ==

...ere are no exact matches to this kind of instructional overlay in the WCAG guidelines. The overlay is a cross between a Modal Dialog, and a non-modal Dialog. Be These are JavaScript libraries which take configuration (usually JSON) and produce tours to disp

* Moodle forms can be displayed in JavaScript using 'fragments'. ===Adding Javascript===

...ript_Modules|JavaScript modules]] your question type needs. (Old YUI-style JavaScript in yui/ or module.js would still work, but is not recommended.) #If the question type uses complex CSS or JavaScript, repeat this testing in different web browsers.

...e rendered both on the server side in PHP as well as on the client side in JavaScript. Themes can override the default templates. Moodle uses [https://mustache.g == Rendering in JavaScript ==

...lines the exceptions to the [[Coding style]] and [[Javascript/Coding Style|JavaScript Coding Style]] which apply to the Moodle App and also includes rules for ot Note that much of the existing code may not follow all of these guidelines — we continue to upgrade this code when we see it.

| Javascript modules in Moodle 2.9 and higher * Q: Are there any guidelines / rules around when to create more than one commit within a tracker item? I

'''Project outcome: [[Moodle_User_Interface_Guidelines|Moodle User Interface Guidelines]]''' This project will create a a lightweight Human Interface Guidelines style documentation for Moodle, as part of a review of Moodle's overall use

Physically, a Moodle plugin is just a folder of PHP scripts (and CSS, JavaScript, etc. if necessary). Moodle core communicates with the plugin by looking fo '''JavaScript library:'''

* Items to usability test (and from these, potential UI guidelines) * UI guidelines

** remove the hack to load css via javascript to hide the repaginating form ...ylesheet shows the repaginate form on the page. This needs to be hidden in javascript IN HEAD so that the code to change the CSS is loaded before the page is ren

...ease version in version.php after any change in /db/ folder, any change in javascript code, any new auto-loaded class, any new setting and also after any change ...nd all caches reset. Bump up version after changing /db/, /lang/, theme or JavaScript.

* Client-side JavaScript improvements have been made, mostly successful so far ** There are new guidelines for creating new icons including standard colours to match standard icons

The situation of having a single JavaScript driven element was considered but even then it is better to style only clas ...nly be given to elements and HTML nodes that need to be interacted with by JavaScript.

It is also possible to add JavaScript actions (component_action objects) to an action. These attach a JS listener Attached JavaScript actions get initialised when the properties for the action are retrieved so

This document describes '''style''' guidelines for developers working on or with Moodle code. It talks purely about the me Note that much of the existing Moodle code may not follow all of these guidelines - we continue to upgrade this code when we see it.

All parts of the interface should be consistent. We need to have a set of guidelines and core frameworks to better restrict what developers are allowed to do, w * MDL-14542 Modification to improve javascript and css header insertion for blocks, modules and filters

=== [[HTML_Guidelines|HTML Guidelines]] === * Activity module authors should attempt to follow guidelines in pages to achieve semantic consistency

* MOBILE-1084 - JavaScript is Shows in the course * MOBILE-818 - Decide the development process, coding guidelines for the new team

...an) other compiled languages such as C++, but '''many times faster''' than JavaScript. ...development and is mainly kept to correspond to the dates, objectives and guidelines mentioned in the GSoC program. The application with basic functionality can

* html files possibly containing images, css, applets and javascript * javascript that loads media via relative links (eg imagine an auto-generated slideshow

..., CiBot is not checking all file types (it happens, for instance, with the Javascript files). * the icons abide by our [https://docs.moodle.org/dev/Moodle_icons icon guidelines] with regards to size, design and format