load contents without reloading the page
<p>I am using the following code, for loading contents without loading the page !</p>

<p><strong>index.html</strong></p>

<pre><code>&lt;html&gt;

    &lt;head&gt;
        &lt;script type="text/javascript"&gt;
            // &lt;![CDATA[
            document.observe('dom:loaded', function () {
                    var newsCat = document.getElementsByClassName('newsCat');
                    for(var i = 0; i &lt; newsCat.length; i++) {
                        $(newsCat[i].id).onclick = function () {
                            getCatPage(this.id);
                        }
                    }
                });

            function getCatPage(id) {
                var url = 'load-content.php';
                var rand = Math.random(9999);
                var pars = 'id=' + id + '&amp;rand=' + rand;
                var myAjax = new Ajax.Request(url, {
                        method: 'get',
                        parameters: pars,
                        onLoading: showLoad,
                        onComplete: showResponse
                    });
            }

            function showLoad() {
                $('newsContent').style.display = 'none';
                $('newsLoading').style.display = 'block';
            }

            function showResponse(originalRequest) {
                var newData = originalRequest.responseText;
                $('newsLoading').style.display = 'none';
                $('newsContent').style.display = 'block';
                $('newsContent').innerHTML = newData;
            }
             // ]]&gt;
        &lt;/script&gt;
    &lt;/head&gt;

    &lt;body&gt;
        &lt;div class="newsCat" id="newsCat1"&gt;Politics&lt;/div&gt;
        &lt;div class="newsCat" id="newsCat2"&gt;Sports&lt;/div&gt;
        &lt;div class="newsCat" id="newsCat3"&gt;Lifestyle&lt;/div&gt;
        &lt;div id="newsLoading"&gt;Loading
            &lt;img src="loading_indicator.gif" title="Loading..." alt="Loading..." border="0" /&gt;
        &lt;/div&gt;
        &lt;div id="newsContent"&gt;&lt;/div&gt;
        &lt;/div&gt;
    &lt;/body&gt;

&lt;/html&gt;
</code></pre>

<p>this page is for including the desired page in the index.php !</p>

<p><strong>content-load.php</strong></p>

<pre><code>&lt;?php

function stringForJavascript($in_string) {
$str = preg_replace("# [\r\n] #", " \\n\\\n", $in_string);
$str = preg_replace('#"#', '\\"', $str);
return $str;

$user = $_SESSION['userName'];

}
switch($_GET['id']) {
    case 'newsCat1':
    $content = include("politics.php");
    break;
case 'newsCat2':
    $content = include("sports.php");
    break;
case 'newsCat3':
    $content = include("lifestyle.php");
    break;
default:
    $content = 'There was an error.';

} 
print stringForJavascript($content);
usleep(600000);
?&gt;
</code></pre>

<p><strong>PROBLEM FACING</strong></p>

<p>it works fine, but when i am refreshing the page or submitting a form, the code refreshes, i mean the page which was include before refreshing, doesnot exists......</p>

<p>and i am really sorry about my ENGLISH, i know its horrible ! :)</p>

<p>pls help me php masters, i need ur help...</p>
