CODEWITHSUNDEEP
phpjquery
peter.shep
peter.shep

Reputation: 55

PHP jQuery Post - returns too much HTML

I have a problem when using jQuery Post, the PHP returns all the HTML of the page up to the newly created HTML, rather then just the HTML that is output by the PHP.

As an example say the php outputs: '<div>Some Content</div>'

Then the jQuery Post returns: '<html><head>...all the head content...</head><body>...other content...<div>Some Content</div>'

Here's the jQuery (link to full code: http://pastebin.com/U7R8PqX1):

        jQuery("form[ID^=product_form]").submit(function() {

        var current_url = js_data.current_url;
        form_values = jQuery(this).serialize();

        jQuery.post(current_url+"?ajax=true", form_values, function(returned_data) {

                jQuery('div.shopping-cart').html(returned_data);

            }

        });

        return false;

    });

And here's the PHP (version 5.3.6 - link to full code: http://pastebin.com/zjSUUbmL):

        function output_cart() 
    {


        ob_start();
        echo $this->output_cart_html();
        $output = ob_get_contents();
        ob_end_clean();

        echo $output;  

        exit();

    }

        function output_cart_html() {


            if (!isset($_SESSION['cart_items'])) 
            {
                $output = '<div class="cart_content faded">BASKET - Empty</div>';
                return $output;

            } else {

                $total_items = 0;
                $total_items = 0;
                $items_in_cart = $_SESSION['cart_items'];

                // work out total price and total items
                foreach ($items_in_cart as $item_in_cart) {
                    $total_items += $item_in_cart['quantity'];
                    $total_price += floatval($item_in_cart['updated_price']*$item_in_cart['quantity']);
                }

                $template_url = get_bloginfo('template_directory');
                $output = '';
                $output_price = $dp_shopping_cart_settings['dp_currency_symbol'].number_format($total_price,2);
                if($total_items == 1){ $item_text = ' Item'; } else { $item_text = ' Items'; }
                $output .= $total_items . $item_text;
                $output .= '&nbsp;<span class="bullet"></span>&nbsp; Total '.$output_price;
                // empty cart btn
                $output .= '<form action="" method="post" class="empty_cart">
                    <input type="hidden" name="ajax_action" value="empty_cart" />
                    <span class="emptycart"> <a href="'.htmlentities(add_query_arg("ajax_action", "empty_cart", remove_query_arg("ajax")), ENT_QUOTES).'"><img src="'.$template_url.'/images/empty.png" width="9" height="9" title="Empty Your Items" alt="Empty Your Items" />Empty Your Cart</a></span>
                    </form>';
                // check out btn
                $output .= '&nbsp;<span class="bullet"></span>&nbsp; <span class="gocheckout">'.$this->output_checkout_link().' </span>';

                return $output;

            }

    }

Upvotes: 0

Views: 363

Answers (2)

peter.shep
peter.shep

Reputation: 55

Ok it turns out my problem was with the way Wordpress processes AJAX requests. The plugin I was building on top of was using AJAX but didn't have these issues (I'm not sure why maybe because they were using eval), so I hadn't realised there was a correct way of using AJAX with Wordpress. Here's a bunch of information if anyone else has similar problems:

http://codex.wordpress.org/AJAX_in_Plugins

http://byronyasgur.wordpress.com/2011/06/27/frontend-forward-facing-ajax-in-wordpress/ (this one really helped me out, a very simple example that I was able to adapt)

-- sorry I couldn't post more links because I'm too new on this site, but check out the links at the bottom of the first link above, especially the '5 Tips'.

As I'm using classes I instantiated the class from the index file of my plugin with this:

    if ($_POST['action'] === 'action_name') {

        $class_obj = new \namespace_name\class();
        add_action('wp_ajax_action_name', array($class_obj, 'method_name'));
        add_action('wp_ajax_nopriv_action_name', array($class_obj, 'method_name'));

}

Upvotes: 0

Nathan
Nathan

Reputation: 12010

You need to check if the form has been posted yet with the PHP. To do this, just check if the 'ajax' parameter is there, or send another $_GET variable if you wish (by adding &anotherparementer=1 to the end of the jQuery post URL). Example:

<?php 
if(isset($_GET['ajax'])) {
//your PHP code here that submits the form, i.e. the functions that you have, etc.
}
else { 
?>
<html>
<head>
head content here...
</head>
<body>
body content here...
</body>
</html>
<?php
} 
?>

I hope this helps.

Upvotes: 3

Related Questions