Question

I need to get values from cells table. If u know how to do that I will really appreciate it.

Trying a few days, but I have no idea how to get columnID and ROWID

I found this, but it does not work

.igGrid( "getCellValue", rowId:object, colKey:string );

Here is code (how I can get values from a table)?

$.ig.loader(function () {
$("#grid2").igGrid({

autoGenerateColumns: false,
renderCheckboxes: true, 

columns:[                
            { headerText: "X", key: "x", dataType: "number", width: "40%"},
            { headerText: "Y", key: "y", dataType: "number", width: "40%"},
            { headerText: "Z", key: "z", dataType: "number", width: "40%"},

        ],

//dataSource: data,

height: "400px",
width: "100%",
features:[
            {
                name: "Filtering",
                allowFiltering: true,
                type: "local"
            },
            {
                name: "Selection",
                mode: "row"
            },
            {
                name: "Updating",
                enableAddRow: false,
                editMode: "row",
                // event raised after end row editing but before dataSource was updated
                editCellEnding: function (evt, ui) {
                    // get cell’s checkbox value when it is changed
                    if (ui.update) {
                        if (ui.columnKey === "nid") {
                            logEvent("editCellEnded event fired. Column Key = " +
                        ui.columnKey + "; Row Index = " +
                        ui.rowID + "; Cell Value = " +
                        ui.value + "; Update = " +
                        ui.update);
                        }
                    }
                },
                enableDeleteRow: false,
                columnSettings: [
                {
                    columnKey: "x",

                }, 
                {
                    columnKey: "y"
                }, 
                {
                    columnKey: "z"
                }]
            }

        ]
});

$.ajax({
    type: "POST",
    url: "http://cmsdemo.trueoffice.com/feature-json",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){
        $("#grid2").igGrid({
        dataSource: data 
     });
    }
});
    $("#grid2").live("iggridupdatingdatadirty", function (event, ui) {
            $("#grid2").igGrid("commit");
            return false;
        });
    // show the raised event
        function logEvent(message) {
            var evntWrap = $("#eventList");
            $(evntWrap).append("<div>" + message + "<div>");
            $(evntWrap).prop("scrollTop", $(evntWrap).prop("scrollHeight"));
        }
 });

//Functions         
function Filter() {
      var columnSettings = $("#grid1").igGridFiltering("option", "columnSettings");

        var expr = $("#filterExpr").val(),
            condition = $("#cond_list").val(),
            filterColumn = $("#filterColumn").val();
        $("#grid1").igGridFiltering("filter", ([{fieldName: filterColumn, expr: expr, cond: condition}]));
    }

    function SetConditions() {
        var filterColumn = $("#filterColumn").val();
        $("#cond_list option:selected").removeAttr("selected");
        if (filterColumn === "title" || filterColumn === "nid") {
         $("#cond_list .stringCondition").attr("disabled", "disabled");
         $("#cond_list .numberCondition").removeAttr("disabled").eq(0).attr("selected", "selected");
        }
        else {
            $("#cond_list .stringCondition").removeAttr("disabled").eq(0).attr("selected", "selected");
            $("#cond_list .numberCondition").attr("disabled", "disabled");
        }
    }
    function buttonClickHandler(buttonId) {
    alert("Button with id " + buttonId + " was clicked");
}   

Was it helpful?

Solution

It's very frustrating with IG sometimes. But, you have a few options. If you only care about the columns you can SEE... i.e., you've hidden some columns but you don't need to access them, then you can just access the ui object when the editRowEnd or editRowEnding events fire. Otherwise, you need to use the underlying dataSource's dataView. Here's how it all should look, including grid:

 grid = $("#grid").igGrid({
   height: 400,
   width: null,     //if null, the grid should stretch to fit
   virtualization: false,
   autoGenerateColumns: false,
   columns: [
     ......
   ],
   autoupdate: false,
   features: [
    { name: "Updating",
        enableAddRow: true,
        enableDeleteRow: true,
        editMode: 'row',
        editMode: 'cell',
        enableDataDirtyException: false,
        rowAdded: function(evt, ui) {
          alert("this is a visible column (title): " + ui.values.title);
        },
        editRowEnded: function(evt, ui) {
          var row = ui.owner.grid.dataSource.dataView()[ui.owner._rowIndex];
          alert("this is my id column, which is hidden: " + row.id);                  
        },
        rowDeleted: function(e, ui) {
          ... do something
        }
    },
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top