Query Cross Domain Ajax using Jquery and Ajax to get a value from the server


I am trying to make an Ajax request from my localhost to a php file in the server. As I am testing this, I am yet to do the real code in the PHP file. I just want the PHP file to get the posted value and echo the same. After getting the response from the PHP file, I want to store it in a div.

This works good when search.php in my localhost but throws an error

XMLHttpRequest cannot load http://www.mysite.com/search.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

Here is the very simple PHP file on the server which echo back what is posted.


<form action='http://www.mysite.com/search.php' id='search-form' method='post'>
    <input name='q' placeholder='Search' type='text' />
    <button id='search-button' type='submit'><span>Search</span></button>
<div class="sample_code">Search Results</div>
<div id="result"></div>


     $("#search-form").submit(function(event) {

        /* stop form from submitting normally */

        /* get some values from elements on the page: */
        var $form = $(this),
            term = $form.find('input[name="q"]').val(),
            url = $form.attr('action');

        /* Send the data using post */
        var posting = $.post(url, {
            q: term

        /* Put the results in a div */
        posting.done(function(data) {
            //var content = $(data).find('#content');

A PHP file in the server to echo what is posted (search.php)


    $item = $_POST['term'];
    echo $item;


Try "jsonp", but it only supports GET method and is DOM-blocking.