Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I am trying to create this plugin for my site that will allow create short codes to pull data from the iTunes Search SDK. I already have the iTunes Search SDK javascript plugin working that pulls the data from the search SDK but I am running into an issue with placing the required javascript into the shortcode.

The code I have looks like this:

<?php
add_action('init', 'peb_init');

function peb_init() {
    add_action('admin_head', 'peb_admin_head');
}

function peb_admin_head() {
    echo '<script type="text/javascript">';
    require_once('https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.js');
    require_once('js.php');
    echo '</script>';
}


add_filter('widget_text', 'do_shortcode');

add_shortcode('appPrice', 'appPrice');
function appPrice($atts) 
{
    $atts = shortcode_atts(
        array(
            'id' => '',
            'class' => '',
            'container' => ''
    ), $atts);
    return '

    <script type="text/javascript">
    $(document).ready(function() {
        var url = 'iLookup.php';

            query = $id;

            $.getJSON(url, {id:query}, function(json) {
            $('#results').html('Price: '+json.results[0].price+'<br/>');
            });

    });
</script>

    ';


}

If anyone has any ideas as to why this doesn't work I would be very appreciative. If there is not enough info given I will be glad to provide more.

NOTE: There is no error message it just doesn't work. I have tried using the console log and it still doesn't work. The rest of the plugin works fine with the exception of the script.

share|improve this question
    
What's the error you're getting? –  wyrfel Feb 21 '11 at 1:27
    
An error message doesn't show up, nothing happens though even when I use a console log. –  Logan Feb 21 '11 at 2:34
    
Last i checked there were compatability problems with jQuery 1.5 in WP, have you tried just running the code minus the jQuery include(the admin pages include jQuery already which may also be causing a conflict to). –  t31os Feb 21 '11 at 7:54
    
Yes, the code does nothing even without the jQuery. –  Logan Feb 21 '11 at 14:06
add comment

4 Answers

jQuery is running in compatibility mode in WP. Instead of …

$(document).ready(function() {}

… use …

jQuery(document).ready(function($) {}
share|improve this answer
    
Thanks I'll give it a try. I haven't used wordpress in a while and i'm trying to regain my footing but its hard sometimes. –  Logan Feb 21 '11 at 14:02
add comment

I'm guessing it's because you didn't escape the single quotes. Try using output buffering, the code is more readable:

function appPrice($atts) 
{
    extract(shortcode_atts(
        array(
            'id' => '',
            'class' => '',
            'container' => ''
    ), $atts));
    ob_start();
    ?>

    <script type="text/javascript">
    $(document).ready(function() {
        var url = 'iLookup.php';

            query = <?php echo $id; ?>;

            $.getJSON(url, {id:query}, function(json) {
            $('#results').html('Price: '+json.results[0].price+'<br/>');
            });

    });
</script>

    <?php
    return ob_get_clean();
}

also the way you're loading jquery is weird. why not:

 wp_deregister_script('jquery');
 wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"), false, '1.5.0');
 wp_enqueue_script('jquery');

?

share|improve this answer
    
This fixes some of the issues, though the main issue here is that it doesn't update the $id shortcode attribute in the script, it remains as $id and not the value I place in the shortcode. –  Logan Feb 21 '11 at 15:50
    
that's because you're not passing the $id php variable, you're creating a new one in javascript. Anyway, I've updated the code above, it should make it work now –  onetrickpony Feb 21 '11 at 17:54
    
Loading jquery 1.5 that way will break your site. Both because of incompatibilities in 1.5 and the lack of loading it in noConflict mode. –  Otto Feb 21 '11 at 20:11
    
not true, I'm running wp 3.1 with google's jquery without any problems... –  onetrickpony Feb 23 '11 at 22:43
add comment

There's several major things wrong here.

1 - jquery 1.5.0 is incompatible with previous versions. Therefore it's not making it into WordPress 3.1 at present. You should stick with 1.4.2, which is what comes with WordPress.

2 - Loading scripts into the page that way is simply incorrect and weird. Try this instead:

add_action('admin_enqueue_scripts', 'peb_enqueue'); 
function peb_enqueue() {
    wp_enqueue_script('jquery'); 
}

add_action('admin_head', 'peb_admin_head'); 
function peb_admin_head() {
    echo '<script type="text/javascript">';
    require_once('js.php');
    echo '</script>'; 
}

3 - All your jquery code needs to use "jQuery" instead of "$". Or, you need to use this bit of code:

jQuery(document).ready(function($) {
    // $() will work as an alias for jQuery() inside of this function
});

4 - Including PHP variables inside strings in PHP need to use double-quotes. Single-quoted strings do not get evaluated.

5 - Your basic JSON call is flawed, because you're calling just "iLookup.php". You have no idea what the URL is, so you can't use a simple relative URL. The URL could be example.com or example.com/blog/2010/single-post-name. Where is this iLookup.php file actually located?

6 - If you're using AJAX type requests like this, you should use the built in WordPress mechanisms to do this. WP allows you to handle AJAX requests without having a separate file to call upon. Just put your PHP into the main code, in a function, and then hook that function to your own type of wp_ajax_* handler. More info here: http://codex.wordpress.org/AJAX_in_Plugins#Ajax_on_the_Administration_Side

share|improve this answer
add comment

Try this and see if you get any further..

add_action('admin_init', 'peb_init');
function peb_init() {
    add_action('admin_head', 'peb_admin_head');
}
function peb_admin_head() {
    echo '<script type="text/javascript">';
    require_once('js.php');
    echo '</script>';
}
add_filter('widget_text', 'do_shortcode');

add_shortcode('appPrice', 'appPrice');
function appPrice($atts) 
{
    $atts = shortcode_atts( 
        array(
            'id' => '',
            'class' => '',
            'container' => ''
        ), 
        $atts 
    );
    return "
    <script type='text/javascript'>
    jQuery(document).ready(function($) {
        var url = 'iLookup.php';
        query = $id;

        $.getJSON(url, {id:query}, function(json) {
            $('#results').html('Price: '+json.results[0].price+'<br/>');
        });
    });
    </script>
    ";
}

What's inside the js.php file? Echo statements outputting more JS?

NOTE: Your existing code didn't concatenate when assigning $id to query(so it was treated literally).

share|improve this answer
    
edButtons[edButtons.length] = new edButton('ed' ,'App Data!' ,'[app id="" type="" container="" class="" style="default"]' ,'' ,'u' ); This is what is in the js.php –  Logan Feb 21 '11 at 18:23
    
Is iLookup.php file in the same directory as the file that runs the above code? EDIT: Looks like Otto is basically spotting the same minor problems i am(i was just taking my time getting to the finer details). :) –  t31os Feb 21 '11 at 23:05
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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