CODEWITHSUNDEEP
javascriptjqueryjqgrid
shv22
shv22

Reputation: 690

On load jquery not working

Hi I have jqgrid which on resize trigger a function so that it resizes according to window size. This function fine but I need that same function to work when the jqgrid loads so I am calling the function like this

$(window).bind("load", function() {
     $('#' + grid_id).setGridWidth(width, true); //Back to original width
    $('#' + grid_id).setGridWidth($('#' + div_id).width(), true); //Resized to new width as per window
    });

But it is not working.

The same function is called when the window is resized like this

$(window).bind('resize', function () {
            $('#' + grid_id).setGridWidth(width, true); //Back to original width
            $('#' + grid_id).setGridWidth($('#' + div_id).width(), true); //Resized to new width as per window
        }).trigger('resize');

And it works fine. What is wrong am I doing here.

Upvotes: 0

Views: 175

Answers (2)

Oleg
Oleg

Reputation: 221997

You can call setGridWidth method of jqGrid only after the grid is created.

I suppose that you need to do is probably adding the option autowidth: true.

If you want to implement your own custom resizing then you can do it inside of jqGridAfterLoadComplete event. The code could be about the following:

var $grid = $("#grid"),
    resizeGrid = function () {
        var newWidth = $(this).closest(".ui-jqgrid").parent().width();
        $(this).jqGrid("setGridWidth", newWidth, true);
    };

$(window).on("resize", function() {
    resizeGrid.call($grid);
});

$grid.on("jqGridAfterLoadComplete", resizeGrid)
.jqGrid({
    // all jqGrid options
});

See https://jsfiddle.net/OlegKi/ejpn9/153/

Upvotes: 1

Tomasz Radwaski
Tomasz Radwaski

Reputation: 202

I allways used "DOMContentLoaded" event and It worked like a charm.

Please Try:

 element.addEventListener("DOMContentLoaded", function(event) {
    //Element loaded
  });

Upvotes: 0

Related Questions