ParamQuery grid support forum

General Category => Help for ParamQuery Grid (free version) => Topic started by: mraj on February 23, 2024, 01:05:46 pm

Title: How to use icons in free version of param query grid. ui icons not working.
Post by: mraj on February 23, 2024, 01:05:46 pm

Hi,

I am New to param query grid  using free version.

Please provide links or samples for

1. For using icons in the toolbar, what are the include files needed for it. Below code is not working. even I have included jquery-ui.css, js files, pqgrid.css

  toolbar: {
                       
                        items: [{
                            type: 'button',
                            icon: 'ui-icon-document',
                            label: 'New Row',
                            listener: function () {
                                addRow(this);
                            }


2. Elaborate on ui.$cell, or links  about it. and other javascript objects.

3. getChanges, whenever requested, it adds extra row in the corresponding grid.

Title: Re: How to use icons in free version of param query grid. ui icons not working.
Post by: mraj on February 23, 2024, 05:41:38 pm

I am using bootstrap@5.3.2.

after that using ace, fa, and  jquery-ui.

Still not working.

Also pager icons are also not showing.

Title: Re: How to use icons in free version of param query grid. ui icons not working.
Post by: paramvir on February 23, 2024, 06:26:26 pm

There are lot of examples using ui-icons: https://paramquery.com/demos/editing_batch

Required include files are mentioned in the tutorial section: https://paramquery.com/tutorial#topic-include

please share a jsfiddle if you are facing any issues.

Also refer to API documentation https://paramquery.com/api for API usage.

Title: Re: How to use icons in free version of param query grid. ui icons not working.
Post by: mraj on March 02, 2024, 11:08:08 am

Hi,

The example code that is given gets icons classes ( ui-icon-plus) applied. but in my application the icon classes is not getting applied.
Here with attached the screen shots.

These are the script files i am using,

    <script src="https://unpkg.com/jquery@3.4.0/dist/jquery.js"></script>
    <link href="https://unpkg.com/jquery-ui-pack@1.12.2/jquery-ui.css" rel="stylesheet" />
    <link href="https://unpkg.com/jquery-ui-pack@1.12.2/jquery-ui.structure.css" rel="stylesheet" />
    <link href="https://unpkg.com/jquery-ui-pack@1.12.2/jquery-ui.theme.css" rel="stylesheet" />
    <script src="https://unpkg.com/jquery-ui-pack@1.12.2/jquery-ui.js"></script>

      <link href="https://unpkg.com/pqgridf@3.5.0/pqgrid.min.css" rel="stylesheet" />
    <link href="https://unpkg.com/pqgridf@3.5.0/pqgrid.ui.min.css" rel="stylesheet" />
    <link href="https://unpkg.com/pqgridf@3.5.0/themes/steelblue/pqgrid.css" rel="stylesheet" />

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script src="https://unpkg.com/pqgridf@3.5.0/pqgrid.min.js"></script>
    <script src="https://unpkg.com/pqgridf@3.5.0/localize/pq-localize-en.js"></script>
    <script src="https://unpkg.com/file-saver@2.0.1/dist/FileSaver.min.js"></script>

Title: Re: How to use icons in free version of param query grid. ui icons not working.
Post by: mraj on March 02, 2024, 04:05:31 pm

* * * Boot strap 5.3 version icons are working, which was added in toolbar  property class : 'btn btn-primary bi-alarm ' , but with property  icon: 'ui-icon-plus'  its classes are not getting applied.

using Bootstrap 5.3 cdn.