I need to select tabs in Kendo Tabstrip (see demo here) using right click in addition to left click. Is this possible?
This script will work,
$('#tabstrip [role="tab"]').bind("contextmenu",function(e){
$('#tabstrip').getKendoTabStrip().select($(this));
return false;
});
Related
I am using Kendo UI TreeList & Grid for jquery. I want to hide a command button based on row values. In grid, I attached dataBound event to evaluate the model value and show/hide command button, below codes works fine
dataBound:function(e){
var delButton = e.container.find(".k-grid-Delete");
if (...) delButton.hide();
}
For TreeList, the same code seems also fine. However, when I add inline edit featrue, the same codes works differently.
When click "Edit" or "Add", the grid stay the original visible status, but treelist show all the button.
When click "Cancel", I triggered dataBound event in cancel event so the UI can be refreshed, then the grid show correctly but treelist still show all the buttons even if the dataBound is executed with correct logic.
Does anybody know how to resolve this issue?
Thanks,
Ziff Dai
I have a Kendo Editor, defined as below:
#(Html.Kendo().Editor()
.Name("RestrictionsEditor")
.Tag("div")
.Tools(tools => tools
.Clear()
.Bold().Italic().Underline().Strikethrough()
.JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
.CreateLink().Unlink()
.InsertImage()
.TableEditing()
.FontColor().BackColor()
)
.Value(#<text> This is the Kendo Editor and it has
some anchor tags pointing to external webistes.</text>)
When I click inside the editor, The top toolbar for font formatting is not showing. I want to show the top toolbar when user clicks inside the editor and then hide the toolbar when user clicks outside the editor. Please help!
Thanks!
To show hide the toolbar you first need to set the toolbar to hidden by default, then implement the select and blur events to show and hide the toolbar.
Here is a fiddle that implements this in JavaScript.
For your MVC implementation you will need to add script tags to you page and attached the events after the editor is initialized.
Something like this.
<script>
$(document).ready(function () {
//hide toolbar by default
$("#RestrictionsEditor").closest(".k-editor").find(".k-editor-toolbar").hide();
//bind the select event
$("#RestrictionsEditor").data("kendoEditor").bind("select", function(e){
//show toolbar on selection
$("#RestrictionsEditor").closest(".k-editor").find(".k-editor-toolbar").show();
});
//bind the blur event
$("#RestrictionsEditor").on("blur", function(e){
//hide toolbar
$("#RestrictionsEditor").closest(".k-editor").find(".k-editor-toolbar").hide();
});
});
</script>
I would like to disable selection while the user is editing an item in an editable and selectable ListView
I've tried changing the selectable property of the Listview but it does not make any change.
See example here http://dojo.telerik.com/IvIkO
Hi for this add below given lines code after the initialization of list view in same example:-
$(document).on("click", ".product-view", function(e) {
//check any row in the List view is being edit
if (listView.items().hasClass("k-edit-item")) {
listView.clearSelection();
}
});
i have created a jsfiddle using your example and mine code, click on jsfiddle to see the working example for the same:-
http://jsfiddle.net/c2S5d/28/
when I doubleclick on the row, it will give edit popup. This edit popup has left and right error key, when I click on that Arrow key , it will select the row in background. so I want to prevent the Auto select row when click of JQGrid Editpopup's Next and previous button.
so when I click on the next button it will select the row in my Grid table.How do I prevent this behavioir? in below image it mention
Please help me. I have tried "onclickPgButtons", but not able to trigger it.
Thanks in Advance.
You can't prevent selection of the new row, but you can just call setSelection with just selected row to unselect it. The code of afterclickPgButtons could be the following
afterclickPgButtons: function (whichButton, $frmgr, justSelectedRowid) {
$(this).jqGrid("setSelection", justSelectedRowid);
}
See the corresponding demo here.
This example from Oleg is very close to the behavior I'm looking for (the first button) but I want preserve whether or not it was highlighted if possible, and don't want to highlight a row and check on the check box if it was un-selected. Just to clarify, I will be popping a modal dialog if they click this button, it has nothing to do with editing the row.
http://www.ok-soft-gmbh.com/jqGrid/Admin3.htm
Thank you,
Stephen
To prevent highlighting of the row in which the custom button will be clicked one need just include return false; inside of click event handler:
click: function(e) {
alert("'Custom' button is clicked in the rowis="+
$(e.target).closest("tr.jqgrow").attr("id") +" !");
return false; // !!!!!
}
The demo demonstrate the results. It's the updated version of the demo from the answer and the previous one which you referenced in your question. Additionally I updated the code of myDelOptions.onclickSubmit based on the code from the answer.