• Hello Fabrik Community

    Fabrik is now in the hands of the development team that brought you Fabrik for Joomla 4. We have recently transitioned the Fabrik site over to a new server and are busy trying to clean it up. We have upgraded the site to Joomla 4 and are running the latest version of Fabrik 4. We have also upgraded the Xenforo forum software to the latest version. Many of the widgets you might have been used to on the forum are no longer operational, many abandoned by the developers. We hope to bring back some of the important ones as we have time.

    Exciting times to be sure.

    The Fabrik 4.0 Official release is now available. In addition, the Fabrik codebase is now available in a public repository. See the notices about these in the announcements section

    We wish to shout out a very big Thank You to all of you who have made donations. They have really helped. But we can always use more...wink..wink..

    Also a big Thank You to those of you who have been assisting others in the forum. This takes a very big burden off of us as we work on bugs, the website and the future of Fabrik.

Thumbs not working on detail view J!4.4.0 Fabrik 4.0 Zeta

boyjah2

New Member
The thumbs plugin is behaving strangely. In list view we can click the thumb icon and it changes color and adds 1 to the count. But on detail view it displays strangely (there are 2 thumb icons with click count) and cannot be clicked.

This is how it appears when viewing a list and it can be clicked

Screenshot 2023-11-02 at 14.01.10.png


When clicked:

Screenshot 2023-11-02 at 14.01.25.png


However in form detail view, it displays like this and neither item can be clicked, although moving the cursor over the black thumb makes the cursor change to such that it believes that there is a link to click (on my computer cursor goes from being an arrow to a hand with a pointing finger when hovered over the black thumb icon). But clicking does nothing.

Detail form view:

Screenshot 2023-11-02 at 13.58.59.png
 
This is what I get when inspect the element in the developer console. Are these javascript related?

[Log] JQMIGRATE: Migrate is installed with logging active, version 3.3.2 (jquery.migrate.js, line 69)
[Warning] JQMIGRATE: jQuery.fn.mousedown() event shorthand is deprecated (jquery.migrate.js, line 100)
[Log] Trace
migrateWarn (jquery.migrate.js:102)
(anonymous function) (jquery.migrate.js:682)
(anonymous function) (jquery-3.5.1.js:3179)
(anonymous function) (jquery.migrate.js:158)
jQuery (jquery-3.5.1.js:157)
init (jquery.qtip.js:2730)
OVERLAY (jquery.qtip.js:2839)
(anonymous function) (jquery.qtip.js:2841)
(anonymous function) (jquery.qtip.js:30)
(anonymous function) (jquery.qtip.js:32)
Global Code (jquery.qtip.js:3493)
[Warning] JQMIGRATE: jQuery.isArray is deprecated; use Array.isArray (jquery.migrate.js, line 100)
[Log] Trace
migrateWarn (jquery.migrate.js:102)
(anonymous function) (jquery.migrate.js:125)
(anonymous function) (jquery.ui-all.js:78)
(anonymous function) (jquery.fileupload.js:93)
(anonymous function) (jquery.fileupload.js:27)
Global Code (jquery.fileupload.js:29)
[Warning] JQMIGRATE: jQuery.expr[':'] is deprecated; use jQuery.expr.pseudos (jquery.migrate.js, line 100)
[Log] Trace
migrateWarn (jquery.migrate.js:102)
get (jquery.migrate.js:113)
(anonymous function) (jquery.ui-all.js:83)
(anonymous function) (jquery.fileupload.js:93)
(anonymous function) (jquery.fileupload.js:27)
Global Code (jquery.fileupload.js:29)
[Warning] JQMIGRATE: jQuery.isFunction() is deprecated (jquery.migrate.js, line 100)
[Log] Trace
migrateWarn (jquery.migrate.js:102)
(anonymous function) (jquery.migrate.js:125)
(anonymous function) (jquery.ui-all.js:123)
each (jquery-3.5.1.js:387)
(anonymous function) (jquery.ui-all.js:122)
(anonymous function) (jquery.fileupload.js:93)
(anonymous function) (jquery.fileupload.js:27)
Global Code (jquery.fileupload.js:29)
[Warning] JQMIGRATE: jQuery.trim is deprecated; use String.prototype.trim (jquery.migrate.js, line 100)
[Log] Trace
migrateWarn (jquery.migrate.js:102)
(anonymous function) (jquery.migrate.js:125)
(anonymous function) (jquery.cbtabs.js:120)
each (jquery-3.5.1.js:381)
(anonymous function) (jquery.cbtabs.js:69)
each (jquery-3.5.1.js:381)
init (jquery.cbtabs.js:5)
(anonymous function) (jquery.cbtabs.js:594)
(anonymous function) (index.php:157)
mightThrow (jquery-3.5.1.js:3762)
(anonymous function) (jquery-3.5.1.js:3830)
[Error] TypeError: undefined is not an object (evaluating 'document.getElements('input[name=rowid]')[0].value')
(anonymous function) (form.js:897)
forEach
(anonymous function) (mootools-core.js:121)
each (mootools-core.js:193)
(anonymous function) (form.js:893)
(anonymous function) (mootools-core.js:185)
forEach (mootools-more.js:1559)
addElements (form.js:892)
(anonymous function) (mootools-core.js:787)
(anonymous function) (index.php:1311)
execCb (Script Element 1:29:317)
check (Script Element 1:18:430)
(anonymous function) (Script Element 1:23)
(anonymous function) (Script Element 1:8:108)
(anonymous function) (Script Element 1:23:371)
v (Script Element 1:7:175)
emit (Script Element 1:23:342)
check (Script Element 1:19:408)
(anonymous function) (Script Element 1:23)
(anonymous function) (Script Element 1:8:108)
(anonymous function) (Script Element 1:23:371)
v (Script Element 1:7:175)
emit (Script Element 1:23:342)
check (Script Element 1:19:408)
(anonymous function) (Script Element 1:23)
(anonymous function) (Script Element 1:8:108)
(anonymous function) (Script Element 1:23:371)
v (Script Element 1:7:175)
emit (Script Element 1:23:342)
check (Script Element 1:19:408)
enable (Script Element 1:23:244)
init (Script Element 1:17)
E (Script Element 1:14:197)
completeLoad (Script Element 1:28:127)
onScriptLoad (Script Element 1:29:449)
[Warning] JQMIGRATE: jQuery.type is deprecated (jquery.migrate.js, line 100)
[Log] Trace
migrateWarn (jquery.migrate.js:102)
(anonymous function) (jquery.migrate.js:125)
invalidOpt (jquery.qtip.js:311)
sanitizeOptions (jquery.qtip.js:325)
(anonymous function) (jquery.qtip.js:1841)
(anonymous function) (jquery.cbtooltip.js:93)
each (jquery-3.5.1.js:381)
init (jquery.cbtooltip.js:5)
(anonymous function) (jquery.cbtooltip.js:749)
(anonymous function) (index.php:158:354)
> Selected Element
< <span class="thumb-count">62 </span>
 
The Error toward the bottom is likely the cause. Do you have a site link I can get to to see what is going on?
 
It is a development site that requires login to access. Is there some way for me to send you that information by private message?
 
It is a development site that requires login to access. Is there some way for me to send you that information by private message?
Yes, just click on my name over to the left and in the popup there is a start conversation button. Insert the details there.
 
Can you replace plugins\fabrik_element\thumbs\layouts\fabrik-element-thumbs-form.php with
Code:
<?php

defined('JPATH_BASE') or die;

$d = $displayData;
?>

    <div class="btn-group">
        <button <?php echo $d->commentdata;?> data-fabrik-thumb-formid="<?php echo $d->formId;?>"
            data-fabrik-thumb="up" class="btn btn-small thumb-up<?php echo $d->upActiveClass;?>">
            <?php echo FabrikHelperHTML::image('thumbs-up', 'form', $d->tmpl); ?>
        <span class="thumb-count"><?php echo $d->countUp;?>
        </span>
        </button>
        <?php
        if ($d->showDown) :
            ?>
            <button <?php echo $d->commentdata;?> data-fabrik-thumb-formid="<?php echo $d->formId;?>"
                data-fabrik-thumb="down" class="btn btn-small thumb-down<?php echo $d->downActiveClass;?>">
                <?php echo FabrikHelperHTML::image('thumbs-down', 'form', $d->tmpl); ?>
                <span class="thumb-count"><?php echo $d->countDown;?></span>
            </button>
        <?php
        endif;
        ?>

    </div>


<input type="hidden" name="<?php echo $d->name;?>"
    id="<?php echo $d->id;?>" value="<?php echo $d->countDiff;?>"
    class="<?php echo $d->id;?>" />
 
Thank you for your advice. The code you provided made the strange green thumb go away, but the remaining black thumb is still not clickable. Console error info:

[Error] TypeError: undefined is not an object (evaluating 'document.getElements("input[name=rowid]")[0].value')
(anonymous function) (form.js:3:13492)
forEach
(anonymous function) (mootools-core.js:3:2514)
each (mootools-core.js:3:4435)
(anonymous function) (form.js:3:13357)
(anonymous function) (mootools-core.js:3:4244)
forEach (mootools-more.js:3:24370)
addElements (form.js:3:13336)
(anonymous function) (mootools-core.js:3:17373)
(anonymous function) (index.php:1236)
execCb (Script Element 1:29:317)
check (Script Element 1:18:430)
(anonymous function) (Script Element 1:23)
(anonymous function) (Script Element 1:8:108)
(anonymous function) (Script Element 1:23:371)
v (Script Element 1:7:175)
emit (Script Element 1:23:342)
check (Script Element 1:19:408)
(anonymous function) (Script Element 1:23)
(anonymous function) (Script Element 1:8:108)
(anonymous function) (Script Element 1:23:371)
v (Script Element 1:7:175)
emit (Script Element 1:23:342)
check (Script Element 1:19:408)
(anonymous function) (Script Element 1:23)
(anonymous function) (Script Element 1:8:108)
(anonymous function) (Script Element 1:23:371)
v (Script Element 1:7:175)
emit (Script Element 1:23:342)
check (Script Element 1:19:408)
enable (Script Element 1:23:244)
init (Script Element 1:17)
E (Script Element 1:14:197)
completeLoad (Script Element 1:28:127)
onScriptLoad (Script Element 1:29:449)

Selected Element
<button data-fabrik-thumb-rowid="8" data-fabrik-thumb-formid="6" data-fabrik-thumb="up" class="btn btn-small thumb-up">
<span data-isicon="true" class="fa icon-thumbs-up">…</span>
<span class="thumb-count">80 </span>
</button>
 
It's working on my site.
Did you clear J! and browser cache?
Is the thumbs element editable for the user?

I don't think the JS error is related to the thumbs element. I can see it if there's a repeat group but it doesn't stop the thumbs element.
 
I clear J! and browser cache basically every time before I load a page on the dev site. And I'm not sure what it means regarding thumbs element editable for user. Is that a setting somewhere?
 
Editable: Element Access settings "Form(edit)"
Which stopps the thumb in form and details view (creating an alert message on click) but seems to be ignored in list view.
 
Form (add), Form (edit), Details view and List view are all set with the user group that can use the Thumbs element. It all works fine on our live site running Joomla 3.10/Fabrik 3.10

For the Thumbs element we also have Details/Thumbs Options/Rate in form set to Yes

I also notice that, even though we have Publishing/Tips/Show tips in detail view and Show tips in list view both set to Yes, it only works for list view. On the Detail view (where we cannot click the thumb) no tips show when hovering the cursor over the thumb icon
 
Last edited:
On the Detail view (where we cannot click the thumb) no tips show when hovering the cursor over the thumb icon
These issues may be related - but all is working fine on my site...

Do you have the standard Fabrik details template or any customizsation?
Which J! template?
Can you try without tip?
 
We still can't get thumbs to work in detail view.

Clicking the icon for a list item opens the detail view in a default Fabrik page. Example:

index.php?option=com_fabrik&view=details&formid=6&rowid=33&Itemid=643&lang=en

We are using the default J4 template Cassiopeia with no modifications.

Removing the tip text and setting Show tips in detail view and Show tips in list view are both set to No
 
I figured out what the problem is. Our website is multi language (English and Japanese). When we added the Thumbs element to the form, Fabrik automatically created one for each language. One is the Parent and one is the Child element. As an experiment I tried moving the element to a different group in the form (different groups on the form for each language). In order to do that I needed to unlink the parent-child elements, in order to move it to the appropriate group for the language. After unlinking them, I am now able to click the thumb in detail view as well. However, now that they are unlinked, an item that I clicked the thumb on in the English list does not show as clicked in the Japanese list. The list is generated from the same database table for both languages. If I relink the parent and child, it properly shows items with clicked thumbs in both language versions of the list, AND the thumb is now clickable on the English version of detail view (English is the parent element) BUT no longer clickable in detail view on the Japanese detail view. So it seems that the parent-child relationship is causing the unclickable thumb problem in detail view.

As I said previously, this does not happen with our live site running Joomla! 3.10.12 and Fabrik 3.10
 
Last edited:
More info: Thinking that maybe the parent-child id relationship was the issue, as a test I switched parent_id in the elements table. I made Japanese the parent element and English the child element. But the thumb is still clickable in English detail view but NOT clickable in Japanese detail view. So now it seems like maybe it is something to do with Japanese language messing up the Thumbs plugin?
 
Can you inspect the HTML for the Japanese Thumb and post it here. There may be something in the language encoding that is breaking the html for the button.
 
This is the HTML inspection for the Japanese Thumb:
 

Attachments

  • InspectElement-Japanese.txt
    103.8 KB · Views: 27
We are in need of some funding.
More details.

Thank you.

Members online

No members online now.
Back
Top