SOLVED: Refresh Rows question

[PaulV888]

Hi,

I used to be possible to refresh you ajax rows on a timer basis, I have a couple of lists on my dash-board which i refresh automatically with code like:

<script type="text/javascript">
function updateList_list_212() {
    if (Fabrik.getBlock('list_212')) {
        if ($('autorefresh').hasClass('active')) Fabrik.getBlock('list_212').updateRows();;
    }
}
window.setInterval(function(){
  updateList_list_212();
}, 10000);
</script>

However with the new JQuery list.js this does not work anymore after 1 refresh (It does work properly on initial load). I am getting
"Sorry this form is not published"

My /Element/List View Settings/Custom Link links look something like this:
/index.php?option=com_fabrik&view=form&Itemid=138&formid=15&listid=15&rowid={ha_vw_monitor_current_status___deviceID_raw}&tmpl=component&ajax=1

Question: Is there another supported way to do an automatic ajax update?

If not, I did find a way to hack list.js to make if work and can submit.

Thanks,
Paul

 

[cheesegrits]

Works OK for me with multiple updates.

Put a breakpoint in updateRows in list.js, somewhere around line 1106, and see if the URL we're generating for the AJAX call changes for some reason.

-- hugh

 

[PaulV888]

Hi Hugh,

Thanks for looking at this. I assume you cannot reproduce because you do not have a custom link set on the element itself? It seems to work fine without. I am trying to link back to different forms.

My /Element/List View Settings/Custom Link links look something like this:
/index.php?option=com_fabrik&view=form&Itemid=138&formid=15&listid=15&rowid={ha_vw_monitor_current_status___deviceID_raw}&tmpl=component&ajax=1

I believe the issue lies in line 1316.

                            // handle our view/edit links with data-rowid
                            href = jQuery(val).prop('href');

Here we try to restore the links for the view/edit links, however this line code is loading the default view/edit link and thus resetting the custom element's link as well.

It looks to me that the above line (or that whole block) in not necessary anymore? Anyway if I comment this line out all seems to be working fine for me.

Regards,
Paul

 

[cheesegrits]

Oh, right, I thought you meant the refresh of the list itself didn't work.

Rather than commenting out that JS line (which is needed in other cases), can you try editing ./components/com_fabrik/models/element.php, around line 2429 ...

            if (trim($customLink) !== '')
            {
                $v = '<a href="' . $customLink . '">' . $v . '</a>';
            }

... modify that to add a data-iscustom ...

            if (trim($customLink) !== '')
            {
                $v = '<a href="' . $customLink . '" data-iscustom="1">' . $v . '</a>';
            }

That should prevent the code you found in the JS from messing with the link. So uncomment that JS line, try the above change, and let me know.

-- hugh

 

[PaulV888]

I tried that, I did get the data-iscustom="1" attribute, but that did not resolve it. Looking further on what is going here, this what I thinks goes wrong.

            injectItemData: function (template, row) {
1307                var r, cell, c, j;
1308                jQuery.each(row.data, function (key, val) {
1309                    cell = template.find('.' + key);
1310                    if (cell.prop('tagName') !== 'A') {
1311                        cell.html(val);
1312                    } else {
1313                        var href;
1314                        try {
1315                            // handle our view/edit links with data-rowid
1316                            href = jQuery(val).prop('href');
1317                            var rowid = jQuery(val).data('rowid');
1317                            cell.prop('href', href);
1318                            cell.data('rowid', rowid);
1319                        }

1308 -> Row data is being process, and finds keys fabrik_view (of fabrik_edit)

__pk_val    "286"
fabrik_actions    "<div class="btn-group">\r...View</span></a></div>\r\n"
fabrik_edit    ""
fabrik_edit_url    "/index.php/test1/form/200/286"
fabrik_select    ""
fabrik_view    "<a data-loadmethod="xhr"...hidden">View</span></a>"
fabrik_view_url    "/index.php/test1/details/200/286"
ha_vw_monitor_current_status___cnow_raw    "2016-10-27 23:22:58"

1309 -> Find on class ".fabrik_view" finds all template cells with this class, i.e. every custom link, including the detail button.
1317 -> When updating the cell.prop then all cells in the found collection are updated, including the custom links.

I tried to build upon your suggestion with the data-iscustom="1", and updated line 1309 to:

                    cell = template.find('.' + key + ':not([data-iscustom="1"])')

However, I think we set data-iscustom="1" as well for "Custom Detail/Edit URLs" on a list.

So not sure how to properly fix this and open to suggestions. What is the case that we actually need to rebuild the href? I cannot find a scenario that would go wrong without line 1316.

Thanks
Paul

 

[cheesegrits]

What is the case that we actually need to rebuild the href? I cannot find a scenario that would go wrong without line 1316.

Well, AJAX updating. We're building each row from a "template" of the row (which is usually a copy of the first row that was loaded on this page, unless no rows in which case we have an empty one tucked away). We take the JSON row data returned by updateRow(), then run that through injectItemData(), which takes the JSON data for each column and injects it into the corresponding row cells in the template. And we have to handle our edit/view links slightly differently, as we use a 'data' attribute for data-rowid, and you can't set data attributes by just pushing HTML into a DOM element, you have to specifically call the data('foo', 'bar') function.

So if you don't do that step, all the regular (non custom) edit and view links in the AJAX updated rows would be the same - whatever the row template happens to be set to. The links would appear to have changed if you inspected the DOM, but internally the data attributes wouldn't have been changed, and our JS uses those for things like plugin handling.

Setting iscustom should bypass us doing that to links, and I just noticed why yours isn't. You have out of date JS. That code now reads:

                            href = jQuery(val).prop('href');
                            var rowid = jQuery(val).data('rowid');
                            // need to only do this for our links, not custom detail links
                            jQuery.each(cell, function (thisKey, thisCell) {
                                if (jQuery(thisCell).data('iscustom') === 0) {
                                    jQuery(thisCell).prop('href', href);
                                    jQuery(thisCell).data('rowid', rowid);
                                }
                            });

I added that iscustom attribute for this exact scenario, except I only added it in the List custom links, I forgot to add it in the element custom links.

So do a github update.

I'll add that edit to the element.php now, so that change gets picked up when you do the update.

-- hugh

 

[cheesegrits]

OK, I committed that element model change ...

https://github.com/Fabrik/fabrik/commit/a321889ce802e4ad5d616a7d44f93dba5e2cb111

-- hugh

 

[PaulV888]

Perfect, great!!! I updated from github and all looks happy

Sorry for not immediately jumping on Github.

Many thanks,
Paul

 

[cheesegrits]

Not a problem. Wouldn't have worked anyway, as I didn't have that iscustom added to the individual element custom links.

-- hugh