Что такое AJAX.

Попробую описать на основе библиотеки jQuery. Надеюсь ты понимаешь что она должна быть подключена в заголовках страницы вместе с твоим CSS, типа того вот, если прямо с интернета:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>

1. Вот ты пишешь в адресной строке: www.google.com, что происходит? Браузер отправляет запрос, в ответ через кучу соединений провайдеров на сервер гугла, тот присылает тебе инфу в виде своей знаменитой поисковой строчки, той что ты видишь на экране.

2. Эта поисковая строчка - видимая тебе часть этой инфы - HTML код, но на странице также может быть и JavaScript код (обычно связанные функции).

3. Предположим в одной из функция есть такой код:

$("#klikni").click(function(){
     $('#service').html('Hello world!');
});

Что это значит? Функция ждет, когда ты нажмешь на HTML объект с id="klikni", а когда нажмешь ее задача вставить внутрь объекта с id="service" текст 'Hello world!', например получится так: <div id="service">Hello world!</div>. И ты увидишь этот текст на странице.

4. Для чего нужен AJAX запрос?
Для того, чтоб расширить возможности пункта 3.

Предположим? на странице, поисковая строчка Google представляет собой обычное текстовое поле, а id="klikni" у кнопки:
HTML:

<input type="text" name="google" id="search" value=""/>
<input type="button" name="ok" id="klikni" value="Ok"/>

И код JavaScript:

$("#klikni").click(function(){
                            
                               var search = document.getElementById("search").value;//собираем что внутри текстового поля
                                $.post('robot.php', {srch:search},function(data){
                                if(data.length>0)
                                {
                                          $('#service').html(search+': '+data);    
                                }
                                 else $('#service').html('По запросу ничего не найдено.');  
                            });
});

Теперь пишем в текстовом поле "Hello" по нажатию на кнопку "Ок":
- то, что ты написал в строчке поиска собирается в переменную search, т.е search='Hello'
- отправляется на сервер в виде перменной $_POST['srch'], точно таким же запросом, как www.google.com, но когда приходит на просто www.google.com, то обычно, по умолчанию обращается к google/index.php, а у тебя обратится к google/robot.php.

Например, в robot.php будет следующий код:

if(isset($_POST['srch']))echo ' Иван444';
exit;

Все.

Сервер отправит тебе инфу - ' Иван444'.
Функция ее принимает в виде data и создает ответ:

$('#service').html(search+': '+data);

Теперь: <

div id="service">Hello Иван444</div>

Иван444 - кусок который пришел тебе AJAX запросом.

Т.е. AJAX запрос это типа маленького сайта внутри сайта. Если б ты просто запустил robot.php то на всем белом экране увидел бы в левом углу Иван444. А когда это делает функция JavaScript через AJAX запрос, то она помещает это в нужное место экрана - туда куда скажешь и то, что скажешь, например можешь ее одеть в красны цвет:

$('#service').addClass('red').html(search+': '+data);

чтоб сэкономить трафик, а не отправлять по сети уже подкрашенный ник.

Примерно так.

Кстати,

var search = document.getElementById("search").value;//собираем что внутри текстового поля

это не единственный способ сформировать переменную в JS. Может это вообще будет логическая величина или какой нибудь счетчик нажатия на кнопку, или флаг того, что на страницы присутствует какой-нибудь особый элемент, загружающийся скажем у админов. Например, количество нажатий на кнопку:

var count=0;
$("#klikni").click(function(){
                            
count=count+1;
                         
var search = document.getElementById("search").value;//собираем что внутри текстового поля
                                $.post('robot.php', {srch:search,count:count},function(data){
                                if(data.length>0)
                                {
                                          $('#service').html(search+': '+data);    
                                }
                                 else $('#service').html('По запросу ничего не найдено.');  
                            });
});

в robot.php

if(isset($_POST['count']) && $_POST['count']>10)echo 'Ну чо ты жмешь  эту кнопку!?';//

Появится после 10 нажатий