i use kendo ui treeview (with checkbox) and i want to disable / enable nodes from jquery.
How Can I disable or enable Kendo UI TreeView (checkbox) With Jquery?
Enable:
$(".treeview .k-checkbox input").removeAttr("disabled");
$(".treeview .k-Icon").removeClass("k-minus-disabled");
$(".treeview .k-in").removeClass("k-state-disabled");
Disable:
$(".treeview .k-checkbox input").attr("disabled", "disabled");
$(".treeview .k-Icon").addClass("k-minus-disabled");
$(".treeview .k-in").addClass("k-state-disabled");
var treeview = $("#tree").data("kendoTreeView");
var selectedNode = treeview.select();
//disabled node
treeview.enable(selectedNode, false);
the subject is old, but if it can help someone.
Related
I cannot disable a tabstrip button. Ive tried the following running within the Tabstrips Activate event
tabButton.data("kendoButton").enable(false)
-- fails because the button isnt a kendo button
tabButton.addClass("disabled")
-- fails, disabled is added, but button is still usable
where tabButton was derived along the following lines, I know I gottten it.
var tabButton = $(".k-button")
I resolved the issue by adding a css & class as in
.disable_a_href { pointer-events: none; }
tabButton.addClass("disable_a_href")
TabStrip has explicit enable and disable functions.
If you want them to start disabled, use the class k-state-disabled on the <li> element.
Here's a fiddle showing both of these methods. Tab 2 will start disabled, and tab 3 can be toggled.
To disable all tabstrip except the active you can use this code:
var tabStrip = $("#tabstrip").data("kendoTabStrip");
tabStrip.enable(tabStrip.tabGroup.children().not(".k-state-active"), false);
I use a very simple approach ...
var tabstrip = $("#yourtabstripID").data("kendoTabStrip");
var tabContentID = $("content_div_of_that_tab").parent().attr('id');
//Enable tab item ...
tabstrip.enable(tabstrip.tabGroup.children("[aria-controls='" + tabContentID + "']")[0], true);
//Disable tab item ...
tabstrip.enable(tabstrip.tabGroup.children("[aria-controls='" + tabContentID + "']")[0], false);
I feel the code above is pretty self explanatory ...
In Firefox,if I hold the ctrl key and then I can perform a multi-selection on the web page.How could I disable this functionality?
You have to use the Javascript selectionchange event to notice when the selection changes and then manually remove the selection ranges you don't like.
document.addEventListener("selectionchange", function()
{
var oSel = window.getSelection();
if (oSel.rangeCount > 1)
{
var oFirstRange = oSel.getRangeAt(0).cloneRange();
oSel.removeAllRanges();
oSel.addRange(oFirstRange);
}
});
Here is a working jsfiddle.
This is the Kendo UI demo showing hierarchical data: http://demos.telerik.com/kendo-ui/grid/hierarchy
It seems to work very well, but the first row is expanded automatically. I tried hacking around with it in their dojo, but couldn't find a way to disable that behavior.
How do I prevent rows from being automatically expanded in Kendo UI Grid?
It's because there is used expandRow method in dataBound event to expand first row. Remove it.
var element = $("#grid").kendoGrid({
....
dataBound: function() {
this.expandRow(this.tbody.find("tr.k-master-row").first());
},
....
});
Can we replace kendo UI dropdown list with default html "select -> option" elements?
I am concerned about how it is displayed in mobile devices. I want to open native apple and android interface when selecting a dropdown value.
Yes it is absolutely possible. I will do an example with kendo dropdown and JQuery
<input id="DropdownList" class="form-control"/>
Here is a simple input box.
We need a simple Javascript to treat is as a dropdownlist.
<script>
$("#DropdownList").kendoDropDownList({
dataTextField: "Name",
dataValueField: "ID",
});
</script>
And to bind it to some datasource all we have to do is create a JQuery function to do it as
var dropDown = $("#DropdownList").data("kendoDropDownList");
dropDown.setDataSource(someList);
someList is a simple JSON object which we can get through ajax requests.
I've successfully set up CKEditor and it works well, but the collapse toolbar button (3) irks me:
Is there any way to hide or remove it? If so, how?
from this source
You can easily disable it in plugins/toolbar/plugin.js
CKEDITOR.replace( 'editor1',
{
toolbarCanCollapse : false
}
);
or
CKEDITOR.config.toolbarCanCollapse = false;