Noob Here - Ajax working (kind of)


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 2 of 2

Thread: Noob Here - Ajax working (kind of)

  1. #1
    Join Date
    Mar 2005
    Posts
    4

    Noob Here - Ajax working (kind of)

    OK, I am confused. I am working on a website for a small restaurant, and have something that working great, almost. Here's my problem, and I am thinking it's with the Ajax. When the user hovers over a link on the page, I have a scritp that loads text into a div tag (In this case they hover over appetizers link, then the appetizers menu loads into the div tag) My ajax script retrieves the html file for the text and then puts that into to page. This is working but with one problem. Here's some code snippets to help illustrate.

    HTML:
    <div id="menu">
    <a href="#" id="menuOption" name="Appetizers" onmouseover="createMenu('Appetizers')">Appetizers</a>
    <a href="#" id="menuOption" name="Sides" onmouseover="createMenu('Sides')">Sides</a>

    Javascript:
    function createMenu(mnuItem){

    switch (mnuItem) {
    case "Appetizers":

    document.getElementById('menuContent').innerHTML = readItem('Starters.html')
    break;

    More Javascript (w/ Ajax now):
    function readItem(Item){
    var menuLocation = "http://"+self.location.hostname+"/Smokey Canyon (rev)/menu/"+Item;
    var menuText;
    var xRequest;

    try {
    //FireFox, Safari, Opera 8+
    xRequest = new XMLHttpRequest();
    } catch (e) {
    //Internet Explorer Browsers
    try {
    xRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    xRequest = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {
    alert("Your browser is too Old");
    return false;
    }
    }
    }

    xRequest.onreadystatechange = function(){
    if(xRequest.readyState == 4){
    menuText = xRequest.responseText;
    }
    }

    xRequest.open("GET", menuLocation, true);
    xRequest.send(null);
    alert(menuText);
    return menuText;
    }


    OK, now I can mention the problem. If I remove that alert(menuText); then I get "undefined" in my div element, with it there, my alert says "undefined" but my page gets what I need.

    Does this make any sense? Obviously I want to be able to remove that alert and get the results into my page.

  2. #2
    Join Date
    Mar 2005
    Posts
    4

    Figured it out.

    I figured it out. Like most things, I was over thinking it. I managed to get rid of an entire function (createMenu()), and just use the readItem(). I passed the script page for the AJAX straight into that, and it worked.

    New Code:
    HTML:
    <a href="#" id="menuOption" name="Appetizers" onmouseover="readItem('Starters.php')">Appetizers</a>

    JavaScript:
    function readItem(Item){
    var menuLocation = "http://"+self.location.hostname+"/Smokey Canyon (rev)/menu/"+Item;
    var menuText;
    var xRequest;

    try {
    //FireFox, Safari, Opera 8+
    xRequest = new XMLHttpRequest();
    } catch (e) {
    //Internet Explorer Browsers
    try {
    xRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    xRequest = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {
    alert("Your browser is too Old");
    return false;
    }
    }
    }

    xRequest.onreadystatechange = function(){
    if(xRequest.readyState == 4){
    document.getElementById('menuContent').innerHTML = xRequest.responseText;
    }
    }

    xRequest.open("GET", menuLocation, true);
    xRequest.send(null);
    }

Similar Threads

  1. Replies: 0
    Last Post: 05-04-2007, 12:20 PM
  2. Replies: 1
    Last Post: 04-25-2007, 12:39 PM
  3. Replies: 0
    Last Post: 02-17-2007, 04:36 PM
  4. Replies: 1
    Last Post: 12-05-2001, 07:12 AM
  5. VSS:sharing same working folder without multiple checkouts
    By rahul phatak rahulphatak in forum ASP.NET
    Replies: 0
    Last Post: 06-01-2000, 06:41 PM

Tags for this Thread

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