The first is a post filtration, the secons is ajax add to cart button Separately they work fine, but adding to cart doesn't work after filtration(with results of filtration, before reloading the page). I tried to place the code of the second request in 'success' of the fist, but it didn'y work. I searched in google something like '2 ajax requests', but what I found wasn't similar to mine, help me to figure and understand how it correctly works please.
The first one(filtration)
jQuery(function($)
{
$('.categories.side-nav.log>#st-accordion>ul>li input, .sortby>.price-slider input, select.orderby').on('change',function(e){
e.preventDefault();
themename_get_posts();
jQuery('html, body').animate({scrollTop:0}, 1);
});
$('.orderby').on('change', function(e){
e.preventDefault();
themename_get_posts();
});
$(document).on("click",".ajax-page-numbers .page-numbers",function(e){
e.preventDefault();
var url = $(this).attr('href'); //Grab the URL destination as a string
var paged = url.split('&paged='); //Split the string at the occurance of &paged=
if(~url.indexOf('&paged=')){
paged = url.split('&paged=');
} else {
paged = url.split('/page/');
}
themename_get_posts(paged[1]); //Load Posts (feed in paged value)
});
//Получают данные
function getCats()
{
var cats = []; //Setup empty array
$(".themename_filter_check input:checked").each(function() {
var val = $(this).val();
cats.push(val); //Push value onto array
});
return cats; //Return all of the selected genres in an array
}
function getColor()
{
var cats = []; //Setup empty array
$(".themename_filter_pa_color_check input:checked").each(function() {
var val = $(this).val();
cats.push(val); //Push value onto array
});
return cats; //Return all of the selected genres in an array
}
function getSize()
{
var cats = []; //Setup empty array
$(".themename_filter_pa_size_check input:checked").each(function() {
var val = $(this).val();
cats.push(val); //Push value onto array
});
return cats; //Return all of the selected genres in an array
}
function getPricesMin(){
return $('#priceMin').val();
}
function getPriceMax(){
return $('#priceMax').val();
}
function themename_order(){
return $('.orderby option:selected').val();
}
function themename_get_posts(paged)
{
var paged_value = paged; //Store the paged value if it's being sent through when the function is called
var ajax_url = woocommerce_params.ajax_url; //Get ajax url (added through wp_localize_script)
$.ajax({
type: 'GET',
url: ajax_url,
data: {
action: 'themename_filter',
category: getCats,
pa_color: getColor,
pa_size: getSize,
min: getPricesMin,
max: getPriceMax,
order: themename_order,
paged: paged_value //If paged value is being sent through with function call, store here
},
beforeSend: function ()
{
$('.main-product-content').html('<div class="text-center" style="height:50vh;">Waiting</div>');
},
success: function(data)
{
//Hide loader here
$('.main-product-content').html(data);
$('.main-product-content ul.products').addClass('row');
jQuery('.slider-archive').each(function() {
var slider = jQuery(this);
slider.slick({
infinite: true,
slidesToShow: 1,
slidesToScroll: 1,
driggable:false,
dots: true,
arrows:true,
focusOnSelect: true,
});
var sLightbox = jQuery(this);
sLightbox.slickLightbox({
src: 'src',
itemSelector: 'img.attachment-woocommerce_single.size-woocommerce_single',
});
});
jQuery('.var-wrapper-pa_color .radio-span').click(function() {
jQuery('.var-wrapper-pa_color .radio-span').removeClass('attr-selected');
jQuery(this).addClass('attr-selected');
});
// Add new slide
},
error: function()
{
//If an ajax error has occured, do something here...
$(".main-product-content").html('<div class="text-center" style="height:50vh;">There has been an error</div>');
}
});
}
});
The second request(add to cart button)
jQuery( function( $ ) {
$('.single_add_to_cart_button').addClass('ajax_add_to_cart');
$( '.post-type-archive-product' ).on( 'click', '.quantity input', function() {
return false;
});
$( '.archive' ).on( 'change input', '.quantity .qty', function() {
var add_to_cart_button = $( this ).parents( '.product' ).find( '.add_to_cart_button' );
// For AJAX add-to-cart actions
add_to_cart_button.data( 'quantity', $( this ).val() );
// For non-AJAX add-to-cart actions
add_to_cart_button.attr( 'href', '?add-to-cart=' + add_to_cart_button.attr( 'data-product_id' ) + '&amp;quantity=' + $( this ).val() );
});
$('.input-text.qty.text').bind('keyup mouseup', function () {
var value = $(this).val();
$('.product_quantity').val(value)
});
if ( typeof wc_add_to_cart_params === 'undefined' )
return false;
$( document ).on( 'click', '.ajax_add_to_cart', function(e) {
e.preventDefault();
var $thisbutton = $(this);
var $variation_form = $( this ).closest( '.variations_form' );
var var_id = $variation_form.find( 'input[name=variation_id]' ).val();
$( '.ajaxerrors' ).remove();
var item = {},
check = true;
variations = $variation_form.find( 'select[name^=attribute]' );
if ( !variations.length) {
variations = $variation_form.find( '[name^=attribute]:checked' );
}
if ( !variations.length) {
variations = $variation_form.find( 'input[name^=attribute]' );
}
variations.each( function() {
var $this = $( this ),
attributeName = $this.attr( 'name' ),
attributevalue = $this.val(),
index,
attributeTaxName;
$this.removeClass( 'error' );
if ( attributevalue.length === 0 ) {
index = attributeName.lastIndexOf( '_' );
attributeTaxName = attributeName.substring( index + 1 );
$this
.addClass( 'required error' )
.before( '<div class="ajaxerrors"><p>Please select ' + attributeTaxName + '</p></div>' )
check = false;
} else {
item[attributeName] = attributevalue;
}
} );
if ( !check ) {
return false;
}
if ( $thisbutton.is( '.ajax_add_to_cart' ) ) {
$thisbutton.removeClass( 'added' );
$thisbutton.addClass( 'loading' );
if ($( this ).parents('.variations_form')[0]){
var product_id = $variation_form.find('input[name=product_id]').val();
var quantity = $variation_form.find( 'input[name=quantity]' ).val();
var data = {
action: 'bodycommerce_ajax_add_to_cart_woo',
product_id: product_id,
quantity: quantity,
variation_id: var_id,
variation: item
};
}
else {
var product_id = $(this).parent().find('.product_id').val();
var quantity = $(this).parent().find('.qty').val();
var data = {
action: 'bodycommerce_ajax_add_to_cart_woo_single',
product_id: product_id,
quantity: quantity
};
}
$( 'body' ).trigger( 'adding_to_cart', [ $thisbutton, data ] );
$.post( wc_add_to_cart_params.ajax_url, data, function( response ) {
if ( ! response )
return;
var this_page = window.location.toString();
this_page = this_page.replace( 'add-to-cart', 'added-to-cart' );
if ( response.error && response.product_url ) {
window.location = response.product_url;
return;
}
if ( wc_add_to_cart_params.cart_redirect_after_add === 'yes' ) {
window.location = wc_add_to_cart_params.cart_url;
return;
} else {
$thisbutton.removeClass( 'loading' );
var fragments = response.fragments;
var cart_hash = response.cart_hash;
if ( fragments ) {
$.each( fragments, function( key ) {
$( key ).addClass( 'updating' );
});
}
$( '.shop_table.cart, .updating, .cart_totals' ).fadeTo( '400', '0.6' ).block({
message: null,
overlayCSS: {
opacity: 0.6
}
});
$thisbutton.addClass( 'added' );
if ( fragments ) {
$.each( fragments, function( key, value ) {
$( key ).replaceWith( value );
});
}
$( '.widget_shopping_cart, .updating' ).stop( true ).css( 'opacity', '1' ).unblock();
$( '.shop_table.cart' ).load( this_page + ' .shop_table.cart:eq(0) >; *', function() {
$( '.shop_table.cart' ).stop( true ).css( 'opacity', '1' ).unblock();
$( document.body ).trigger( 'cart_page_refreshed' );
});
$( '.cart_totals' ).load( this_page + ' .cart_totals:eq(0) >; *', function() {
$( '.cart_totals' ).stop( true ).css( 'opacity', '1' ).unblock();
});
}
});
return false;
} else {
return true;
}
});
});
Where is correctly to paste a code from the second function, or tell to the first one somehow 'after success do the second'?