Trying to enable the button after validation - kendo-ui

Trying to enable the button on change event in kendo but it is not enabling the button can someone please help me to find what is happening
function onChange(){
if($("#firstNameProperty").val()!=''&& $("#lastNameProperty").val()!='' && $("#emailField").val()!='' && $("#selectOwner").val()!='' &&
$("#cprNumberProperty").val()!='' && $("#phoneField").val()!=''){
console.log("enabled");
$('#addToGrid').prop("disabled",false);
}
else{
console.log("disabled");
$('#addToGrid').prop('disabled',true)
}
}

It looks like you are using Kendo UI for jQuery, you can do this to disable:
$("#addToGrid").addClass("k-state-disabled");
and to enable:
$("#addToGrid").removeClass("k-state-disabled");

Related

How to restrict tab key handler event in gwt

I am using GWT components for web page. In my page I used ten text boxes. I want to block "tab" key event for navigate one text box to another text box.
Expected Approach: If I pressed tab key it wont go to another text box.
You can do somthing like this.
window.onkeydown = function() {
if (event.keyCode == 9) {
event.preventDefault();
}
}
Use NativePreviewEventHandler and use the logic mentioned by Mayank Pandya, which is
if (event.keyCode == 9) {
event.preventDefault();
}
Check for the Tabkey keycode. I am not sure about it.

jqGrid 'clearToolbar' without grid reload

I need to clear the toolbar without reloading the grid in my jqgrid. It should just reset the toolbar to its default values.
I tried using,
$("#TransactionsGrid")[0].clearToolbar();
My grid datatype:local and i don't use loadonce:true.
This made the toolbar clear and refresh the grid. I dont want that to happen.
Any ideas?
I find the question interesting.
To implement the requirement I suggest to use register jqGridToolbarBeforeClear to execute the handler only once. The handler should 1) unregister itself as the event handler and return "stop" to prevent reloading of the grid:
$grid.jqGrid("filterToolbar", { defaultSearch: "cn" });
$("#clearToolbar").button().click(function () {
var myStopReload = function () {
$grid.unbind("jqGridToolbarBeforeClear", myStopReload);
return "stop"; // stop reload
};
$grid.bind("jqGridToolbarBeforeClear", myStopReload);
if ($grid[0].ftoolbar) {
$grid[0].clearToolbar();
}
});
The corresponding demo shows it live.

Enable/Disable Spell Check in Ckeditor (SCAYT) dynamically

I'm using SCAYT plugin for ckeditor with multiple languages.I have enabled scayt automatically on startup. via code I want to disable spell check when the user chooses language as Chinese/Japanese in the dropdown through the code. How can I do this ?
Use editor.execCommand to do enable/disable SCAYT manually (via code):
CKEDITOR.instances.yourInstance.execCommand( 'scaytcheck' );
If you want to decide whether to enable SCAT or not on the startup, use pluginsLoaded event to override the config option (see: fiddle):
CKEDITOR.replace( 'editor', {
plugins: 'wysiwygarea,sourcearea,basicstyles,toolbar,scayt',
// Turn on SCAYT automatically
scayt_autoStartup: true,
on: {
configLoaded: function() {
// Disable SCAYT when japanese.
if ( this.config.language == 'ja' )
this.config.scayt_autoStartup = false;
}
}
} );
I just wanted to post what I had found because I didn't find anywhere in the forums that had the answer to the question "How do I enable/disable SCAYT dynamically?". This is how you can do it:
CKEDITOR.instances.editorId_1.getCommand('scaytcheck').exec()
This will run the command that gets called when clicking the "Enable/Disable" button.
As an update to this answer: I'm running CKEditor 4.6 and could only get this working with
CKEDITOR.instances[i].execCommand('scaytToggle');
So to iterate through all editors and toggle the scyat:
for (var i in CKEDITOR.instances) {
CKEDITOR.instances[i].execCommand('scaytToggle');
}

Bootstrap dropdown disappear with right-click on Firefox

I have some kind of problem with twitter-bootstrap and firefox.
I have a button and a dropdown menu with an input text. If I right click on the input ( for right-click + Paste for example), firefox closes the dropdown. And that quite boring.
Is there any solution for prevent that behaviour ?
Thanks !
As an immediate stop-gap workaround you can use something along the following lines to prevent the click event from propagating when the click event is a right-click
JS
$(document).on('click', function(e) {
e.button === 2 && e.stopImmediatePropagation()
})
This would need to be placed between jQuery loading and Bootstrap loading.
Plunk
However, this is a rather blunt approach and you'd probably be better off doing something more subtle if possible.
Update
One way to circumvent this issue in a more targeted manner is to disable the original event listener and replace it with one that checks for right-clicks first.
JS
// obtain a reference to the original handler
var _clearMenus = $._data(document, "events").click.filter(function (el) {
return el.namespace === 'data-api.dropdown' && el.selector === undefined
})[0].handler;
// disable the old listener
$(document)
.off('click.data-api.dropdown', _clearMenus)
.on('click.data-api.dropdown', function (e) {
// call the handler only when not right-click
e.button === 2 || _clearMenus()
})
Unlike the previous example, this code would need to run after Bootstrap has loaded.
Plunk
For Bootstrap 3 you have to update the namespace to bs.data-api.dropdown.
JS
// obtain a reference to the original handler
var _clearMenus = $._data(document, "events").click.filter(function (el) {
return el.namespace === 'bs.data-api.dropdown' && el.selector === undefined
})[0].handler;
// disable the old listener
$(document)
.off('click.data-api.dropdown', _clearMenus)
.on('click.data-api.dropdown', function (e) {
// call the handler only when not right-click
e.button === 2 || _clearMenus()
})
Plunk

CKEditor close dialog

I'm trying to call close function for CKEditor dialog box from my custom plugin. Just like it happens when you are clicking on smile in "smileys" plugin, but I can't find out how can I do the same in my own plugin.
Thanx for reply!
I've got the solution.
In my plugin I needed to call close function from "CKEDITOR.dialog.add" in "onLoad" section. So, I have to do this:
CKEDITOR.dialog.add( 'plugin_name', function( editor ){
onLoad: function( event ){
[...some code...]
event.sender.hide();
}
}
CKEDITOR.dialog.getCurrent().hide()
I propose you do it the same way it is done by CKEditor Dialog plugin internally. See line 535 in plugin.js
By clicking the button or firing the cancel event you ensure correct handling by the plugin.
Code sample:
// If there's a Cancel button, click it, else just fire the cancel event and hide the dialog.
button = CKEDITOR.dialog.getCurrent().getButton( 'cancel' );
if ( button )
CKEDITOR.tools.setTimeout( button.click, 0, button );
else {
if ( CKEDITOR.dialog.getCurrent().fire( 'cancel', { hide : true } ).hide !== false )
CKEDITOR.dialog.getCurrent().hide();
}

Resources