render event

[joge123Participant]

i need to do some adjustments of the rendered dom elements of the grid.
The goal is to adjust the height of some rendered elements for each grid line.

What I do is to catch the bindingcomplete event and query for the elements and changing the height. That’s working fine.

    $newsList.on('bindingcomplete', function() {
      // correct the height of vertical text
      $newsList.find('.col-module .vertical').each(function() {
        var h = $(this).parent().height();
        if (h > 60) {
          $(this).css({height: h+'px', marginTop: h+'px'});
        }
      });
    });

BUT, as soon as I open a jqx window or some other stuff, it seems that the grid gets re-rendered, because the elements will loose the height.
So I need to listen for some event that is fired after each rendering.

[HristoParticipant]

Hello joge123,

Could you provide us one example (in https://www.jseditor.io/ or http://jsfiddle.net/) for better analyze.
If I understand right this example here in API Documentation could help. If you would like to use renderer on property columns in Grid.
Please take a look this example could be helpful.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[joge123Participant]

Hi you can test it here:

http://jsfiddle.net/t0mmzegu/

When you RUN this fiddle, then you see the red div fits to the cell’s height. When you then click on the Popup Button, a jqx popup shows and the red div will loose the correct height.
I need to catch this event when the div is re-rendered, so i can adjust the height again.

[HristoParticipant]

Hello joge123,

You could use only cellclassname: 'vertical', to set class on a concrete cell. In this case set desired options on this class.
And could remove ‘cellsrenderer’. In the example are set one class with empty value and cannot be fit to ‘parent’ without dimensions.
If you need to make some settings after edit cell could use cellendedit. This event is triggered when a cell’s edit operation has ended.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[joge123Participant]

Hi Hristo

no I cannot use the class vertical to the celclassname. The fiddle is just a stripped example. In fact I need to do the manipulation after the grid is rendered, there’s no way around.

So how can I catch this rendered event? As you see, after opening the jqxWindow, the grid is re-rendered and so the dimension of my div is lost.

I don’t understand what you mean with cellendedit. I’m not editing a cell. The problem comes when you open the jqxWindow.

[HristoParticipant]

Hello joge123,

Please take a look this example: http://jsfiddle.net/hristoxux/911cg0ht/
Another options is rendered property in Grid.
For more information please look at:
http://www.jqwidgets.com/community/topic/event-that-fires-after-grid-re-render/#post-27726
If this do not help could provide us more detailed information for the goal.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[joge123Participant]

ok that’s not the point why the styles getting lost when opening the window, but i found a way to archive my goal with pure css3. thanks

[Author]

Posts