Error code with Appointment +, I keep receiving Uncaught TypeError: Object [object Object] has no me

Uncaught TypeError: Object [object Object] has no method 'tablesorter'

That is the error code I receive. I cannot see the appointment times, and as per the FAQ section, I deactivated all plugins, switch to the default theme, and still once I activated the appointment + plugin, I got that error.

Maybe I am not doing something in the settings correctly...not sure.

  • Imperative Ideas
    • HummingBird

    Evening Ez,

    This is the message you get when there is a jQuery conflict. Do you see jquery.js or jquery.min.js listed twice in your source?

    I found I had to reduce jQuery to the Wordpress standard (1.8.3) version in order to eliminate a conflict with Appointments+, although Vlad swore that shouldn't make a difference.

    Most likely you have jQuery called twice and you will have to figure out which plugin is bundling in its own copy (it's a major problem among developers).

  • ez123abc
    • Design Lord, Child of Thor

    I am still working on this...I found an article here https://premium.wpmudev.org/blog/build-an-amazing-appointments-website/

    And I had not added services or the provider of the appointment. I am working on that now to see if that is what was needed, I am not sure though.

    As I mentioned, I had removed all plugins and left appointments on and was still getting the error. After I set this first page, I have not seen the error, but I am still working on it as I follow the tutorial on the page above...

    It does state in the FAQ about the jQuery conflicts and I did do what it told me to do, but it kept giving me the same error, so now I am adding the pages as per the tutorials, and we will see what happend :stuck_out_tongue:

    Thank you for your reply Imperative :slight_smile:

  • pxwm
    • WP Core Meltdown

    Hi,

    Normally you can check the jquery version your website is using by:-

    1. Open your website in firefox
    2. Then press the ctlr key and U key together and this will open up a coding window
    3. Once the coding window is open press the ctlr key and F key together and this should open a 'Find' search field in the bottom left of your browser
    4. Once open type in jquery in the search field and this should find the line of code with jquery and in the line you should be able view the version running on your website.

    Hope this helps

    Regards
    SteveB

  • ez123abc
    • Design Lord, Child of Thor

    The jquery I see is ver 1.8.3, At least that is the closest version of jquery i see that is close to the appointments plugin. I see other jquery versions for other plugins. But as I have mentioned before, I had deactivated the other plugins before.

  • ez123abc
    • Design Lord, Child of Thor

    the plugins seems to be working now, although I am still figuring things out with the time issue I believe.

    I created a page and placed in shortcodes that seems to work.

    The generated page that I let the plugin create does not work though. On the time blocks to allow someone to select a time, on the generated page does not work.

    It works on the page I created with the plugins. Strange....

  • Imperative Ideas
    • HummingBird

    Now that you have it working, you can actually do some pretty interesting stuff by creating a page called "page-make-an-appointment.php" in your theme root.

    You need to have at least one shortcode in the editor so that all of the footer scripts are properly placed but once that is done, the rest can be inserted with <?php do_shortcode echos.

    So your editor text would look like this:

    [app_my_appointments]
    
    While we are always pleased to have walk-in traffic, many of our customers prefer the kind of dedicated service provided by a private appointment. Should this be your preference, please use the following form to begin the booking process.

    While your page template would include a couple of columns instead of just the one editable area:

    <article class="introduction row">
                        <div class="large-3 columns">
                            <?php echo do_shortcode('[app_services]'); ?>
                            <?php echo do_shortcode('[app_service_providers]'); ?>
                        </div>
                        <div class="large-9 small-12 columns">
                            <?php reactor_inner_content_before(); ?>
    
                            <?php /* get the page loop
                            only works when posts page is set in the reading settings */
                            get_template_part('loops/loop', 'page'); ?>
    
                            <h3>Available Times:</h3>
                            <?php echo do_shortcode('[app_monthly_schedule]') ?>
                            <?php echo do_shortcode('[app_monthly_schedule add="1"]') ?>
                            <?php echo do_shortcode('[app_login]'); ?>
                            <?php echo do_shortcode('[app_confirmation]'); ?>
                            <?php echo do_shortcode('[app_paypal]'); ?>
    
                            <?php reactor_inner_content_after(); ?>
                        </div>
                    </article>

    I then added a bit of style to the form elements using jQuery

    <script type="text/javascript">
            getbuttons = jQuery('button, input:button');
            jQuery(function() { //document ready
                if (!getbuttons.hasClass('button')) {
                    getbuttons.addClass('button small');
                }
                jQuery('select').addClass('darken');
            });
        </script>

    And the result looks like the screenshot that is attached.

    Have some fun with it :slight_smile:

  • ez123abc
    • Design Lord, Child of Thor

    That looks great!!! Thank you Imperative....for you time and your help.

    Would like to be able to change the text on the [app_my_appointments] shortcode.

    Instead of having the text: "My Appointments" to someone other text. Something to like Scheduled Parties, because these will be private parties. If not, it's not a big deal, now that it's working, it's what matters.

    I will start with that page right now... thank you.

  • ez123abc
    • Design Lord, Child of Thor

    Thanks Imperative....

    I have been looking into something, but not really sure. So perhaps you can recommend one for me.

    See, I went to that site, but well, it's foreign to me. The instructions before were simple enough, not only did you tell me where to add the code, but you gave me the code.

    I do not know code, which book or product do you recommend in learning it, simple so that the average can start learning...

  • Imperative Ideas
    • HummingBird

    First off, you seem like a smart guy. Check out this link:
    https://tutsplus.com/course/30-days-to-learn-jquery/

    You'll understand what I did by the time you get to lesson #8.

    This should work as long as it's at the bottom of the page:

    <script type="text/javascript">
        (function(){
            jQuery('.appointments-my-appointments h3').each(function() {
                var text = jQuery(this).text().replace('My Appointments', 'Scheduled Parties');
                jQuery(this).text(text);
            });
        })();
    </script>

    Put it in page-make-an-appointment.php just above <?php get_footer() ?> and NOT in footer.php. No need to clutter up the global variables with this one.

    In short what it does is:

    Open script tag
    Self-calling anonymous function (aka. document ready function)
    Look in .appointments-my-appointments h3 and run the following function
    Find text "My Appointments" and replace with "Scheduled Parties"
    ...closing tags...

    Tested this and it does work as expected.

    --

    Actually, let's clean that up a bit.

    <script type="text/javascript">
            appointment = jQuery('.appointments-my-appointments h3');
            (function(){
                appointment.each(function() {
                    var text = jQuery(this).text().replace('My Appointments', 'Scheduled Parties');
                    jQuery(this).text(text);
                });
                appointment.addClass('partyhead');
            })();
        </script>

    1. Declare a variable to grab the h3
    2. Replace the text
    3. Give the H3 a class of .partyhead so that you can target it with a CSS style

    From here you should now know enough to grab the other H3s if you need to. You won't do it efficiently but if you can figure out how to do it, you will have learned an important trick today.

  • ez123abc
    • Design Lord, Child of Thor

    Thank you very much Imperative. I will go through it, I know i need to learn it, and that's why I asked for stuff you were familiar with.

    I have been going through amazon and looking around, and some sound good, some better than others, but not really sure, so it's best to ask someone who knows and listen to their recommendations...

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.