Support

Account

Home Forums Bug Reports Javascript error when reordering in Post Object Repeater

Helping

Javascript error when reordering in Post Object Repeater

  • We’re seeing a repeated javascript error when we have multiple posts in a Post Object repeater field and a user tries to reposition them by drag and drop. This has been true since at least 5.8.8, but switching to 5.8.12 did not fix it.

    Scenario:
    * ACF Pro Post Object field – https://www.advancedcustomfields.com/resources/post-object/
    * Select Multiple Values: Yes
    * Create an article, add posts to that field, “Update” to save changes
    * Click and drag one post in that field to a different place in the list
    * Javascript error written to console, Update doesn’t save the change

    Mitigations tried and failed:
    * Upgrading to ACF Pro 5.8.12 from 5.8.8
    * Trying with a completely new post
    * Trying in multiple browsers

    Possibly helpful additions:
    * It’s working fine for one of our developers on their local machine, but we can’t figure out why.

    This prevents us from rearranging posts in fields of that type. We can only successfully rearrange by deleting the posts from the field and adding them again in a new order.

    Error in Chrome console (error also confirmed in Firefox):
    acf-input.min.js?ver=5.8.12:4 Uncaught TypeError: Cannot read property ‘element’ of undefined
    at HTMLLIElement.<anonymous> (acf-input.min.js?ver=5.8.12:4)
    at Function.each (load-scripts.php?c=0&load[chunk_0]=jquery-core,jquery-migrate,utils&ver=5.3.2:2)
    at a.fn.init.each (load-scripts.php?c=0&load[chunk_0]=jquery-core,jquery-migrate,utils&ver=5.3.2:2)
    at HTMLUListElement.stop (acf-input.min.js?ver=5.8.12:4)
    at h.<computed>.<computed>._trigger (widget.min.js?ver=1.11.4:11)
    at h.<computed>.<computed>._trigger (sortable.min.js?ver=1.11.4:11)
    at h.<computed>.<computed>.h.isFunction.a.<computed> [as _trigger] (widget.min.js?ver=1.11.4:11)
    at h.<computed>.<computed>._clear (sortable.min.js?ver=1.11.4:11)
    at h.<computed>.<computed>.h.isFunction.a.<computed> [as _clear] (widget.min.js?ver=1.11.4:11)
    at h.<computed>.<computed>._mouseStop (sortable.min.js?ver=1.11.4:11)

    This links to the “.element” part of the following unminified code:
    // multiple
    if( options.multiple ) {

    // vars
    var $ul = $container.find(‘ul’);

    // sortable
    $ul.sortable({
    stop: function( e ) {

    // loop
    $ul.find(‘.select2-selection__choice’).each(function() {

    // vars
    var $option = $( $(this).data(‘data’).element );

    // detach and re-append to end
    $option.detach().appendTo( $select );
    });

    // trigger change on input (JS error if trigger on select)
    $select.trigger(‘change’);
    }
    });

    // on select, move to end
    $select.on(‘select2:select’, this.proxy(function( e ){
    this.getOption( e.params.data.id ).detach().appendTo( this.$el );
    }));
    }

  • I just did a test and did not see any issues.

    I don’t know why you would see this except for one person.

    Possible problems

    1) Plugin/Theme/JavaScript conflict

    2) Corrupt JS file. I mention this because you indicate that the person that can get it to work might be on a different server/installation. I have had issues with large minified JS files being corrupted during FTP, basically the long lines get truncated if transferred in “text” mode. You can do a quick test to see if this might be an issue by turning on SCRIPT_DEBUG https://wordpress.org/support/article/debugging-in-wordpress/#script_debug, this forces loading of unminified scripts in most cases.

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

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.