Develop Reference

Ckeditor - why does my code fire twice? And how to fix it?

I downloaded the onchange plug-in (https://ckeditor.com/cke4/addon/onchange). Connect it in config.js:
config.extraPlugins = 'onchange';
I wrote the following code in config.js:
CKEDITOR.on('instanceReady', function (ev) {
var editor = ev.editor;
editor.on('change', function() {
console.log('zzz');
});
});
And now when I write something in my editor, zzz is output twice. Why is that? Should be output once.

Try this:
CKEDITOR.on('instanceReady', function (ev) {
var editor = ev.editor;
console.log('aaa');
editor.on('change', function() {
console.log('zzz');
});
});
Is 'aaa' output twice also? I'm guessing that you're instantiating the editor more than once.

I deleted the line:
config.extraPlugins = 'onchange';
And everything began to work as it should.

Javascript toggle paging on all dataTables

I'm struggling to make a js function that will toggle paging on all the dataTables on my page. What am I doing wrong?
Note: whenever I run togglePaging() in the Chrome console, I get undefined as a response.
var globalPaging = true;
function togglePaging() {
globalPaging = !globalPaging;
$('.dataTable').each(function(){
var oTable = $(this).dataTable();
var oSettings = oTable.fnSettings();
oSettings.aoColumns[1].bPaginate = globalPaging;
var oTableDT = $(this).DataTable();
oTableDT.draw();
});
}
$(document).ready(function(){
$('table.toDataTable').DataTable({
"bPaginate": globalPaging
});
});
Here's a demo:
jsfiddle.net/8n1nj0bu
Update: Here is the solution I went with, derived from Teddy's answer: jsfiddle.net/jyf8h2je

The draw() function update your table content only. If you want change other property, maybe you need re-init your table.
Draw API: https://datatables.net/reference/api/draw
My example:
$('.dataTable').each(function(){
var oTableDT = $(this).DataTable({
"bPaginate": globalPaging,
"bDestroy": true
});
});
https://jsfiddle.net/8n1nj0bu/1/
This solution has an disadvantage that is you need re-init all your properties.
Note: My FF43 cant run onclick, so I use jquery instead.

Result not match for text area (jQuery)

I have a question which concerns jquery.urlive plugin. This plugin is used to graph content from other website and generate to HTML element, so I use it to
develop my personal project. I have a problem which I don't know how to solve, should I customize the library or are there solutions?
I would like to duplicate text area more than 2 (let's say I have done with duplication), but they are the same functions, which means when there is url in the text area one and then the result will appear for result one and others are the same.
Obviously my problem when there was url on text are one, all the results for other text are also shown.
Here is my code: http://jsfiddle.net/samphors/4KftC/77/
Thanks for helping.

You need to call the urllive only for the changed element
$('.demo').on('input propertychange', function () {
var $this = $(this),
$ct = $this.next();
$this.urlive({
container: $ct,
callbacks: {
onStart: function () {
$ct.html('<span class="loading">Loading...</span>');
},
onSuccess: function (data) {},
noData: function () {
console.log('y')
$ct.html('');
}
}
});
}).trigger('input');
Demo: Fiddle

if(f.match(urlPattern) && d == true){
var o = f.match(urlPattern), link = o[0];
$(".frame").attr("src",link);
d = false;
}
try this
http://jsfiddle.net/4KftC/79/

Javascript not working when jquery is added

I am new to javascript n jquery. I used javascript along with jquery on my script tag.When jquery is not added, the javascript works fine,but when a jquery function is added, the script is not working.....shall i convert both to javascript or both to jquery or am i missing anything.Here is my script
<script type="text/javascript">
function getLocations() {
$.post('#Url.Action("getLocations","Home")', { 'id': $("#cities").val() },
function (data) {
$("#loca").html(data).show();
});
}
$(function () {
$('.submit').on('click', function () {
var ck = "";
var city = $("#cities option:selected").text();
var location = $("#loca option:selected").text();
alert(city+"and"+location)
}
});
</script>
here i am loading location based on the city selected.Its works fine when the onclick is not there,But when added ,location are not loading n the function is not calling.I have tried by butting alert inside it.Do i need do any thing else for both to work....Thank You

you forgot a )
$(function () {
$('.submit').on('click', function () {
...
}) // <---
});
if you properly indent the code blocks and if you look on the javascript console, this kind of errors become easier to be detected. Just adopt an indent style and write code adhering to it.

Separating JS to multiple files

There are multiple pages on my web-project working with exactly same JS functions. I was copying and pasting same functions to all pages' js files. But recently seperated common functions to another js file named common_fns.js, for every page created just selector cached variables and placed at the top of every page in order some_page.js, common_fns.js . Something like that
some_page.js
$(function() {
var closer=$("#nlfcClose"),
NewFormContainer=$("#NewLessonFormContainer"),
opener=$("#nlfcOpen"),
NewForm=$("#NewLessonForm"),
OpsForm=$("#LessonOps"),
SelectBox=$( "#courses" ),
SelectBoxOptions=$("#courses option"),
jquiBtn=$(".jquiBtn"),
AddOp="AddLesson",
DelOp="DelLesson";
});
common_fns.js
$(function() {
SelectBoxOptions.text(function(i, text) {
return $.trim(text);
});
SelectBox.combobox();
jquiBtn.button();
closer.button({
icons: {
primary: "ui-icon-closethick"
},
text: false
}).click(function(){
NewFormContainer.slideUp("slow");
});
opener.click(function(){
NewFormContainer.slideDown("slow");
});
NewForm.submit(function(){
var querystring = $(this).serialize();
ajaxSend(querystring, AddOp);
return false;
});
OpsForm.submit(function(){
var querystring = $(this).serialize();
ajaxSend(querystring, DelOp);
return false;
});
});
It was working when I copied and pasted common functions to every pages' file. But now it doesn't: Firebug shows error message undefined SelectBoxOptions even for first function. What am I missing? Only way to copy-paste same functions into every pages' js file?

You are declaring local variables inside the event handler, that's why you can't use them in the next event handler.
Declare the variables outside the function:
var closer, NewFormContainer, opener, NewForm, OpsForm, SelectBox, SelectBoxOptions, jquiBtn, AddOp, DelOp;
$(function() {
closer = $("#nlfcClose");
NewFormContainer = $("#NewLessonFormContainer");
opener = $("#nlfcOpen");
NewForm = $("#NewLessonForm");
OpsForm = $("#LessonOps");
SelectBox = $( "#courses" );
SelectBoxOptions = $("#courses option");
jquiBtn = $(".jquiBtn");
AddOp = "AddLesson";
DelOp = "DelLesson";
});