views:

2032

answers:

3

Hi,

I would like to know if my approach is efficient and correct. my code is not working though, I don't know why.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>

 <script type="text/javascript">

 $(document).ready(function() {


  function HotelQuery(HotelName) {
   switch (HotelName) {
    case 'TimelessHotel': 
     var strHotelName = 'Timeless Hotel';
     var strHotelDesc = 'Hotel Description Timeless Hotel';
     var strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
    ; //end Timeless Hotel

    case 'ParadiseInn': 
     var strHotelName = 'Paradise Inn';
     var strHotelDesc = 'Hotel Description Paradise Inn';
     var strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
    ; //end Paradise Inn

    case 'TetrisHotel': 
     var strHotelName = 'Tetris Hotel';
     var strHotelDesc = 'Hotel Description Tetris Hotel';
     var strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
    ; //end Tetris Hotel 

    case 'JamstoneInn': 
     var strHotelName = 'Jamstone Inn';
     var strHotelDesc = 'Hotel Description Jamstone Inn';
     var strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
    ; //end Jamstone Inn 

   }
  };


 });

   </script>     

<title>hotel query</title>
</head>

<body>

  <a href="#" onclick="javascript: HotelQuery('TetrisHotel'); alert: (strHotelName, strHotelDesc, strHotelPrice);">Tetris Hotel Query</a>

</body>
</html>
+1  A: 

You code doesn't work because the variables are scoped to the function HotelQuery. I think what you might want to do is return an object with properties from the function, and also use the unobtrusive JavaScript approach to bind an click event handler to the <a> element.

Something like

$(function() {
    $('a').click(function() {
        var hotel = HotelQuery('TetrisHotel');

        alert(hotel.name) // alerts 'Tetris Hotel'
    });
});

function HotelQuery(HotelName) {
    var strHotelName;
    var strHotelDesc;
    var strHotelPrice;
    var strHotelRoomType;

    switch (HotelName) { 
        case 'TimelessHotel': 
            strHotelName = 'Timeless Hotel';
            strHotelDesc = 'Hotel Description Timeless Hotel';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person']; 
            break; //end Timeless Hotel  

        case 'ParadiseInn': 
            strHotelName = 'Paradise Inn';
            strHotelDesc = 'Hotel Description Paradise Inn';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
            break; //end Paradise Inn

        case 'TetrisHotel': 
            strHotelName = 'Tetris Hotel';
            strHotelDesc = 'Hotel Description Tetris Hotel';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];  
            break; //end Tetris Hotel 

        case 'JamstoneInn': 
            strHotelName = 'Jamstone Inn';
            strHotelDesc = 'Hotel Description Jamstone Inn';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
            break; //end Jamstone Inn 
    }
    return {
        name: strHotelName,
        desc: strHotelDesc,
        price: strHotelPrice,
        roomType: strHotelRoomType 
    }
};

Just noticed that you're also returning the same values other than the hotel name and description each time (you might have done this just as an example, I'm not sure). You could just assign all variables their value on declaration (or assign the values as properties of the returned object), other than the hotel name and description, which you could assign from the value of the argument for parameter HotelName. Something like

function hotelQuery(hotelName) {
    return {
        name: hotelName,
        desc: 'Hotel Desciption' + hotelName,
        // Keep prices as numbers and have a function to display them 
        // in the culture specific way. Numbers for prices will be easier to deal with
        price: [980, 1300, 1600, 1500, 1800, 300, 150, 200],
        roomType: ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person']
    } 
}
Russ Cam
take a look at Crockford's great article "A Survey of the JavaScript Programming Language" - http://javascript.crockford.com/survey.html Note: this is probably not for absolute beginners.
Russ Cam
A: 

There are a couple changes that I'd make.

Pull the HotelQuery function out of the ready function.

Second all of those variables are going to be out of scope by the time you make the alert call. If you'd like them to be in scope, declare them globally (outside of your function) and set them inside the function.

var name;

function doStuff() {
  name = "reggie";
}
Andy Gaskell
A: 

Several problems.

1) There is no need for the function to be within $(document).ready, get rid of that.


2) Every case statement should be followed by a break, not a lone ;. For example:

function HotelQuery(HotelName) {
    switch (HotelName) {
    case 'TetrisHotel': 
        // stuff goes here ...  
        break; //end Tetris Hotel 
    };
}


3) alter shouldn't be followed by a : in your onclick handler:

alert: (strHotelName, strHotelDesc, strHotelPrice);

should be

alert(strHotelName, strHotelDesc, strHotelPrice);

Also, alert only takes one parameter, so you need to break it up:

alert(strHotelName); alert(strHotelDesc); alert(strHotelPrice);


3) You're assuming strHotelName, strHotelDesc and strHotelPrice are in the global scope, which they are not.


Altogether, you might want to try something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>

 <script type="text/javascript">

  function HotelQuery(HotelName) {
    var response = {
     strHotelName: '',
     strHotelDesc: '',
     strHotelPrice: [],
     strHotelRoomType: []
    };
   switch (HotelName) {
    case 'TimelessHotel': 
     response.strHotelName = 'Timeless Hotel';
     response.strHotelDesc = 'Hotel Description Timeless Hotel';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
    break; //end Timeless Hotel

    case 'ParadiseInn': 
     response.strHotelName = 'Paradise Inn';
     response.strHotelDesc = 'Hotel Description Paradise Inn';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
     break; //end Paradise Inn

    case 'TetrisHotel': 
     response.strHotelName = 'Tetris Hotel';
     response.strHotelDesc = 'Hotel Description Tetris Hotel';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
     break; //end Tetris Hotel 

    case 'JamstoneInn': 
     response.strHotelName = 'Jamstone Inn';
     response.strHotelDesc = 'Hotel Description Jamstone Inn';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
     break; //end Jamstone Inn 
   }

   return response;
  };

  $(document).ready(function() {
      var infoContainer = $('#hotel-information');
      $("#hotel-query").click(function() {
       var info = HotelQuery('TetrisHotel');
       infoContainer.text(info.strHotelName);
      });
  });
  </script>     

<title>hotel query</title>
</head>

<body>
  <a href="#" id="hotel-query">Tetris Hotel Query</a>
  <p id="hotel-information"></p>
</body>
</html>
Justin Johnson