jQWidgets Forums

jQuery UI Widgets Forums Grid How to make the grid row non editable on the basis of a particular column sell value

This topic contains 6 replies, has 2 voices, and was last updated by  Apeksha Singh 11 years, 12 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author

  • Apeksha Singh
    Participant

    Hi,

    Please guide me how I can make a particular row non editable on the basis of an image column.

    If a particular cell of the image column contain an image then that row should be non editable otherwise it should be editable.

    Please reply as soon as possible.

    Thanks & Regards,

    Apeksha


    Peter Stoev
    Keymaster

    Hi,

    To make a row non editable, see: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/disableeditingofrows.htm?web. The sample uses the Row index as a condition. However, in your scenario you may use the “getcellvalue” to get the value of a specific Grid cell and to determine whether to allow or disallow editing.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    Apeksha Singh
    Participant

    Hi Peter Stoev,

    Please can you share a piece of code using the “getcellvalue” to get the value of a specific Grid cell from an image column and determine allow or disallow editing.
    My image column cell contains image or null value.

    Thanks & Regards,
    Apeksha


    Peter Stoev
    Keymaster

    Hi,

    Here’s how to use the “getcellvalue” method.

    // @param row index.
    // @param column datafield.
    var value = $('#jqxGrid').jqxGrid('getcellvalue', 0, "columndatafield");

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    Apeksha Singh
    Participant

    Hi Peter Stoev,

    I have idea of getcellvalue by your jqwidgets document.
    Please tell me how I can check using it that how many rows , image columns are having image in it and how many are empty.
    In the above syntax what if I don’t enter the row id.Will it save the whole grid value in this variable.

    Thanks & Regards,
    Apeksha


    Peter Stoev
    Keymaster

    Hi,

    I cannot know whether your cell(s) has an image or not and how the images are rendered in the cells. The “getcellvalue” method will return the value of a Grid cell. What do you mean by “whole grid value”? If you want to get the Array of records displayed in the Grid and want to check all records about something, then you should use the “getrows” method which returns an Array object. Having an array, you can loop through the Grid records and implement your custom logic.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com


    Apeksha Singh
    Participant

    Hi Peter Stoev,

    This is my code for the grid that is having a image column and checkboxes column :-

     var source =
    {
    localdata: tax_rate_data,
    datatype: "json",
    datafields:
    [
    { name: 'item', type: 'bool' },
    { name: 'name', type: 'string' },
    { name: 'tax_value', type: 'number' },
    { name: 'total_tax_rate', type: 'string' },
    { name: 'effective_tax_rate', type: 'string' },
    { name: 'tax_count', type: 'number' },
    { name: 'tax_rate_id', type: 'number' },
    { name: 'component_1', type: 'string' },
    { name: 'component_2', type: 'string' },
    { name: 'component_3', type: 'string' },
    { name: 'component_4', type: 'string' },
    { name: 'component_5', type: 'string' },
    { name: 'component_6', type: 'string' },
    { name: 'tax_component_id', type: 'number' },
    { name: 'rate_1', type: 'float' },
    { name: 'rate_2', type: 'float' },
    { name: 'rate_3', type: 'float' },
    { name: 'rate_4', type: 'float' },
    { name: 'rate_5', type: 'float' },
    { name: 'rate_6', type: 'float' },
    { name: 'compound_1', type: 'string' },
    { name: 'compound_2', type: 'string' },
    { name: 'compound_3', type: 'string' },
    { name: 'compound_4', type: 'string' },
    { name: 'compound_5', type: 'string' },
    { name: 'compound_6', type: 'string' },
    ],
    id: 'id',
    root: 'data',
    };
    // Code to display image column
    var imagerenderer = function (row, datafield, value) {
    if (row == 0 || row == 2 || row == 5)
    return '<img style="margin-left: 15px;" height="20" width="20" src="images/stock_lock.png"/>';
    }
    var dataAdapter = new $.jqx.dataAdapter(source);
    var columnCheckBox = null;
    var updatingCheckState = false;
    // initialize jqxGrid
    $("#tax_rate_table").jqxGrid(
    {
    width: '97.7%',
    source: dataAdapter,
    theme:'metro' ,
    autoheight: true,
    sortable: true,
    altrows: true,
    enabletooltips: true,
    editable:true,
    pageable: true,
    pagesizeoptions: ['10', '20','30','40','50'],
    selectionmode: 'none',
    columns: [
    { text: 'Locked', datafield: 'image', width: '6%', editable:false, cellsrenderer: imagerenderer },
    { text: '', columntype: 'checkbox', datafield: 'item', width: '8%', renderer: function () {
    return '<div style="margin-left: 21px; margin-top: 5px;"></div>';
    },
    rendered: function (element) {
    $(element).jqxCheckBox({ theme: 'metro', width: 16, height: 16, animationShowDelay: 0, animationHideDelay: 0 });
    columnCheckBox = $(element);
    $(element).on('change', function (event) {
    var paginginformation = $("#tax_rate_table").jqxGrid('getpaginginformation');
    var pagenum = paginginformation.pagenum;
    var pagesize = paginginformation.pagesize;
    var pagescount = paginginformation.pagescount;
    var k = 1;
    var pageArray = new Array();
    for (var i = pagenum * pagesize; i < (pagenum + 1) * pagesize; i++) {
    pageArray.push(i);
    };
    var checked = event.args.checked;
    if (checked == null || updatingCheckState) return;
    var rowscount = $("#tax_rate_table").jqxGrid('getdatainformation').rowscount;
    $("#tax_rate_table").jqxGrid('beginupdate');
    if (checked) {
    $("#tax_rate_table").jqxGrid({ selectedrowindexes: pageArray });
    // $("div.item_label label").text(pagesize);
    for (m = pagenum * pagesize; m < (pagenum + 1) * pagesize; m++) {
    var value = $('#tax_rate_table').jqxGrid('getcellvalue', m, "item");
    if (value != null) {
    k = k * 1;
    } else {
    k = k * 0;
    break;
    };
    };
    if (k != 1) {
    $(element).jqxCheckBox('uncheck');
    };
    $("div.item_label label").text(m);
    x=m;
    }
    else if (checked == false) {
    $("#tax_rate_table").jqxGrid('clearselection');
    $("div.item_label label").text(0);
    }
    for (var j = (pagenum) * pagesize; j < (pagenum + 1) * pagesize; j++) {
    $("#tax_rate_table").jqxGrid('setcellvalue', j, 'item', event.args.checked);
    }
    $("#tax_rate_table").jqxGrid('endupdate');
    });
    }},
    { text:'Name',datafield:'name', width:'23%',editable:false},
    { text:'Tax Value',datafield:'tax_value', width:'14%',editable:false},
    { text: 'Tax Rate', datafield: 'total_tax_rate', width:'15%',editable:false },
    { text: 'Effective Tax Rate', datafield: 'effective_tax_rate', width:'18%',editable:false },
    { text: 'Account Using', datafield: 'tax_count', width: '16%',editable:false},
    { text: 'Row Id', datafield: 'tax_rate_id', hidden:true,editable:false},
    { text: 'comp id', datafield: 'tax_component_id', hidden:true,editable:false},
    { text: 'Comp1', datafield: 'component_1', hidden:true,editable:false},
    { text: 'Comp2', datafield: 'component_2', hidden:true,editable:false},
    { text: 'Comp3', datafield: 'component_3', hidden:true,editable:false},
    { text: 'Comp4', datafield: 'component_4', hidden:true,editable:false},
    { text: 'Comp5', datafield: 'component_5', hidden:true,editable:false},
    { text: 'Comp6', datafield: 'component_6', hidden:true,editable:false},
    { text: 'Rate1', datafield: 'rate_1', hidden:true,editable:false},
    { text: 'Rate2', datafield: 'rate_2', hidden:true,editable:false},
    { text: 'Rate3', datafield: 'rate_3', hidden:true,editable:false},
    { text: 'Rate4', datafield: 'rate_4', hidden:true,editable:false},
    { text: 'Rate5', datafield: 'rate_5', hidden:true,editable:false},
    { text: 'Rate6', datafield: 'rate_6', hidden:true,editable:false},
    ]
    });

    Can you please tell me how can I add images in the column in respect of datafield like “name” .
    As you can see right now I am using row to display images.
    Also I want to make all the rows that has an image non-editable.

    Thanks & Regards,
    Apeksha

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.