onKeyPress() event work fine when Grid has row in DhtmlxGrid. But when Grid is empty, event is not getting fire.
My code is :
grd.attachEvent("onKeyPress", ongrdInsert);
function ongrdInsert(nKeyCode,Ctrl,Shift,Event)
{
if (40 == nKeyCode)
{
alert("ongrdInsert");
}
}
Your issue is confirmed and fixed. If you have active support subscription, you may open a ticket at support.dhtmlx.com to get the fix. Also it will be included in the next dhtmlxGrid release.
Related
I'd like to set readonly field, but only first line on the grid. How can I do this?
Any suggestions are welcome!
You can make use of the edit function like
edit: function(e) {
//add your custom logic here as if condition
//as for this example it just disable the one with id 1
//or maybe ada a new attribute like isEditable = boolean upon datasource.parse then check it
if (e.model.id == 1) {
//revert edited cell back to `read` mode
this.closeCell();
}
}
Well this is not exactly prevent opening, its just immediately close it after it opened i think. but it is viable option since i cant even see the changes. Working example dojo and this actually sugested in the kendo forum here
I have a problem with filtering events:
I use fullcalender in agendaDay-View
I use a drop-Down list to select a driver
I compare the name (it is a property of event-object) with the selected value
(this part is ok)
Then,
I remove all Events (.fullCalendar('removeEvents');)
Add the specific events
(add with renderEvents doesn't work proberly at the moment)
And now my problem appears:
For the first time it works, however, when I select another 'driver', the events are gone, because of the 'removeEvents'-Action before.
So, how can I solve this problem, that I can only display the filtered events and keep the other (actualley all events) to filter again for second, third n- time?
$('#' + id).fullCalendar('refetchEvents');
was the first idea, however, its brings all back and selected Issues were doubled (and so on).
I'm thankful for every hint.
Ok I think you can solve your problem with fullCalendar's eventRender function.
The function can also return false to completely cancel the rendering of the event.
Your event from events.json should have a property like 'driver_id'.
I would have select field instead of dropdown with option keys being driver ids, values - names or whatever. Lets say it's id would be 'driver_select'.
Then render events like this:
$('#calendar').fullCalendar({
//...
eventRender: function(event, element) {
//driver select should have default value assigned or else no events will be rendered
if ($("#driver_select").val() !== event.driver_id) {
return false; //do not render other driver events
}
}
//...
});
Handle select changes to update
$("#driver_select").off('change').on('change', function() {
$("#calendar").fullCalendar( 'refetchEvents' );
});
Another approach would be to show all drivers in a timeline. For that you can use FullCalendar Scheduler.
I have a kendo grid with a custom popup:
columns.Command(commands =>
{
commands.Edit();
}
.Editable(editing => editing.Mode(Kendo.Mvc.UI.GridEditMode.PopUp))
Each time I click the edit button the window pops up but when I close it the window is not removed from the DOM.
I saw this post: http://www.telerik.com/forums/popup-windows-do-not-get-removed-from-dom and Telerik says the issue has been fixed.
What are some things that would cause this behavior?
UPDATED
This grid is nested in a Kendo TabStrip if that helps. Other than that I don't see anything out of the ordinary. The popup is entirely managed by the grid.
UPDATED 2
So I got the un-minimized code for the grid (kendo.grid.min.js, version 2013.3.1119, starting at line 1172), slopped it into my project and modified just the following with the two log statements to verify that destroy is being bound and called:
_destroyEditable: function () {
var that = this;
var destroy = function () {
if (that.editable) {
// My edit
console.log("...destroy() called");
that._detachModelChange();
that.editable.destroy();
that.editable = null;
that._editContainer = null;
}
};
if (that.editable) {
if (that._editMode() === "popup") {
// My edit
console.log("Binding destroy() to 'deactivate'...");
that._editContainer.data("kendoWindow").bind("deactivate", destroy).close();
} else {
destroy();
}
}
},
Each time I click edit and then close the window I see the expected two messages yet the window is not removed. Here is a screenshot of the debugger:
The outlined windows are the dom elements generated.
After much trial and error and deep diving it turns out this problem has to do with our scripts in our site's layout. At some point whomever setup the kendo scripts put in not only the 'kendo.all.min.js' but right after it 'kendo.web.min.js', 'kendo.aspnetmvc.min.js' and then about 10 individual kendo.*.js including the grid.
After viewing this link:
http://docs.telerik.com/kendo-ui/getting-started/javascript-dependencies
I realized that the site is creating these objects multiple times. Removing the script references in accordance to the link above resolves the issue.
I've created a Kendo Scheduler that binds to a remote data source. The remote datasource is actually a combination of two separate data sources. This part is working okay.
Question is... is there any way to prevent certain events from being destroyed?
I've stopped other forms of editing by checking a certain field in the event's properties and calling e.preventDefault() on the edit, moveStart and resizeStart events if it should be read-only. This works fine, but I can't prevent deletes.
Any suggestions greatly appreciated.
Just capture the remove event and process it as you have with the edit, moveStart, and reviseStart events. You should see a remove event option off the kendo scheduler. I can see it and capture it in version 2013.3.1119.340.
I think better way is to prevent user from going to remove event in the first place. Handling the remove event still has its validity as you can delete event for example by pressing "Delete" key).
In example below I'm assuming event has custom property called category and events with category equal to "Holiday" can't be deleted.
remove: function(e)
{
var event = e.event;
if (event.category === "Holiday")
{
e.preventDefault();
e.stopPropagation();
}
},
dataBound: function(e)
{
var scheduler = e.sender;
$(".k-event").each(function() {
var uid = $(this).data("uid");
var event = scheduler.occurrenceByUid(uid);
if (event.category === "Holiday")
{
// use .k-event-delete,.k-resize-handle if you want to prevent also resizing
$(this).find(".k-event-delete").hide();
}
});
},
edit: function (e) {
var event = e.event;
if (event.category === "Holiday")
{
e.container.find(".k-scheduler-delete").hide();
}
}
FYI, you can do this...
#(Html.Kendo().Scheduler<ScheduledEventViewModel>()
.Name("scheduler")
.Editable(e => e.Confirmation(false))
)
which will deactivate the default confirmation prompt for the scheduler. Then you can do your own prompt on items you want.
There is also a
.Editable(e => e.Destroy(false))
that you can do to remove the X on the event window. This particular example would remove it for all of the events, but there might be a way to remove it for specific ones.
When editing my grid, if I click outside the grid, the box I was editing is still editable. How do I get the edited cell to "complete" the edit when it looses focus?
The following code will save the current edit.
Slick.GlobalEditorLock.commitCurrentEdit();
You'll need to place this inside an event handler that you think should trigger the save. For example, if you're using the sample text editor plugin, I believe an editor-text CSS class is added to the input field that's created when you're editing a cell so something like this should work:
$('#myGrid').on('blur', 'input.editor-text', function() {
Slick.GlobalEditorLock.commitCurrentEdit();
});
I found that I needed to wrap clav's handler in a timeout:
$("#myGrid").on('blur', 'input.editor-text', function() {
window.setTimeout(function() {
if (Slick.GlobalEditorLock.isActive())
Slick.GlobalEditorLock.commitCurrentEdit();
});
});
to avoid errors like:
Uncaught NotFoundError: An attempt was made to reference a Node in a context where it does not exist.
when using the keyboard to navigate. Presumably the new blur handler fires before SlickGrid can do its own handling and this causes problems.
Unfortunately, probably due to differences in event processing, Grame's version breaks keyboard navigation in chrome.
To fix this, I added another check to only commit the edit, if the newly focused element is not another editor element within the grid (as the result of keyboard navigation):
$('#grid').on('blur.editorFocusLost', 'input.editor-text', function() {
window.setTimeout(function() {
var focusedEditor = $("#grid :focus");
if (focusedEditor.length == 0 && Slick.GlobalEditorLock.isActive()) {
Slick.GlobalEditorLock.commitCurrentEdit();
}
});
});
This seems to work in current versions of firefox, chrome and ie.