everpresentrow and diasble grid - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: datagrid, datagrid control, everpresentrow, grid control

This topic contains 3 replies, has 3 voices, and was last updated by admin 3 years, 9 months ago.

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

Author

everpresentrow and diasble grid Posts

December 21, 2020 at 7:51 pm everpresentrow and diasble grid #114071

arkgroup

Participant

I made grid disable or not editing, but still can add rows using ever present row.

Thanks

December 22, 2020 at 1:32 pm everpresentrow and diasble grid #114077

Hristo

Participant

Hello arkgroup,

I tested this example and it seems to work fine:
http://jsfiddle.net/0mn7Lwxa/1/
Also, I would like to mention that are different features.
If you set the editable: false option this will prevent editing the cells.
With the disabled: true option you disable all interactions with the jqxGrid.
But you still can use its methods programmatically.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

December 23, 2020 at 1:51 pm everpresentrow and diasble grid #114085

arkgroup

Participant

in this example I be able to add empty row

<!DOCTYPE html>
<html lang="en">
<head>
    <title id='Description'>This example illustrates the Grid's Ever Present Row feature.</title>
    <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />
    <script type="text/javascript" src="../../../scripts/jquery-1.12.4.min.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxgrid.filter.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxgrid.sort.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxgrid.edit.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxgrid.columnsresize.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxpanel.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxcalendar.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxradiobutton.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxdatetimeinput.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/globalization/globalize.js"></script>
    <script type="text/javascript" src="../../../scripts/demos.js"></script>
    <script type="text/javascript" src="generatedata.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var data = generatedata(10);
            var source =
            {
                localdata: data,
                datafields:
                [
                    { name: 'name', type: 'string' },
                    { name: 'productname', type: 'string' },
                    { name: 'available', type: 'bool' },
                    { name: 'date', type: 'date'},
                    { name: 'quantity', type: 'number' }
                ],
                datatype: "array"
            };

            var dataAdapter = new $.jqx.dataAdapter(source);

            $("#grid").jqxGrid(
            {
                width: getWidth('Grid'),
                filterable: true,
                source: dataAdapter,
                showeverpresentrow: true,
                everpresentrowposition: "top",
                editable: true,
                selectionmode: 'multiplecellsadvanced',
                columns: [
                  {
                      text: 'Name', columntype: 'textbox', filtertype: 'input', datafield: 'name', width: 215
                  },
                  {
                      text: 'Product', filtertype: 'checkedlist', datafield: 'productname', width: 220
                  },
                  { text: 'Ship Date', datafield: 'date', filtertype: 'range', width: 210, cellsalign: 'right', cellsformat: 'd' },
                  { text: 'Qty.', datafield: 'quantity', filtertype: 'number',  cellsalign: 'right' }
                ]
            });

            $("#top").jqxRadioButton({ checked: true });
            $("#bottom").jqxRadioButton();
            $("#top").on('checked', function () {
                $("#grid").jqxGrid('everpresentrowactions', 'add reset');
            });
            $("#bottom").on('checked', function () {
                $("#grid").jqxGrid('everpresentrowactions', 'addBottom reset');
            });

			 $('#grid').jqxGrid({ disabled:true}); 

        });
    </script>
</head>
<body>
    <div id="grid">
    </div><br />
    <div id="top">Add New Row to Top</div>
    <div id="bottom">Add New Row to Bottom</div>

<div style="position: absolute; bottom: 5px; right: 5px;">
<a href="https://www.jqwidgets.com/" alt="https://www.jqwidgets.com/"><img alt="https://www.jqwidgets.com/" title="https://www.jqwidgets.com/" src="https://www.jqwidgets.com/wp-content/design/i/logo-jqwidgets.png"/></a>
</div>
</body>
</html>

December 24, 2020 at 8:53 am everpresentrow and diasble grid #114096

admin

Keymaster

Hi arkgroup,

We are unable to reproduce this DataGrid behavior with the latest version of our DataGrid component. If you are using an older version, we suggest you to update to latest as we frequently fix issues and most probably this one is already resolved.

Best regards,
Peter Stoev

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

Author

Posts

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

You must be logged in to reply to this topic.