jQuery UI Widgets Forums Grid editable mode

This topic contains 5 replies, has 2 voices, and was last updated by  Peter Stoev 10 years, 10 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • editable mode #2675

    etc431
    Member

    Hi

    For example:
    I have created a grid with 4(columns)*10(rows) and setted the value of “editable” to true.

    My Question:
    Is it possible
    1–Setting first column to “uneditable”
    2–Setting The background of first column to “gray”

    Best Regards,
    Jerry

    editable mode #2676

    Peter Stoev
    Keymaster

    Hi Jerry,

    Each column has an ‘editable’ property and if you want to disable the column’s editing, set its ‘editable’ property to false.

    Code example:

    { text: 'First Name', columntype: 'textbox', editable: false, datafield: 'firstname', width: 90 }

    jQWidgets Team
    http://www.jqwidgets.com

    editable mode #2918

    etc431
    Member

    Hi Peter:

    Thank you for your answer. I’ve resolved my first problem with your help.

    The another question is :

    Can I change the background color of the colume by setting the value of property ?

    Best Regards,
    Jerry

    editable mode #2922

    Peter Stoev
    Keymaster

    Hi Jerry,

    It is possible to change the cells rendering of all cells in a column by defining a custom render function. The function is called when a cell is going to be rendererd.

    To change the background color of a cell you can use a code like this:

    $("#jqxgrid").jqxGrid(
    {
    width: 670,
    source: dataAdapter,
    theme: theme,
    columnsresize: true,
    columns: [
    { text: 'First Name', dataField: 'firstname', cellsrenderer: function (row, column, value) {
    return '<div style="background: #aabbcc; width: 100%; height: 100%;">' + value + '</div>';
    }, width: 100
    },
    { text: 'Last Name', dataField: 'lastname', width: 100 },
    { text: 'Product', dataField: 'productname', width: 180 },
    { text: 'Quantity', dataField: 'quantity', width: 80, cellsalign: 'right' },
    { text: 'Unit Price', dataField: 'price', width: 90, cellsalign: 'right', cellsformat: 'c2' },
    { text: 'Total', dataField: 'total', cellsalign: 'right', minwidth: 100, cellsformat: 'c2' }
    ]
    });

    Hope this helps you.

    jQWidgets Team
    http://www.jqwidgets.com

    editable mode #2933

    etc431
    Member

    Hi Peter:

    Thank for your answer.

    It works when the columntype is edit.

    But it doesn’t works when the columntype is checkbox.

    Can I change the background color of the checkbox colume ?

    Best Regards,
    Jerry

    editable mode #2935

    Peter Stoev
    Keymaster

    Hi Jerry,

    That’s true, the custom renderer function will not be called for Checkbox column. There’s an option to change the background of all Grid cells by editing the “.jqx-grid-cell” CSS class in the jqx.base.css file.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

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

You must be logged in to reply to this topic.