dcsimg


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 2 of 2

Thread: ajax reload problem

  1. #1
    Join Date
    Oct 2009
    Posts
    2

    ajax reload problem

    Hi
    I am new to ajax but i have done one simple menu program using ajax i created one index page with menus if i click each menu i want that linked page in the same window now i am getting as a separate window that is i want to refresh only that particular part and not the whole page i will give you the code that i have done please help me out

    Code:
     this is my index.html page were i have my menus
    
    <html>
    <head>
    <title>My ajax website</title>
    <script language="javascript" type="text/javascript" src="ajax.js"></script>
    </head>
    <body>
    <div id="nav">
    <a href="home.html" onClick="sendRequest('home.html');">Home</a>
    <a href="first.html"onClick="sendRequest('first.html');">First Page</a>
    <a href="second.html onClick="sendRequest('second.html');">Second Page</a>
    </div>
    <br/>
    <div id="content">
    <script language="Javascript" type="text/javascript">
    if ((window.location.href.split("#", 2)[1] == null) || (window.location.href.split("#", 2)[1] == "") || (window.location.href.split("#", 2)[1] == "index")){
    sendRequest("index.html");
    }else{
    sendRequest(window.location.href.split("#", 2)[1] + ".html");
    }
    </script>
    </div>
    </body>
    </html>

    Code:
     ajax.js
    function createRequestObject() {
    	var req;
    
    	if(window.XMLHttpRequest){
    		// Firefox, Safari, Opera...
    		req = new XMLHttpRequest();
    	} else if(window.ActiveXObject) {
    		// Internet Explorer 5+
    		req = new ActiveXObject("Microsoft.XMLHTTP");
    	} else {
    		// There is an error creating the object,
    		// just as an old browser is being used.
    		alert('Problem creating the XMLHttpRequest object');
    	}
    	return req;
    
    }
    
    // Make the XMLHttpRequest object
    var http = createRequestObject();
    
    function sendRequest(webpage) {
    	// Open PHP script for requests
    	http.open('get', webpage);
    	http.onreadystatechange = handleResponse;
    	
    	http.send(null);
    }
    
    function handleResponse() {
    	if(http.readyState == 4 && http.status == 200){
    
    		// Text returned FROM the PHP script
    		var response = http.responseText;
    
    		if(response) {
    			// UPDATE ajaxTest content
    			//alert(response);
    			document.getElementById("content").innerHTML = response;
    		}
    	}
    }

  2. #2
    Join Date
    Oct 2009
    Posts
    3

    Problem is in your anchor tag

    Your reload problem is not due to your AJAX code, rather the anchor tags href. <a href="home.html" onclick="...."> when clicked will cause the current page to navigate to home.html.

    Option 1: use href="#" instead of pointing to an external URL.

    Option 2: don't use an anchor tag at all. Replace the <a> tag with a <span> tag.

    Hope this helps.

Similar Threads

  1. problem with XML & AJAX
    By kasei in forum AJAX
    Replies: 1
    Last Post: 11-12-2008, 02:33 PM
  2. Ajax browser and drop down menu problem
    By blckspder in forum AJAX
    Replies: 1
    Last Post: 11-22-2006, 04:19 PM
  3. login problem
    By dbrook007 in forum ASP.NET
    Replies: 0
    Last Post: 11-06-2006, 05:54 AM
  4. Problem while using AJAX inside frames
    By Hariharan in forum Java
    Replies: 0
    Last Post: 07-05-2006, 07:08 AM
  5. Replies: 0
    Last Post: 12-13-2001, 01:06 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center