function uuidv4() {
return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
);
}
function export_csv() {
$.ajax({
url: '/prepare_csv',
method: 'post',
dataType: 'html',
success: function() {
window.open('static/temp/out.csv?_=' + uuidv4(), '_blank');
}
});
}
<script type="text/javascript">
function inner_data(data) {
var names = JSON.parse(data);
var to_inner = '';
for (key in names) {
var id = key;
var name = names[id];
var count = cart[key];
to_inner += '<div class="alert alert-light" role="alert" style="color: black;border-top: ' +
'1px solid lightgray; border-bottom: 1px solid lightgray;">' +
'<h4 class="alert-heading">' + name + '</h4><p>Количество: <div class="input-stepper">\n' +
' <button class="minus"><i class="fa fa-minus"></i></button>\n' +
' <input type="text" value="0" />\n' +
' <button class="plus"><i class="fa fa-plus"></i></button>\n' +
'</div></p></div>';
}
return to_inner;
}
var cart = JSON.parse(localStorage.getItem('cart'));
if (cart == null) {
document.getElementById('empty_cart').style.display = 'table-cell';
}
else {
document.getElementById('not_empty_cart').style.display = 'block';
var cart = JSON.parse(localStorage.getItem('cart'));
var ids = Object.keys(cart);
$.ajax({
type: "POST",
url: 'get_goods_data.php',
data: ids,
success: function(data){
document.getElementById('cart_data').innerHTML = inner_data(data);
}
});
}
</script>
<script type="text/javascript">
var stepper = function () {
var stepperNumber,
minusButton;
return {
allSteppers: $( '.input-stepper' ),
// check to see if the input is at '0'...
checkStepperNumber: function ( thisStepper ) {
stepperInput = $( thisStepper ).find( 'input' );
stepperNumber = stepperInput.val();
decrementButton = $( thisStepper ).find( 'button.minus' );
if ( stepperNumber === '0' || stepperNumber <= 0 ) {
// if so, disable the minus button.
decrementButton.prop( 'disabled', true );
stepperInput.val( 0 );
} else {
// if number is positive, enable the minus button
decrementButton.prop( 'disabled', false );
}
},
init: function () {
stepper.allSteppers.each( function ( index, element ) {
var thisStepperInput = $( element ).find( 'input' );
var thisMinusButton = $( element ).find( 'button.minus' );
if ( thisStepperInput.val() === '0' || thisStepperInput.val() <= 0 ) {
thisMinusButton.prop( 'disabled', true );
thisStepperInput.val( 0 );
} else {
// if number is positive, enable the minus button
thisMinusButton.prop( 'disabled', false );
}
});
}
}
}();
// on button.plus click ...
$( '.input-stepper button.plus' ).on( 'click', function ( e ) {
thisStepper = $( e.target ).closest( '.input-stepper' );
stepperInput = thisStepper.find( 'input' );
// check the input value
stepperNumber = stepperInput.val();
// increment the input value
stepperNumber++;
stepperInput.val( stepperNumber );
// then check the stepper number
stepper.checkStepperNumber( thisStepper );
});
// on button.minus click ...
$( '.input-stepper button.minus' ).on( 'click', function ( e ) {
thisStepper = $( e.target ).closest( '.input-stepper' );
stepperInput = thisStepper.find( 'input' );
// check the input value
stepperNumber = stepperInput.val();
// decrement the input value
stepperNumber--;
stepperInput.val( stepperNumber );
// then check the stepper number
stepper.checkStepperNumber( thisStepper );
});
// on input field blur ...
$( '.input-stepper input' ).on( 'blur', function ( e ) {
thisStepper = $( e.target ).closest( '.input-stepper' );
// check the stepper number
stepper.checkStepperNumber( thisStepper );
});
// check the stepper number on load
if ( $( '.input-stepper' ).length ) {
stepper.init();
}
</script>