Base solution for your next web application
Open Closed

Jtable data #1857


User avatar
0
huntethan89 created

Hi,

I want to show data in jtable from database but not able to view data. i am able to retreive data from database but not able to show on browser, It stuck at loading bar.

i want to know what parameters we need to pass when calling the load method of jtable.

Thanks


3 Answer(s)
  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi,

    There are examples of how to get data with jtable in AspNet Zero templates. Do you get a specific error ? And, can you share your jtable code ?

    Thanks.

  • User Avatar
    0
    huntethan89 created

    Hi, It is showing loading image constantly, not showing the data from database.

    code is as below:-

    this is Index.js file code. to load data in grid.


    var _$FileTable = $('#FileTable'); // div where we add the grid.

    _$FileTable.jtable({ title: app.localize('File Tracking'),

            actions: {
                listAction: {
                    method: _fileService.GetFiles
                }
            },
    
            fields: {
                id: {
                    key: true,
                    list: false
                },
                actions: {
                    title: app.localize('Actions'),
                    width: '30%',
                    display: function (data) {
                        var $span = $('<span></span>');
    
                        if (_permissions.edit) {
                            $('<button class="btn btn-default btn-xs" title="' + app.localize('Edit') + '"><i class="fa fa-edit"></i></button>')
                                .appendTo($span)
                                .click(function () {
                                    _createOrEditModal.open({ id: data.record.id });
                                });
                        }
    
                        if (!data.record.isStatic && _permissions.delete) {
                            $('<button class="btn btn-default btn-xs" title="' + app.localize('Delete') + '"><i class="fa fa-trash-o"></i></button>')
                                .appendTo($span)
                                .click(function () {
                                    deleteRole(data.record);
                                });
                        }
    
                        return $span;
                    }
                },
                displayName: {
                    title: app.localize('FileName'),
                    width: '35%',
                    display: function (data) {
                        var $span = $('<span></span>');
    
                        $span.append(data.record.FileName + "   ");
    
                        return $span;
                    }
                },
                creationTime: {
                    title: app.localize('CreationTime'),
                    width: '35%',
                    display: function (data) {
                        return moment(data.record.CreateDate).format('L');
                    }
                }
            }
        });
    

    function getRoles() { _$FileTable.jtable('load'); }

        getRoles();
    

    FiletrackingAppservice.cs ( this is i am using to retireve data from database)

    public ListResultDto<FileListDto> GetFiles(GetFileTrack input) { var files = _fileRepository .GetAll() .Include(p => p.User) .WhereIf( !input.Filter.IsNullOrEmpty(), p => p.FileName.Contains(input.Filter) || p.FilePath.Contains(input.Filter) || p.File_Status.Contains(input.Filter) ) .OrderBy(p => p.FileName) .ThenBy(p=>p.File_Status) .ToList();

            return new ListResultDto&lt;FileListDto&gt;(files.MapTo&lt;List&lt;FileListDto&gt;>());
    
        }
    

    Thanks

  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi,

    The problem is probably because of this. When defining the list action of jTable use

    _fileService.getFiles
    

    instead of

    _fileService.GetFiles
    

    .

    method name should start with a lower case character.