Ajax: Getting a Post Error when trying to use Relative Path

Question

Struggling to get the relative path of an Ajax post request to pickup the php file. I'm not getting an error just nothing happens.

Browsed this site, but cannot find a previous answer on Ajax relative paths that I understand. Still a novice at this. Would really appreciate it, if someone could explain it in layman terms.

I'm trying to access the php file 'search/search.php' from the root file 'index.php' (this file contains the Ajax request). This worked when both files were in the same directory.

File structure below:

JQuery code snippet:

$(function() {
  $('form').on("submit", function(e) {
    e.preventDefault();
    $('#error').text(""); // reset
    var name = $.trim($("#search").val());
    if (name.match(/[^a-zA-Z0-9 ]/g)) {
      $('#error').text('Please enter letters and spaces only');
      return false;
    }
    if (name === '') {
      $('#error').text('Please enter some text');
      return false;
    }
    if (name.length > 0 && name.length < 3) {
      $('#error').text('Please enter more letters');
      return false;
    }

    $.ajax({
      url: 'search/search.php',
      method: 'POST',
      data: {
        msg: name
      },
      dataType: 'json',
      success: function(response) {

      $(".content").html("")
      $(".total").html("")

        if(response){
          var total = response.length;
          $('.total') .append(total + " Results");
         }

        $.each(response, function() {
          $.each($(this), function(i, item) {

            var mycss = (item.Type == 1) ? ' style="color: #ffa449;"' : '';
            $('.content').append('<div class="post"><div class="post-text"> ' + item.MessageText + ' </div><div class="post-action"><input type="button" value="Like" id="like_' + item.ID + '_' + item.UserID + '" class="like" ' + mycss + ' /><span id="likes_' + item.ID + '_' + item.UserID + '">' + item.cntLikes + '</span></div></div>');
          });
        });
      }
    });
  });
});

Answer 1

The leading forward slash simply means “begin at the document root”, which is where index.php lives. So /search/search.php should be correct. If the server is unable to find the file, it stands to reason that there must be some url rewriting happening.

You can test by simply pointing your browser to http://localhost:8000/search/search.php. If you get a 404, you know it has nothing to do with ajax