jQWidgets Forums

Forum Replies Created

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts

  • Swapnil
    Participant

    please look at this example. It is not working.

    Example

    Thanks,
    Swapnil.


    Swapnil
    Participant

    hi Hristo,

    Yes I thought so. Thanks for the suggestion.

    I think these 2 functionalities won’t work together (I am not able to make it work).
    I end up making a separate call to get columns info upfront in resolver and then doing Server side paging.

    Thanks,
    Swapnil.


    Swapnil
    Participant

    Hello Histro,

    I looked at the example but, it is only server side paging.

    For me Server side paging and Dynamic columns both are working individually, but I am trying to implement Dynamic columns with Server side paging and that’s when I am facing issues.

    Please let me know if you have example of this.

    Thanks,
    Swapnil.


    Swapnil
    Participant

    I played with the code little bit and now I can get the grid to display with columns but no data in the grid.
    rendergridrows this function is not getting called.

    Here is the updated code

        DATA_FEED_REVIEW_URL = '/api/data-feeds';
    
        @ViewChild('datafeedReview', {static: true}) datafeedGrid: jqxGridComponent;
        showExceptions = true;
        totalExceptions;
        rendergridrows = (params: any): any => {
            return params.data;
        }
        source: any = {
            url: <code>${this.DATA_FEED_REVIEW_URL}?showExceptions=${this.showExceptions}</code>,
            datatype: 'json',
            datafields: [
                {name: 'programId', type: 'number'},
                {name: 'programName', type: 'string'},
                {name: 'dataFeedId', type: 'number'},
                {name: 'dataFeedName', type: 'string'},
                {name: 'dataFeedTypeName', type: 'string'},
                {name: 'startDate', type: 'date'}
            ],
            root: 'data_feed_list',
            cache: false,
            beforeprocessing: (data) => {
              console.log('called before processing');
              this.source.totalrecords = data[2].total_count;
              this.source.datafields = this.getDataFields(data);
            },
            id: 'dataFeedId',
            virtualmode: true,
            rendergridrows: this.rendergridrows
        };
    
        private getColumns(data: any): any {
          return [
              {text: 'Program Name', datafield: 'programName', align: 'left', cellsalign: 'left'},
              {text: 'Data Feed Name', datafield: 'dataFeedName', align: 'left', cellsalign: 'left'},
              {text: 'Data Feed Type', datafield: 'dataFeedTypeName', filtertype: 'list', align: 'left', cellsalign: 'left'},
              {text: 'Start Date', datafield: 'startDate', filtertype: 'date', align: 'center', cellsalign: 'center', cellsformat: 'd' },
              { text: 'End Date', datafield: 'endDate', filtertype: 'date', align: 'center', cellsalign: 'center', cellsformat: 'd'},
          ];
        }
        private getDataFields(data: any): any {
          return [
              {name: 'programId', type: 'number'},
              {name: 'programName', type: 'string'},
              {name: 'dataFeedId', type: 'number'},
              {name: 'dataFeedName', type: 'string'},
              {name: 'dataFeedTypeName', type: 'string'},
              {name: 'startDate', type: 'date'},
              {name: 'endDate', type: 'date'}
          ];
        }
    
        onSort = (event: any): any => {
            this.datafeedGrid.updatebounddata('sort');
        }
    
        onFilter = (event: any): any => {
            this.datafeedGrid.updatebounddata('filter');
        }
        cellClick(event: any): void {
            if (event.args.columnindex === 1) {
                const rowData = this.datafeedGrid.getrowdata(event.args.rowindex);
            }
        }
    
        showExceptionOnlyRecords(val: boolean): void {
            this.source.url = <code>${this.DATA_FEED_REVIEW_URL}?showExceptions=${val}</code>;
            this.datafeedGrid.updatebounddata();
        }
    
        dataAdapter = new jqx.dataAdapter(this.source, {
            autoBind: true,
            loadComplete: (data) => {
                console.log('called  downloadComplete');
                const columns = this.getColumns(data);
                this.datafeedGrid.hideloadelement();
                this.datafeedGrid.beginupdate();
                this.datafeedGrid.setOptions
                ({
                    columns: columns
                });
                this.datafeedGrid.endupdate();
                console.log('in downloadComplete');
            },
            // loadComplete: (data) => {
            //     console.log('called load complete');
            // },
            loadError: (xhr, status, error) => {
                console.log('called load error ');
            }
        });
    

    and HTML template :

    <div class="col-md-11">
          <jqxGrid #datafeedReview (onCellclick)="cellClick($event)"
                   [theme]="'nova'" [width]="'100%'" [pageable]="true" [pagesize]="20" 
                   [pagesizeoptions]="[10, 20, 30, 40, 50]" [autoheight]="true" [sortable]="true"
                   [altrows]="true"  [enabletooltips]="true"  [editable]="true"
                   [selectionmode]="'multiplecellsadvanced'" (onCellclick)="cellClick($event)"
                   (onSort)="onSort($event)" (onFilter)="onFilter($event)"></jqxGrid>
        </div>

    Please let me know if I am missing something.


    Swapnil
    Participant

    hi Peter,
    I don’t think we can select these elements. It only adds an anchor tag with href.
    When I see in the developer tool I see the div tag as shown below.
    <div style="padding-bottom: 2px; text-align: center; margin-top: 7px;"><a href="#">Add</a></div>

    You can see this on the DEMO page as well
    https://www.jqwidgets.com/angular/angular-grid/#https://www.jqwidgets.com/angular/angular-grid/angular-grid-everpresentrowwithcolumns.htm
    Select Ever present row with columns.

    Instead of href="#", if you could change it to href="javascript:void()", it won’t navigate.

    Thanks,
    Swapnil.


    Swapnil
    Participant

    Thanks Hristo, this works, but I thought there might be some flag which I can set for aggregates like we have on columns (exportable)

    Thanks,
    Swapnil.


    Swapnil
    Participant

    Hello Peter,

    We have jqwidgets license, but we download the jqwidgets using bower components and we want to remove this hyperlink.
    Could you please let us know how we can do this?

    Thanks,
    Swapnil.

    in reply to: Datatable – Inline edit Datatable – Inline edit #54232

    Swapnil
    Participant

    Hi Peter,

    2. It happen for every row which is last in my data table.
    Below is the simple function which i have for validation of the first column.(Datatable code is in first post.)
    Thanks,
    Swapnil.

    
    function validateCarrier(cell, value){
    		if(trimValue(value) == ''){
    			return {message: "Please enter a Carrier Code.", result: false};
    		}
                    if(checkUniqueCarrier(value, cell.row) > 0) {
    			return {message: "Carrier "+ value +" already exists. Please correct.", result: false};
    		}
    		if(!carrierExistInDB(value)) {
    			return {message: "Carrier "+ value +" is not valid. Please correct.", result: false};
    		}
            return true;
        }
    
    in reply to: Datatable – Inline edit Datatable – Inline edit #54142

    Swapnil
    Participant

    Peter,
    event.preventDefault() and event.stopPropagation()
    I tried both these methods but none worked. It still scrolls.

    I have one more issue with this table. I have validation on first column and when there is only one row in table the error message is not visible. When I see the dom it seems like the left property on div is set to -200 and because of that its not visible.
    What should I do to bring it up?

    Thanks,
    Swapnil.

    in reply to: Datatable – Inline edit Datatable – Inline edit #53991

    Swapnil
    Participant

    Hi Peter, one more question, how I can reload the data table with new data? I am using local data binding.
    Thanks,
    Swapnil.

    in reply to: Datatable – Inline edit Datatable – Inline edit #53989

    Swapnil
    Participant

    Hi Peter,
    Thanks.
    What about the Validation error row details? how can I get those if there is error.
    Also How to stop the page scroll on click of ADD/Cancel?
    Thanks,
    Swapnil.

    in reply to: Grid export to excel Grid export to excel #22207

    Swapnil
    Participant

    I specifying the options correctly, but still when I click the export option, I am getting redirected to the local file which I have as a URL.

    Could you please let me know which files do I need to include to make this work properly?

    Thanks
    Zee

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