Extjs4 how can I disable, the rowediting plugin in a grid? - plugins

I want to disable the rowediting plugin depends on a combo selection, I have the grid reference. How can I disable it? (I try to destroy it, but then when I close the window, i get a "Uncaught TypeError: Cannot call method 'getView' of undefined ".

Return false from the RowEditing beforeedit event.
listeners: {
beforeedit: function(editor, context){
if(comboBox.getValue() === /* whatever conditions you have */){
return false;
}
}
}
You can also set context.cancel = true to achieve the same effect, but I don't really see the point in it since returning false from a beforexyz event is a standard idiom in the Ext JS 4 library.

Related

Tinymce 5 dialog urlinput disable/enable broken

Heads up to anyone who is self hosting who also runs across this bug....
In version 5.6.0 silver theme, the dialog urlinput enable/disable works for the input field but not the browse button of the control. The problem is that the enable/disable events are intercepted by the typeaheadBehaviours portion of the internal object so they never make it to the event handlers for the overall field. The fix is to add the onDisabled and onEnabled handlers to the Disabling.config for typeaheadBehaviours and remove the line of code from each handler that addresses the input field.
Original typeaheadBehaviours Disabling.config....
Disabling.config({
disabled: function () {
return spec.disabled || providersBackstage.isDisabled();
}
})
Amended code....
Disabling.config({
disabled: function () {
return spec.disabled || providersBackstage.isDisabled();
},
onDisabled: function (comp) {
memUrlPickerButton.getOpt(comp).each(Disabling.disable);
},
onEnabled: function (comp) {
memUrlPickerButton.getOpt(comp).each(Disabling.enable);
}
})
Haven't been able to figure out how to get those events to bubble up to the the overall control handlers but this seems to make things work as expected.

disable boxZoom when control key active

I am using the area select plugin. By default it responds to a ctrlKey box drag. And by default Leaflet boxZoom responds to a shiftKey box drag. All good so far. However a ctrlKey + shiftKey box drag triggers the Leaflet boxZoom and the area select plugin. I would like it to trigger just the area select plugin instead. Any suggestions?
If you have a look at Leaflet's source code for the BoxZoom map handler, you can see the line where it checks for a pressed shift key plus primary (""left"") mouse/pointer button to start the box zoom:
_onMouseDown: function (e) {
if (!e.shiftKey || ((e.which !== 1) && (e.button !== 1))) { return false; }
And you want to change that to check for ctrlKey, so that the box zoom doesn't start if it's set to true, something like:
if (!e.shiftKey || e.ctrlKey || ((e.which !== 1) && (e.button !== 1))) { return false; }
The question is how to do this without rewriting or breaking up everything. An approach is to monkey-patch that method from the BoxZoom handler's prototype while keeping a reference to the old one, e.g. something like:
var oldBoxZoomMouseDown = L.Map.BoxZoom.prototype._onMouseDown;
L.Map.BoxZoom.prototype._onMouseDown = function(ev) {
// Worry only about ctrlKey...
if (ev.ctrlKey) { return false; }
// ...and let the previous event handler worry about shift and primary button
oldBoxZoomMouseDown.call(this, ev);
}
Note that it'll work only when done before the map has been instantiated. There are other approaches, such as replacing the method of the BoxZoom instance after the map has been instantiated, and creating a subclass of the BoxZoom handler. Reading about javascript's prototypal inheritance and Leaflet's way of dealing with OOP is recommended at this point.

Ace editor Detect if Change happen via Autocomplete

editor.getSession().on("change",function(editing){
if (ide.curOp && ide.curOp.command.name){
console.log("change when pressing keys");
}
else {
console.log("Changed when Click on autocomplete list or programically.");
// This change is programmatically but if its via click on autocomplete list or not?
// If its via click on autocomplete I want to save document else want to ignore.
}
});
My comment in code is explaining my question well.
The answer largely depends on what you call "programical", anything editor does is done via api calls so everything is "programical". E.g. if someone adds a <button onclick='editor.setValue("")'> will change caused by it be "programical" or not.
If you want to distinguish api calls made by your code from others, use a boolean variable and set it to true before calling into ace api, and to false after that.
var ignoreChanges = false
editor.session.on("change", function(delta){
if (ignoreChanges) return console.log("ignore changes made by me")
console.log("handle changes made in some other way")
})
function applyChange() {
try {
ignoreChanges = true
// call some editor api here
editor.insert("...")
} finally {
ignoreChanges = false
}
}

JsTree with dnd plugin, always copy

I have 2 trees using jsTree and dnd plugin.
I want that each drag operation to be a copy instead of a move.
There is a "copy_modifier" which works Ok when pressing a modifier key, but I want copy to be the default behavior without the modifier.
Any ideas?
Thanks,
Adrian
Found a solution on http://groups.google.com/group/jstree
I added the following section when configuring jsTree:
"crrm": {
"move": { "always_copy": "multitree" }
}
Hope this helps,
Adrian
another solution for the new version. it works, but not fully tested.
"core": {
"check_callback": function (operation, node, node_parent, node_position, more) {
if (more) {
if (more.is_multi) {
more.origin.settings.dnd.always_copy = true;
} else {
more.origin.settings.dnd.always_copy = false;
}
}
return true;
}
}
Adrian's solution won't work with the new versions.
There's that dnd plugins always copy flag
dnd.always_copy
Setting this flag will make all drag and drops copy operations instead of move. But if you are looking for a solution where you need internal tree elements to be moved on dnd but inter tree dnds to be copies than here's a hack:
Keep a global variable flag on your page
Handle copy_node.jstree events and update your global flag from
data.is_multi (data is the second arg of the event function)
Implement check_callback function and if operation is delete_node and your flag is set unset your flag and return false, preventing deletion from the dnd.

jQuery live with the ready or load event

I'm using the jQuery Tools tooltip plugin, which is initialized with $('selector').tooltip(). I'd like to call this on any current or future .tooltipper element. I figured that the following would work:
$('.tooltipper').live('ready', function(){
$(this).tooltip()
}
But it was unsuccessful---the ready event did not fire. The same for load. I've read that livequery can produce the result of I'm looking for, but surely there is a way to use jQuery .live() to pull it off, considering the documentation says that it works for all jQuery events, of which I believe ready is one.
Quoted from the jQ API (http://api.jquery.com/live/):
In jQuery 1.3.x only the following JavaScript events (in addition to custom events) could be bound with .live(): click, dblclick, keydown, keypress, keyup, mousedown, mousemove, mouseout, mouseover, and mouseup.
As of jQuery 1.4 the .live() method supports custom events as well as all JavaScript events.
As of jQuery 1.4.1 even focus and blur work with live (mapping to the more appropriate, bubbling, events focusin and focusout).
As of jQuery 1.4.1 the hover event can be specified (mapping to "mouseenter mouseleave").
.live() does not appear to support the ready event.
To add to HurnsMobile's excellent answer; Looking at bindReady(), which is the internal call that jQuery makes to bind to the document load event every time you call $(some_function) or $(document).ready(some_function) we see why we cannot bind to "ready":
bindReady: function() {
if ( readyBound ) {
return;
}
readyBound = true;
// Catch cases where $(document).ready() is called after the
// browser event has already occurred.
if ( document.readyState === "complete" ) {
return jQuery.ready();
}
// Mozilla, Opera and webkit nightlies currently support this event
if ( document.addEventListener ) {
// Use the handy event callback
document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );
// A fallback to window.onload, that will always work
window.addEventListener( "load", jQuery.ready, false );
// If IE event model is used
} else if ( document.attachEvent ) {
// ensure firing before onload,
// maybe late but safe also for iframes
document.attachEvent("onreadystatechange", DOMContentLoaded);
// A fallback to window.onload, that will always work
window.attachEvent( "onload", jQuery.ready );
// If IE and not a frame
// continually check to see if the document is ready
var toplevel = false;
try {
toplevel = window.frameElement == null;
} catch(e) { //and silently drop any errors
}
// If the document supports the scroll check and we're not in a frame:
if ( document.documentElement.doScroll && toplevel ) {
doScrollCheck();
}
}
}
To sum it up, $(some_function) calls a function which binds to:
DOMContentLoaded
onreadystatechange (DOMContentLoaded)
window.load / onload
Your best bet would be to bind to those actions that might create new .tooltipper elements, rather than trying to listen for the ready event (which happens only once).
HurnsMobile is right. JQuery live does not support the ready-event.
This is why I created a plugin that combines the two. You register your callback once, and then you will need to call the plugin once for content you add manually.
$.liveReady('.tooltipper', function(){
this.tooltip()
});
Then when creating new content:
element.html(somehtml);
element.liveReady();
or
$('<div class="tooltipper">...').appendTo($('body')).liveReady();
A demo is available here: http://cdn.bitbucket.org/larscorneliussen/jquery.liveready/downloads/demo.html
Check out the introductory post here: http://startbigthinksmall.wordpress.com/2011/04/20/announcing-jquery-live-ready-1-0-release/
Also have a look at http://docs.jquery.com/Plugins/livequery, which listenes for changes on the dom.