Joomla! Issue Tracker - CMS

Download
Launch
Feeling Lucky

[#19641] - [4.0] Move some inline scripts to separate JS files

? Pending

User tests: Successful: Unsuccessful:

avatar C-Lodder
C-Lodder
11 Feb 2018

Pull Request for Issue #19640

Summary of Changes

Move some inline scripts for files in the layouts folder to separate JS files.

avatar C-Lodder C-Lodder - open - 11 Feb 2018
avatar C-Lodder C-Lodder - change - 11 Feb 2018
Status New ⇒ Pending
avatar joomla-cms-bot joomla-cms-bot - change - 11 Feb 2018
Category ⇒ Layout JavaScript
avatar C-Lodder C-Lodder - change - 11 Feb 2018
Title
…
[4.0] Layouts scripts
[4.0] Move some inline scripts to separate JS files
avatar C-Lodder C-Lodder - edited - 11 Feb 2018
avatar C-Lodder C-Lodder - change - 11 Feb 2018
The description was changed
avatar C-Lodder C-Lodder - edited - 11 Feb 2018
avatar dgt41
dgt41 - comment - 11 Feb 2018

This would be a good starting point for anyone that wants to get their fingers dirty with vanilla js.
I'll write some examples:
jQuery

jQuery(document).ready(function($) {
}):

Vanilla

document.addEventListener('DOMContentLoaded', function() {
}):

jQuery

if ($("#batch-category-id").length){
		var batchSelector = $("#batch-category-id");
}

vanilla

if (document.querySelector("#batch-category-id").length){
		var batchSelector = document.querySelector("#batch-category-id");
}

jQuery

$("#batch-copy-move").hide();
$("#batch-copy-move").show();

vanilla

document.querySelector("#batch-copy-move").style.display = 'block';
document.querySelector("#batch-copy-move").style.display = 'none';

jQuery

batchSelector.on("change", function(){
	if (batchSelector.val() != 0 || batchSelector.val() != "") {
 		$("#batch-copy-move").show();
 	} else {
 		$("#batch-copy-move").hide();
 	}
});

vanilla

batchSelector.addEventListener("change", function(){
	if (batchSelector.value !== 0 || batchSelector.value !== "") {
 		document.querySelector("#batch-copy-move").style.display = 'block';
 	} else {
 		document.querySelector("#batch-copy-move").style.display = 'none';
 	}
});
avatar C-Lodder
C-Lodder - comment - 11 Feb 2018

Better to use getElementById() over querySelector() for ID's if you're starting from the document. Much faster

avatar dgt41
dgt41 - comment - 11 Feb 2018

Sure I just did it with querySelector to be 1 - 1 conversion but @C-Lodder is right if you're querying an element through it's id (since id's are unique) you can use the getElementById method

avatar C-Lodder
C-Lodder - comment - 22 Feb 2018

Closing in favour of: joomla-projects/joomla-es6#57

avatar C-Lodder C-Lodder - change - 22 Feb 2018
Status Pending ⇒ Closed
Closed_Date 0000-00-00 00:00:00 ⇒ 2018-02-22 16:11:01
Closed_By ⇒ C-Lodder
Labels Added: ?
avatar C-Lodder C-Lodder - close - 22 Feb 2018

Add a Comment

Login with GitHub to post a comment