Change cell value if checkbox selected - dhtmlxGrid in RoR

lbramos picture lbramos · Oct 28, 2013 · Viewed 7.5k times · Source

I'm using dhtmlxGrid on RoR. I have a checkbox and an event "onCheck" that gets activated each time the checkbox is checked.

<script type="text/javascript" charset="utf-8">
        var grid = new dhtmlXGridObject("grid_here");
        grid.setImagePath("/images/dhtmlx/imgs/");
        grid.setHeader("Result, PatientID, Approved, Status, Approved Date");
        grid.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,#text_filter"); 
        grid.setColTypes("txt,ed,ch,co,ed");
        grid.setColSorting("str,str,str,str,date");  
        grid.setInitWidths("100,100,*");
        grid.setSkin("dhx_skyblue");
        grid.init();
        grid.load("/approves/data");
        grid.attachEvent("onCheck",doOnCheckBoxSelected);

        dp = new dataProcessor("/approves/dbaction.xml");
        dp.init(grid);

        function doOnCheckBoxSelected(rID, cInd, state)
        {
            if (state=='1')
                {alert("date approved");}

        }
    </script>

The "alert" world fine when I check any checkbox. What I want to do now, is to automatically change the values in the cells "Status" and "Approved Date", when the checkbox is checked. The checkbox is called "Approved" and when people click on the "Approved" checkbox, I want the cell called "Approved Date" to be automatically updated with the current date, and the "Status" to change to "Approved".

I don't know how to store new values inside a grid cell.. How can I do this, is it possible?

Answer

user2844810 picture user2844810 · Oct 29, 2013

you already have the rowId you want to update, so you only need to tell the grid to set the values on the columns you want, and mark the row as updated for your dataprocessor to detect the change

function doOnCheckBoxSelected(rID, cInd, state){
    if (state=='1'){
        alert("date approved");
    }
    var currentDate = new Date(); //This is just an example, here you can generate the Date in the format you wish.
    /*Here goes the column index in which the date or status are...
    In this case I'm assuming in the column 3 is the Status and in 4 the Date of approval, change them to your 
    real indexes*/
    grid.cells(rID,3).setValue('Approved');
    grid.cells(rID,4).setValue(currentDate);

    dp.setUpdated(rID,true); //You tell your dataProcessor that the row was updated, so it mark the row as updated
    return true; //if i recall correctly this is needed for the function to end correctly, maybe not
}