Kendo ui Disable column when add new record
How do I achieve this, I want to disable radio button on Status Column only when Add New Record and checked on YES.
I don't know which part of script should I give. But here I provide some of it.
My KendoGrid Script
$("#grid").kendoGrid({
dataSource: dataSource,
dataBound: setColor,
height:400,
sortable: true,
columns: [
{ field: "segmentActive", title:"STATUS", width: "120px", editor: RadioSegmentActive,
template: data => data.segmentActive == "y" ? "Yes" : "No" }, // <-- displaying Yes/No insted of y/n
{ field: "marketSegmentName", title:"SEGMENT NAME", width: "120px" },
{ field: "publicPrice", title:"PUBLIC PRICE", width: "120px", editor: RadioPublicPrice,
template: data => data.publicPrice == "y" ? "Yes" : "No"},
{ field: "isHouseUse", title:"HOUSE USE", width: "120px", editor: RadioHouseUse,
template: data => data.isHouseUse == "y" ? "Yes" : "No"},
{ command: ["edit",{ name: "destroy", text: "De-active" }], title: " ", width: "120px" },
],
editable: "inline",
...........
My RadioSegmentActive function
function RadioSegmentActive(container, options) {
var guid = kendo.guid();
$('<input class="k-radio" id="radio3" name="segmentActive" type="radio" value="y" >').appendTo(container);
$('<label class="k-radio-label" for="radio3">YES</label>').appendTo(container); //YES
$('<br>').appendTo(container);
$('<input class="k-radio" id="radio4" name="segmentActive" type="radio" value="n" >').appendTo(container);
$('<label class="k-radio-label" for="radio4">NO</label>').appendTo(container); //NO
}
javascript kendo-ui radio-button kendo-grid
add a comment |
How do I achieve this, I want to disable radio button on Status Column only when Add New Record and checked on YES.
I don't know which part of script should I give. But here I provide some of it.
My KendoGrid Script
$("#grid").kendoGrid({
dataSource: dataSource,
dataBound: setColor,
height:400,
sortable: true,
columns: [
{ field: "segmentActive", title:"STATUS", width: "120px", editor: RadioSegmentActive,
template: data => data.segmentActive == "y" ? "Yes" : "No" }, // <-- displaying Yes/No insted of y/n
{ field: "marketSegmentName", title:"SEGMENT NAME", width: "120px" },
{ field: "publicPrice", title:"PUBLIC PRICE", width: "120px", editor: RadioPublicPrice,
template: data => data.publicPrice == "y" ? "Yes" : "No"},
{ field: "isHouseUse", title:"HOUSE USE", width: "120px", editor: RadioHouseUse,
template: data => data.isHouseUse == "y" ? "Yes" : "No"},
{ command: ["edit",{ name: "destroy", text: "De-active" }], title: " ", width: "120px" },
],
editable: "inline",
...........
My RadioSegmentActive function
function RadioSegmentActive(container, options) {
var guid = kendo.guid();
$('<input class="k-radio" id="radio3" name="segmentActive" type="radio" value="y" >').appendTo(container);
$('<label class="k-radio-label" for="radio3">YES</label>').appendTo(container); //YES
$('<br>').appendTo(container);
$('<input class="k-radio" id="radio4" name="segmentActive" type="radio" value="n" >').appendTo(container);
$('<label class="k-radio-label" for="radio4">NO</label>').appendTo(container); //NO
}
javascript kendo-ui radio-button kendo-grid
add a comment |
How do I achieve this, I want to disable radio button on Status Column only when Add New Record and checked on YES.
I don't know which part of script should I give. But here I provide some of it.
My KendoGrid Script
$("#grid").kendoGrid({
dataSource: dataSource,
dataBound: setColor,
height:400,
sortable: true,
columns: [
{ field: "segmentActive", title:"STATUS", width: "120px", editor: RadioSegmentActive,
template: data => data.segmentActive == "y" ? "Yes" : "No" }, // <-- displaying Yes/No insted of y/n
{ field: "marketSegmentName", title:"SEGMENT NAME", width: "120px" },
{ field: "publicPrice", title:"PUBLIC PRICE", width: "120px", editor: RadioPublicPrice,
template: data => data.publicPrice == "y" ? "Yes" : "No"},
{ field: "isHouseUse", title:"HOUSE USE", width: "120px", editor: RadioHouseUse,
template: data => data.isHouseUse == "y" ? "Yes" : "No"},
{ command: ["edit",{ name: "destroy", text: "De-active" }], title: " ", width: "120px" },
],
editable: "inline",
...........
My RadioSegmentActive function
function RadioSegmentActive(container, options) {
var guid = kendo.guid();
$('<input class="k-radio" id="radio3" name="segmentActive" type="radio" value="y" >').appendTo(container);
$('<label class="k-radio-label" for="radio3">YES</label>').appendTo(container); //YES
$('<br>').appendTo(container);
$('<input class="k-radio" id="radio4" name="segmentActive" type="radio" value="n" >').appendTo(container);
$('<label class="k-radio-label" for="radio4">NO</label>').appendTo(container); //NO
}
javascript kendo-ui radio-button kendo-grid
How do I achieve this, I want to disable radio button on Status Column only when Add New Record and checked on YES.
I don't know which part of script should I give. But here I provide some of it.
My KendoGrid Script
$("#grid").kendoGrid({
dataSource: dataSource,
dataBound: setColor,
height:400,
sortable: true,
columns: [
{ field: "segmentActive", title:"STATUS", width: "120px", editor: RadioSegmentActive,
template: data => data.segmentActive == "y" ? "Yes" : "No" }, // <-- displaying Yes/No insted of y/n
{ field: "marketSegmentName", title:"SEGMENT NAME", width: "120px" },
{ field: "publicPrice", title:"PUBLIC PRICE", width: "120px", editor: RadioPublicPrice,
template: data => data.publicPrice == "y" ? "Yes" : "No"},
{ field: "isHouseUse", title:"HOUSE USE", width: "120px", editor: RadioHouseUse,
template: data => data.isHouseUse == "y" ? "Yes" : "No"},
{ command: ["edit",{ name: "destroy", text: "De-active" }], title: " ", width: "120px" },
],
editable: "inline",
...........
My RadioSegmentActive function
function RadioSegmentActive(container, options) {
var guid = kendo.guid();
$('<input class="k-radio" id="radio3" name="segmentActive" type="radio" value="y" >').appendTo(container);
$('<label class="k-radio-label" for="radio3">YES</label>').appendTo(container); //YES
$('<br>').appendTo(container);
$('<input class="k-radio" id="radio4" name="segmentActive" type="radio" value="n" >').appendTo(container);
$('<label class="k-radio-label" for="radio4">NO</label>').appendTo(container); //NO
}
javascript kendo-ui radio-button kendo-grid
javascript kendo-ui radio-button kendo-grid
asked Jan 2 at 1:56


NixodermNixoderm
6510
6510
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
I am not sure what you mean by "Checked on Yes", but you can do that by handling the edit event of the grid:
editable: "inline",
edit: function(e) {
if (e.model.isNew()) { // We are adding
// if ($("#radio3").prop("checked")) { // Check some field...
$("#radio3").attr('checked', true); // Set yes radio button
$('input[name=segmentActive]').attr("disabled",true); // Disable radio buttons
// }
}
}
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
Thank you!!
– Nixoderm
Jan 4 at 3:01
I need your help again. It worked fine but i need to change attr to prop$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.
– Nixoderm
Jan 4 at 7:40
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54000404%2fkendo-ui-disable-column-when-add-new-record%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I am not sure what you mean by "Checked on Yes", but you can do that by handling the edit event of the grid:
editable: "inline",
edit: function(e) {
if (e.model.isNew()) { // We are adding
// if ($("#radio3").prop("checked")) { // Check some field...
$("#radio3").attr('checked', true); // Set yes radio button
$('input[name=segmentActive]').attr("disabled",true); // Disable radio buttons
// }
}
}
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
Thank you!!
– Nixoderm
Jan 4 at 3:01
I need your help again. It worked fine but i need to change attr to prop$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.
– Nixoderm
Jan 4 at 7:40
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
add a comment |
I am not sure what you mean by "Checked on Yes", but you can do that by handling the edit event of the grid:
editable: "inline",
edit: function(e) {
if (e.model.isNew()) { // We are adding
// if ($("#radio3").prop("checked")) { // Check some field...
$("#radio3").attr('checked', true); // Set yes radio button
$('input[name=segmentActive]').attr("disabled",true); // Disable radio buttons
// }
}
}
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
Thank you!!
– Nixoderm
Jan 4 at 3:01
I need your help again. It worked fine but i need to change attr to prop$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.
– Nixoderm
Jan 4 at 7:40
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
add a comment |
I am not sure what you mean by "Checked on Yes", but you can do that by handling the edit event of the grid:
editable: "inline",
edit: function(e) {
if (e.model.isNew()) { // We are adding
// if ($("#radio3").prop("checked")) { // Check some field...
$("#radio3").attr('checked', true); // Set yes radio button
$('input[name=segmentActive]').attr("disabled",true); // Disable radio buttons
// }
}
}
I am not sure what you mean by "Checked on Yes", but you can do that by handling the edit event of the grid:
editable: "inline",
edit: function(e) {
if (e.model.isNew()) { // We are adding
// if ($("#radio3").prop("checked")) { // Check some field...
$("#radio3").attr('checked', true); // Set yes radio button
$('input[name=segmentActive]').attr("disabled",true); // Disable radio buttons
// }
}
}
edited Jan 4 at 2:56
answered Jan 2 at 14:41


Steve GreeneSteve Greene
9,22812035
9,22812035
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
Thank you!!
– Nixoderm
Jan 4 at 3:01
I need your help again. It worked fine but i need to change attr to prop$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.
– Nixoderm
Jan 4 at 7:40
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
add a comment |
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
Thank you!!
– Nixoderm
Jan 4 at 3:01
I need your help again. It worked fine but i need to change attr to prop$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.
– Nixoderm
Jan 4 at 7:40
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
it means when user "Add New Record" radio button on Status column is disabled and by default checked in "YES"
– Nixoderm
Jan 4 at 0:29
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
It works for disabled radio button, but at the same time I want the default value checked on "YES". Thanks in advance.
– Nixoderm
Jan 4 at 0:35
Thank you!!
– Nixoderm
Jan 4 at 3:01
Thank you!!
– Nixoderm
Jan 4 at 3:01
I need your help again. It worked fine but i need to change attr to prop
$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.– Nixoderm
Jan 4 at 7:40
I need your help again. It worked fine but i need to change attr to prop
$("#radio3").prop('checked', true);
and it will display what I want. But it not fetch the value y when I save it. It will insert null.– Nixoderm
Jan 4 at 7:40
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
You may be running into issues with your template and binding. I have always avoided modifying the DOM dynamically when using Kendo because it composes them at grid creation time and then hooks up all the binding and other events. Try using a kendo template. Otherwise, you might be able to add a command to your function that updates the model. See here.
– Steve Greene
Jan 4 at 15:38
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54000404%2fkendo-ui-disable-column-when-add-new-record%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown