Jtable only displays when stepping through debugger

Question

Hi I am struggling to display my jtable. It only displays when I step through the javascript with the debugger.

$("body").on("click", "#tabRole", function () {
        document.getElementById("1").className = "inactive";
        document.getElementById("2").className = "active";

        $('#Admin-details').load('../Admin/ADRoleAdmin');
        jTableRoles();
    });

This method loads ADRoleAdmin as a partial view into a div. Then jTableRoles() should load the jtable into a div (jTableRoles) inside ADRoleAdmin:

var jTableRoles = function () {
    $(function () {
        debugger;
        $('#jTableRoles').jtable({
            paging: true, 
            pageSize: 20,
            sorting: true,
            title: 'Roles',
            onRowEdit: function (event, data) {
                UpdateRoleDetails(data.records.RoleId, data.records.RoleName);
            },
            actions: {
                listAction: '../Admin/GetRoles',
                updateAction: 'dummy'
            },
            toolbar: {
                items: [{
                    icon: '../Content/images/Misc/Add icon.png',
                    text: 'Create New',
                    click: function () {
                        UpdateRoleDetails(0, '');
                    }
                }]
            },
            fields: {
                Id: {
                    key: true,
                    list: false
                },
                Name: {
                    title: 'Role name',
                },
                Description: {
                    title: 'Role description',
                    sorting: false
                }
            }
        });

        $('#jTableRoles').jtable('load');
    });
}

Please tell me what I am doing wrong or what I can do different to make it work.

Answer 1

Looping through the steps takes extra time. It looks like the load of ADRoleAdmin is not finished on the moment the jTable is loaded.

Try to start the jtable after a certain timeout to check. Preferably load the ADRoleAdmin an on it's postback load the jTable