I have a Kendo MVC grid where I want to delete a record from it.
When I use their Destroy command it generates a confirmation popup with the following text: "Are you sure you want to delete this record?".
Instead of the message I would like to display something else, for example: "Do you really really really want to do this?"
Is there a straight forward way to do this ?
Thank you
You can set the text in the editable confirmation property of the grid:
https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-editable.confirmation
$("#grid").kendoGrid({
editable: {
confirmation: "Do you really really really want to do this?"
}
});
DisplayDeleteConfirmation worked for me. If you created your GridView with Html.Raw by the way.
.Editable(editable => editable.Mode(GridEditMode.InLine).DisplayDeleteConfirmation("I'm asking again ara you u sure ?"))
.Events(e => e.Save("onGridSave"))
.HtmlAttributes(new { style = "height:300px;width:600px;" })
Related
I am new to Kendo. I am using Html.Kendo().CheckBoxFor(m => m.Enable) in MVC cshtml, and I'm unable to add a change event for this checkbox. The Html.Kendo().DropDownListFor has .Events(e => e.Change("PopulateCountry")), but I dont see same type of event in CheckBox.
Can anyone help on this?
The Html.Kendo().CheckBoxFor helper renders a regular html5 checkbox. It is not actually a kendo widget like Html.Kendo().DropDownListFor creates. I believe this is why the helper for CheckBox is lacking an .Events option.
Regardless, you can use the .HtmlAttributes option to add a change handler to the checkbox element instead:
.HtmlAttributes(new { onchange = "PopulateCountry();" })
I have kendo tree view with check boxes. When i do the button click the values are getting lost after refresh. I wanted to show back to the user after button click could you please help me on this.
$("#treeview1").kendoTreeView({
checkboxes: {
checkChildren: true
},
dataSource:EquipmentTypes,
id: ["EquipmentTypeId"],
dataTextField:["EquipmentTypeName"],
expanded: false,
spriteCssClass: "rootfolder",
dataValueField: ["EquipmentTypeId"],
value:"#Model.UtilizationFilter.EquipmentTypeFilter"
});
I assume this is because the button in the question does a post of a form. If that is the case then I don't see any easy solutions.
You could either change the buttons so they fetch via ajax. Or add a change event to the tree and then save the values in hidden fields and set them manually after load.
.Events(e => e.Check("onCheck"))
I am trying to set treeview with checkbox and there are some check box are by default checked , here my data source value:-
[{"id":12,"Name":"Shirts","hasChildren":false,"Checked":true}
,{"id":13,"Name":"Jeans","hasChildren":false,"Checked":false},
{"id":14,"Name":"Shoes","hasChildren":false,"Checked":true},
{"id":15,"Name":"Apparel accessories","hasChildren":false,"Checked":false}]
and my view page code:--
$(document).ready(function() {
$("#category-treeview").kendoTreeView({
dataSource: categories,
dataTextField: "Name",
checkboxes: true
});
});
but i no one checkbox is selected why?
Can any advice how to solve this?
Regards,
vinit
Your code is basically correct. The only problem is that Checked needs to be checked (lowercase). Your data would look like:
var categories = [
{"id":12,"Name":"Shirts","hasChildren":false,"checked":true},
{"id":13,"Name":"Jeans","hasChildren":false,"checked":false},
{"id":14,"Name":"Shoes","hasChildren":false,"checked":true},
{"id":15,"Name":"Apparel accessories","hasChildren":false,"checked":false}
];
I put your code with this small change here: http://jsfiddle.net/OnaBai/78k2b/
If all you need to do is show whether the checkbox is checked or not, you can easily employ a templateFunction for the checkbox.
checkboxes: {
template: checkboxTemplate
}
And use a function something like
function checkboxTemplate(e) {
if(e.item.Checked) {
return "<input type='checkbox' checked='checked' />";
}
else {
return "<input type='checkbox' />";
}
}
The issue with this approach, is there isn't a two-way data-binding happening. So if you change a checkbox, and them dump the dataSource, that change isn't reflected.
If you are needing two-way data-binding, so you can post the changes back, you will need to employ something quite a bit more complicated. It is laid out pretty well in this SO post (Binding checkboxes in treeview with checkboxes that uses remote datasource).
I have looked for a more elegant answer to this, as it would seem fairly common, but haven't found anything yet.
So I have a grid and the columns have the good ol' column menu on them with the filtering/sorting/excluding of columns and it all works fine.
The fly in the ointment is that I would like to allow the user to rename a column heading and the obvious place in the UI to allow this is in said column menu.
Something like this:
(where the red bit is just another option that I click on and popup a little window to let me type in a new heading)
Is this possible and how would I do it?
I see that menus can be customized and the grid demo shows how to adjust the stuff in the filter popup but I am not sure how I would add this item (I can see how I would programmatically do the rename but just this getting an option onto the menu has me stumped).
You can use the columnMenuInit event. Two possibilities:
$("#grid").kendoGrid({
dataSource: dataSource,
columnMenu: true,
columnMenuInit: function (e) {
var menu = e.container.find(".k-menu").data("kendoMenu");
var field = e.field;
// Option 1: use the kendoMenu API ...
menu.append({
text: "Rename"
});
// Option 2: or create custom html and append manually ..
var itemHtml = '<li id="my-id" class="k-item k-state-default" role="menuitem">' +
'<span class="k-link"><b>Manual entry</b></span></li>';
$(e.container).find("ul").append(itemHtml);
// add an event handler
menu.bind("select", function (e) {
var menuText = $(e.item).text();
if (menuText == "Rename") {
console.log("Rename for", field);
} else if (menuText === "Manual entry") {
console.log("Manual entry for", field);
}
});
}
})
See fiddle with two alternatives:
http://jsfiddle.net/lhoeppner/jJnQF/
I guess that the point of a filter is to filter, not to make changes on the grid.
But anyways i found this Kendo Post that may help you to achieve what you need.
You can also take a look a this one too.
I would like to do something with easy ui combobox like following:
Ask the user to confirm or cancel selection before the item being really selected, if the user choose 'confirm', select what he/she wants to select; otherwise, stay where the selection was
The dialog pop up step is done, what puzzled me is how I can get the oldValue, ie. the previous selection. if I use the onChange method, I can only get the value of the previous selection, however, what I accatually want is the record! I need not only the value information, please, someone help me
Try the below one,
var oldval;
<input id="cc1" class="easyui-combobox" data-options="
valueField: 'id',
textField: 'text',
url: 'get_data1.php',
onSelect: function(rec){
$.messager.confirm('Confirm', 'Are you sure to select this item', function(r)
{
if (r){
oldval=rec.key
}
else{
$('#cc1').combobox('setValue', oldval);
}
});
}" />