Uncaught SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data

Question

I have been reading some of the other questions here but I can't find one that fully explains how I should fix it. I am new to JSON and don't fully understand it all.

I have to search price range(min_price & max_price) from two columns(regular_price & sale_price) but unable to get values from both columns.

<script>
    $( function() {
        $( "#slider-range" ).slider({
            range: true,
            min: {{ $min_price }},
            max: {{ $max_price }},
            values: [ 0, {{ $max_price }} ],
            slide: function( event, ui ) {
                var amount = $( "#amount" ).val( " $ " + ui.values[ 0 ] + " -  $ " + ui.values[ 1 ] );
                $.ajax({
                    type: 'get',
                    dataType: 'json',
                    url: '{{ route('priceFilter') }}',
                    data: 'amount',
                    success: function (response) {
                        var data = JSON.parse(response);
                        $.each(data, function (index, element) {
                            console.log(element);
                        });
                    }
                });
            }
        });
        $( "#amount" ).val( " $ " + $( "#slider-range" ).slider( "values", 0 ) + " -  $ " + $( "#slider-range" ).slider( "values", 1 ) );
    });
</script>

I click on the range I get the following error:

Uncaught SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data

Answer 1

that was your line:

data: 'amount',

you should may change it to this format:

 $.ajax({
         url: 'something.php',
         data: {amount: amount},
                type: 'POST',
                success: function (data) {
                    if (!data.error) {
                       //your code
                    }
                }
            });