0

i got this load more data on my script which works ok on localhost and some other host but on my current host somehow i get the following error which i click the loadmore button

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://localhost/getCat.php. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). (unknown)

here is the js function that i use

$(document).ready(function(){
    // Load more data
    $('.load-more').click(function(){
        var row = Number($('#row').val());
        var catid = Number($('#catid').val());
        var allcount = Number($('#all').val());
        row = row + <?php echo $records_per_page; ?>;
        if(row <= allcount){
           $("#row").val(row);
            $.ajax({
                url: '<?php echo DIR; ?>getCat.php',
                type: 'post',
                data: {row:row,catid:catid},
                beforeSend:function(){
                    $(".load-more").text("Loading...");
                },
                success: function(response){
                    // Setting little delay while displaying new content
                    setTimeout(function() {
                        // appending posts after last post with class="post"
                        $(".post:last").after(response).show().fadeIn("slow");
                        var rowno = row + <?php echo $records_per_page; ?>;
                        // checking row value is greater than allcount or not
                        if(rowno > allcount){

                            // Change the text and background
                             $(".load-more").text("No more.");
                             $('.load-more').css( 'pointer-events', 'none' );
                            $('.load-more').click(function(){return false;});
                            $('.load-more').css("background","#FB0925");
                        }else{
                            $(".load-more").text("Load more.");
                        }
                    }, 2000);
                }
            });
        }else{
            $('.load-more').text("Loading...");
            // Setting little delay while removing contents
            setTimeout(function() {
                // When row is greater than allcount then remove all class='post' element after 3 element
                $('.post:nth-child(3)').nextAll('.post').remove().fadeIn("slow");
                // Reset the value of row
                $("#row").val(0);
                // Change the text and background
                $('.load-more').text("Load more");
                $('.load-more').css("background","#333333");
            }, 2000);
        }
    });
});
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
Rose Mary Linda
  • 1
  • 2
  • Are you accidentally using this from the non-secure protocol, ie the error shows `https://` as the protocol, is the code you are trying loaded on `http://` which would cause a cross origin request – Patrick Evans Sep 20 '17 at 08:50
  • use `crossDomain: true` inside Ajax call – Ketan Solanki Sep 20 '17 at 08:52
  • 2
    @KetanSolanki, that option is not doing what you think it is. That forces jQuery to make it so the request is sent as if it were cross domain even though it is actually just doing a request to the same domain. It does not magically make a server send out CORS headers. – Patrick Evans Sep 20 '17 at 08:54
  • @KetanSolanki that will not solve anything. Read the documentation for that option. – ADyson Sep 20 '17 at 08:55
  • For more details - https://enable-cors.org/ – Alon Eitan Sep 20 '17 at 08:55
  • @PatrickEvans the echos my domain url as https: // www.domain. com/ – Rose Mary Linda Sep 20 '17 at 09:14

0 Answers0