0

I have this request on my website /menu/ url:

<!--Load Jquery-->
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
    jQuery('.simple-checkout').click(function(e) {
        e.preventDefault();
        jQuery(this).addClass('adding-cart');
        var product_id = jQuery('input[name="add-to-cart"]').val();
        var quantity = jQuery('input[name="quantity"]').val();
        var thwepof_product_fields = jQuery('input[name="thwepof_product_fields"]').val();
        var order_date = jQuery('input[name="order_date"]').val();

        jQuery('.cart-dropdown-inner').empty();

        jQuery.ajax ({
            url: '/menu/'
            type:'POST',
            data:'action=add_cart=' + product_id + '&quantity=' + quantity '&thwepof_product_fields=' + thwepof_product_fields '&order_date=' + order_date,
            contentType: 'multipart/form-data',

            success:function(results) {
                jQuery('.cart-dropdown-inner').append(results);
                var cartcount = jQuery('.item-count').html();
                jQuery('.cart-totals span').html(cartcount);
                jQuery('.single_add_to_cart_button').removeClass('adding-cart');
                jQuery('html, body').animate({ scrollTop: 0 }, 'slow');
                jQuery('.cart-dropdown').addClass('show-dropdown');
                setTimeout(function () {
                    jQuery('.cart-dropdown').removeClass('show-dropdown');
                }, 3000);
            }
        });
    });
</script>

on my page header. And this form later on my program code:

<form class="simple-checkout" enctype="multipart/form-data">
    <input type="hidden" name="add-to-cart" value="<?php echo htmlspecialchars($getid); ?>"/>
    <input type="number" name="quantity" min="1" max=<?= $available_stock ?> value="1"/>
    <input type="hidden" id="thwepof_product_fields" name="thwepof_product_fields" value="order_date">
    <input type="hidden" id="order_date" name="order_date value="<?php echo htmlspecialchars($get_day); ?>">
    <input type="submit" value="Add to cart"/>
</form>

But it looks like it doesn't send an AJAX request it'll send the form method=GET if I right.

DonSite
  • 33
  • 7
  • Get rid of the `contentType:` option. You're sending URL-encoded data, not multipart. – Barmar Feb 06 '18 at 17:08
  • `But it looks like it doesn't send an AJAX request it'll send the form method=GET if I right` - if your server has got no endpoint defined for a `POST` request you cannot access it. Can you post the server code too? – messerbill Feb 06 '18 at 17:08
  • 1
    This also should be a `.submit()` handler, not `.click()`. – Barmar Feb 06 '18 at 17:09
  • Is there a reason you're using `multipart/form-data` at all(enctype is GET if left out)? Also don't try to build your data string by hand. – Musa Feb 06 '18 at 17:10
  • And instead of writing the `data:` option out like that, you can just use `$(this).serialize()`. – Barmar Feb 06 '18 at 17:10
  • @Barmar It has to be sent multipart – DonSite Feb 06 '18 at 17:12
  • @messerbill Normal `method = POST` works well – DonSite Feb 06 '18 at 17:13
  • @Barmar `.submit()` and `.click()` does the same (nothing) – DonSite Feb 06 '18 at 17:14
  • if your function isn't running at all, put it in `$(document).ready()`. – Barmar Feb 06 '18 at 17:15
  • See https://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element – Barmar Feb 06 '18 at 17:15
  • You can use the complete url – miglio Feb 06 '18 at 17:28
  • [Have you watched the AJAX request / response in the browser's developer tools? Have you included the jQuery library in the project? Are there any errors reported? Are you running this on a web-server?](http://jayblanchard.net/basics_of_jquery_ajax.html) – Jay Blanchard Feb 06 '18 at 17:48

0 Answers0