0

I have a site we needed some custom php coding to connect to an external database to grab product review urls for several vendors that sell our products. The basic idea we are trying to accomplish is to have the user register their product and then extend their warranty if they are willing to leave a review. I'm using xyzscripts.com's "Insert PHP" plugin to accomplish this. The theme initially had only jQuery loaded so as to keep from creating a child theme we are loading jQueryUI in the php script. So we have jQuery loaded in the header and jQueryUI loaded in the body of the document. Im not quite sure if this is being caused because of the order the scripts are being loaded or if some other conflicting javascript is causing the error. You can see the error in the image below.

Chrome's Console Output On Calling The Dialog

Console Error

Relevant Code

<script>
jQuery.ajax({
    type: 'GET',
    url: "<?=$ajax_handler?>?method=check_warranty&model="+model,
    success: function(response) {
        if (response == '')
            duration = '6';
        else
            duration = response;

        jQuery('#warranty_length').val(duration);

        jQuery('#warranty_dialog').dialog({
            width:'700px',
            height:'408px',
            position:'absolute',
            top:'300px'
        }).html("HTML TO DISPLAY REVIEW LINK BUTTON");
        jQuery('.titlebar-close').hide();
    }
});
</script>

As you can see the code is pretty straightforward. After the user fills out the form I make an ajax call that queries our database with the Model and Vendor to get the appropriate review link for that product and then creates a link to the review page for that Vendor and Model.

I'm trying to determine if the error is being caused by one of three things.

  1. There is an issue with the order jQuery & jQueryUI are being loaded.
  2. There is an issue with my code (I have successfully used this script on some of our other sites).
  3. If there's possibly other javascript in the theme that is conflicting with my script.

I can provide any other relevant code you need on the php script if necessary. The url to page is:

http://www.kriegermfg.com/register-test/

Any help will be greatly appreciated.

Edit Just to give some further context this is jQueryUI is failing.

enter image description here

0

Your JS looks to be written inline vs. in its own JS file or at least enqueued on its own. In other words, it doesn't look like its being loaded properly re WordPress.

Note the WP function wp_enqueue_script() has a dependency parameter where you can pass an array of script handles (as registered via wp_register_script()). The parameters of this function helps you ensure that you load header + footer scripts in the desired location (header vs. footer) and desired order.

Docs:

https://developer.wordpress.org/reference/functions/wp_enqueue_script/ https://developer.wordpress.org/reference/functions/wp_register_script/

In the JS itself, make use of $( document ).ready():

http://learn.jquery.com/using-jquery-core/document-ready/

Your code is sitting in the markup before JQuery UI is loaded, which is a potential issue right there to resolve. If it was in its own file and properly enqueued in your theme's functions.php (or by a site plugin) then it could specify JQuery UI's handle as a dependency and WordPress will always load it after.

If you still have issues I would also disable your other plugins + any other bits of JS you've tossed in there (temporarily) to see if you can get this to work. If so, you could re-enable them one-by-one to identify the culprit.

It also looks like both Contact Form 7 and your theme/plugins are loading JQuery UI, and both depend on date pickers, etc. Contact Form 7's core is loading before the JQuery UI (and loading its other JQuery UI dependencies after) but I don't have enough experience with that plugin to know off-hand if that is a potential source of issues (it might also be something to look into).

  • I only gave the relevant portion of the jQuery, it actually is wrapped in a doc ready block. Unfortunately using wp_enqueue_script is not an option with this site. Thanks for the reply. The thing that is getting me is the php that is generating this javascript has already been implemented on other sites so I know it's being loaded by WP properly. I'm starting to believe some other javascript in the theme this site uses is causing some conflict. – GideonBright Nov 13 '18 at 19:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.