CODEWITHSUNDEEP
javascriptdojodgrid
Malathesh
Malathesh

Reputation: 1

Dojo Dgrid row selection not working and retrieving the values of dgrid selectors?

Currently i am using the Dojo dgrid with select box,textbox and two checkboxes but i am not able to disable the whole row selection and also when i click the second checkbox the dgrid select and deselect not working and its reflecting the first checkbox.

1.How to disable the whole row selection in dojo Dgrid? 2.How to get the values of Dgrid selectbox and Dgrid textbox when i click on save? 3.If i use selectors(Checkbox) i am not able to render the label for that column? 

var columns = {                 
    person :{
     sortable: false,
        renderCell: lang.hitch(this, function(object,value,node) {
            if(value == true){
                myTextBox = new dijit.form.TextBox({
                    name: "Amount",
                    value: "" ,
                    placeHolder: "Enter Amount"
                }).placeAt(node);                                   
            }
        })                          
    },
    description:{
        label:"description",
        field:"description",
        sortable: false,
        renderCell : lang.hitch(this, function(object,
                value, node, options) {             
            new Select({
                name : "select",
                options : [ {
                    label : "Daily",
                    value : "daily"
                }, {
                    label : "Weekly",
                    value : "weekly",                                   
                }]
            }).placeAt(node);

        }),

    },
    email : selector({
        sortable:false,
        field:"email"
    })
    /*i tried this instead of using selectors inserting a checkbox so that i can remove complete row selection but not working*/
    email: {
        sortable:false, 
        field:"email",
        renderHeaderCell : function(node) {
            var cellDiv = domConstruct.create("label", {
                innerHTML : "Email"
            }, node);                           
                var checkBox = new CheckBox({
                    name: "checkBox",
                    id:"emailAddress",
                    checked: false,             
            }, cellDiv);
        },
        renderCell:createMessageLabel                                           
    }   

};  

function createMessageLabel(object,value, node,options){
    console.log("node option",node);
        var checkbox = new CheckBox({
        name: "checkBox",
        id:"emailAddress",
        checked: false,                         
    }).placeAt(node);                   
};



var grid = new GridView().show(gridData, columns, "",
        "dgridAutoHeight", true);
function addSelection(self, event) {

    console.log("Row selected: ", event.rows[0].data);
}
function removeSelection(self, event) {

    console.log("Row deselected: ", event.rows[0].data);
}
grid.startup();


grid.on("dgrid-select", lang.hitch(grid, addSelection, this), true);
grid.on("dgrid-deselect", lang.hitch(grid, removeSelection, this), true);

Hope i can get some valuable answers....

Upvotes: 0

Views: 1966

Answers (2)

Malathesh
Malathesh

Reputation: 1

Thank you so much Ken for your valuable answer and as you said editor suits perfect for the above situation....but i have an another doubt like can't we user editor inside a renderCell like below as i needed the value of textbox on datachange so i thought of using editor inside rendercell....below code is working fine but the TextBox is not getting placed inside a particular node(Textbox view is not getting rendered) whereever the value is "True"....

    dollarThresholdAvailable :{
                    field: "dollarThresholdAvailable",
                    label : "Threshold Limit",
                     sortable: false,   
                     "class":"dollarThresholdAvailableValue",   
                        renderCell: lang.hitch(this, function(object,value,node) {  
                            if(value === true){
                                editor({                                             
                                      field: "dollarThresholdAvailable",
                                      sortable: false                         
                                    },TextBox).placeAt(node);
                            }
                        }),         
                }

Upvotes: 0

Ken Franqueiro
Ken Franqueiro

Reputation: 10559

To disable direct selection, set selectionMode: "none" in the properties passed to the constructor. This does not affect selection via a selector column.

You should still be able to set the label in the header cell of a selector column by setting the label property in the object passed to the selector column plugin.

If you want to use Dijit form widgets for the purpose of changing values of fields in items, you should probably not be defining renderCell functions yourself, but instead use the editor column plugin, which does the work of maintaining the state of data and putting it back in the store when you call save.

Upvotes: 3

Related Questions