Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
35
string column with checkbox and text?
posted

hi,

I have string columns MakeFlag with valid / invalid  values and want display checkbox along based on that.

Did that already and it's almost working but I don't want user to be able edit text value just the checkbox, now he can do both.

how to do that?     thanks

            $(function () {
                var dataURL = "">localhost:54493/.../values";
                $("#grid1").igGrid({
                    dataSource: dataURL,
                    primaryKey: "TIDnumber",
                    renderCheckboxes: true,
                    restSettings: {
                        update: { url: dataURL + "/Save" },  
                            remove: { url: dataURL, batch: true },
                            create: { url: dataURL, batch: true }
                        },
                autoGenerateColumns: false,
                height: "350px",
                width: "800px",
                columns: [
                        {headerText: "TIDnumber", key: "TIDnumber", dataType: "number" },
                        {headerText: "Description", key: "Description", dataType: "string" },
                        { headerText: "Quantity", key: "Quantity", dataType: "string" },
                    { headerText: "Make Flag", key: "MakeFlag", dataType: "string", width: "15%", template: "<input type='checkbox' {{if ${MakeFlag} == 'Valid'}} checked='checked' {{/if}}>${MakeFlag}" }
                            ],
                features: [
                        {
                        name: "Updating",
                        editMode: 'cell',
                        editCellEnded: onEditCellEnded,
                        columnSettings: [{
                            columnKey: 'TIDnumber',
                        readOnly: true
                    },
                            {
                columnKey: "Description",
                editorType: 'string',
                validation: true,
                                editorOptions: {required: true }
        }
        ]
}
]
});

 function onEditCellEnded(event, args) {
                if (args.columnKey == "MakeFlag") {
                    //var cell = args.editor;
                    var cellValue = $("#grid1").igGrid("getCellValue", args.rowID, "MakeFlag");
                    if (cellValue == "Valid") {
                        $("#grid1").igGridUpdating("setCellValue", args.rowID, "MakeFlag", "Invalid");
                    } else if (cellValue == "Invalid") {
                        $("#grid1").igGridUpdating("setCellValue", args.rowID, "MakeFlag", "Valid");
                    }
                }
            $("#grid1").igGrid("saveChanges");
        };