jQWidgets Forums

jQuery UI Widgets Forums Grid setcellvalue after the gris is rendered

This topic contains 13 replies, has 2 voices, and was last updated by  jccompagnon 10 years, 2 months ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author

  • jccompagnon
    Participant

    Hi,
    So I am trying to have some data “Loaded” in the grid after the grid has been rendered

    I use setcellvalue and render a cell.

    However I am having a hard time doing it after the grid is Displayed.
    I tried to add my setcellvalue in the the ready: function() {
    call back BUT it seems to then wait till it has done all till it displays the grid.

    To be clear I want to Display the grid.
    Then after it has been displayed I want to modify some cells values with setcellvalue

    where should I put my code ?


    Peter Stoev
    Keymaster

    Hi jccompagnon,

    “ready” function is called when the Grid is Ready for usage. Within that function, you should call your “setcellvalue” method call or any other method call.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    jccompagnon
    Participant

    Hi Peter,
    Looks good on paper but in practice not for me:
    https://youtu.be/fpw4BXiWf7U

    in the video you can see the grid loads almost instantly. Then the Loading Gif stops to spin.
    This is when we load the extra data via Ready as bellow.

    ready: function() {
    var data = $(‘#jqxgrid’).jqxGrid(‘getrows’);
    for (var i = 0; i < data.length; i++) {
    expandData.push(false);
    var Row = data[i];
    // ——————————————-
    // let’s load extra data
    // ——————————————-
    $.ajax({
    url: “/inventory/dowehavethebuyboxajax”,
    type: “POST”,
    cache: false,
    async: false,
    data: Row,
    success: function(response) {
    if(response==1) {
    $(“#jqxgrid”).jqxGrid(‘setcellvalue’, i, “dowehavebuybox”, ““);
    } else {
    $(“#jqxgrid”).jqxGrid(‘setcellvalue’, i, “dowehavebuybox”, “”);
    }
    },
    });
    }
    ….

    So the problem is that the grid is not being rendered when ready
    It should load the grid that has another loading gif in the cell and as the cell data is pulled via ajax it should then load and replace the cells as the data comes


    Peter Stoev
    Keymaster

    Hi jccompagnon,

    The Grid IS rendered on “ready”. You should use “setcellvalue” there. If you wish, use my advice.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    jccompagnon
    Participant

    did you look at my post peter?
    I am using “setcellvalue” in “ready”
    have you looked at the video

    the grid is NOT rendering on ready

    I did put setcellvalue in the ready function.
    Do you even read these post or replies we post ?


    jccompagnon
    Participant

    for note. it is rendering fine on Firefox.
    Not on chrome
    Not in IE


    jccompagnon
    Participant

    and one more to add while I am at it.
    In virtual mode (we are using virtual mode)
    Ready is not triggered again on datasource update.
    For example when you go to next page in virtual mode. Ready is not triggered a 2nd time


    Peter Stoev
    Keymaster

    Hi jccompagnon,

    You use “virtual mode”. Next time, I suggest you to start with that and to provide Examples – jsfiddle.net, pastebind, something like that. “setcellvalue” wlll have absolutely no effect in virtual mode due to the reason that your Data is Loaded on Demand and Data displayed in jqxGrid is returned by You within the “rendergridrows”. So “setcellvalue” is invoked, but it has No Effect. I ready your posts and I suggest you to read mine, too. “ready” is not supposed to be triggered on “Data source” update or some other Change. “ready” is triggered When the Grid is ready for usage.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    jccompagnon
    Participant

    ok so where do I put setCellValue for it to work in virtual mode ?

    Also the fact that it is in virtual mode does not explain the browser not rendering of the grid in chrome and IE

    Also the setcellvalue is indeed working fine on the first loaded page

    I have added a wait of 0.3 second and that forces the grid to then render (see bellow).
    have you watched the video I posted above to see the behavior?

    What is upsetting is that I feel being completely being dismissed by support here.
    We come here for help. not to get smart comments.
    I took the time to make a video to show the problem. I took the time to post code.
    and you give me a 1 line answer without even addressing why there is this lag in loading the grid on the video.
    Then you tell me that in Virtual Mode it will not work with ready. great but you of course do not tell me where I then have to put it for it to work.
    I am asking you how to make it work and what I get from you is the way I did it will not work….. I know that. Guess what. That’s why I am here asking for help.
    Have you watched the video?
    Can we get more than a 1 line answer dismissing me?

    ready: function() {
    setTimeout(function () {
    var data = $(‘#jqxgrid’).jqxGrid(‘getrows’);
    for (var i = 0; i < data.length; i++) {
    expandData.push(false);
    var Row = data[i];
    // ——————————————-
    // let’s load extra data
    // ——————————————-
    $.ajax({
    url: “/inventory/dowehavethebuyboxajax”,
    type: “POST”,
    cache: false,
    async: false,
    data: Row,
    success: function(response) {
    if(response==1) {
    $(“#jqxgrid”).jqxGrid(‘setcellvalue’, i, “dowehavebuybox”, ““);
    } else {
    $(“#jqxgrid”).jqxGrid(‘setcellvalue’, i, “dowehavebuybox”, “”);
    }
    },
    });
    }
    }, 300);


    Peter Stoev
    Keymaster

    Hi jccompagnon,

    I watched your Video. The explanations by now and posted code by you are not helpful. That is something usual in your other Forum topics, too. You know what your problem is, but in order to help someone else to understand it, I suggest you to send a jsfiddle.net sample and provide as much details as possible. In addition, this is Community Forum so expect answers only from other Forum members only. We watch the Forum and we try to help. Sorry, if my answers are not helpful for you. I really do not understand why you put Timeouts or Ajax calls within “ready”. Seems like some Hack to me. Example with Virtual mode and “setcellvalue” – http://jsfiddle.net/oxg0ux0m/. The example illustrates that “setcellvalue” is called successfully in a Grid with Virtual Mode turned On and it shows that the method works fine within “ready” callback function. The method however will have effect only until the Page is not changed and that is because Data in Virtual Mode is loaded on Demand and you should synchronize such Editing – either through API or through Editors with your Data Source – in this case Local data.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    jccompagnon
    Participant

    here
    run this in chrome

    http://jsfiddle.net/4zxm5fv3/

    the grid does not display till the large loop (simulating a long running call)
    this is a long running script on purpose to simulate or problem

    We need to
    – 1 completely display the grid
    – 2 after the very long loop (simulating a long running call) update the cellValue


    Peter Stoev
    Keymaster

    Hi jccompagnon,

    UI Thread is blocked by Long Running Script. It’s not possible the Grid or something else to be displayed while you have something which Blocks the UI. Make that long-running Script to be not so long running Scipt i.e if you use AJAX, use AJAX without setting async: false. For last time, “ready” is called when the Grid is ready for usage and it’s safe to call Methods and Set properties within Ready. Otherwise, Grid will throw Exception.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    jccompagnon
    Participant

    there see we are getting somewhere with AJAX. The problem is that I need to do the setCellValue AFTER the long script or AJAX has ran.
    So I can’t do it inside ready:
    OR I have to leave the long running script inside ready:

    If I put the long running script in an AJAX somewhere in ASINC true I also have to put the setCellValue there
    so yes ready is safe. let’s say it hard and loud. ready is safe.
    However per the long running script I cannot put it in ready so where can I put it as well ?

    When we use virtual mode and there is a sort, then a call back is triggered.

    What callback is triggered when a page button is called ?


    jccompagnon
    Participant

    alright so after more research on this.
    In virtual mode.
    It seems that
    rendered: callback seems to be called when the grid is rendered by first call, sort, filter so it works great to trigger my long running script there

    however it still does not work when the grid next and previous page are clicked.

    Is there a call back for when these are clicked ?
    In virtual mode it reloads the datasource ? Is there a call back there that can be used ?

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

You must be logged in to reply to this topic.