tags:

views:

71

answers:

1
Q: 

Help: Loop for dynamic <option> getting it from an array.

Hi,

I need a help in my code, I cant figure out how to loop values from array and putting them a list/menu. I need to loop the array the roomType and combine it with the rate so it would look some thing like this (e.g. Single Room (980.00)) the values of roomType and rate would be dynamic for every option.

please see my code and let me know if my approach are right.

Thank You.

<!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() {      

  $('#HasCart_TetrisHotel').ready(function() {

/*   var hotel = HotelQuery('TetrisHotel');
   $('#HasCart_TetrisHotel .hotName').append(hotel.name);
   $('#HasCart_TetrisHotel .hotDesc').append(hotel.desc);
   $('#HasCart_TetrisHotel .hotMenu').append('<select name="price">' + 

    $.each(hotel.roomType, function( intIndex, objValue ){

     $(this).append(
      $( "<option value='" + hotel.price + "' >" + hotel.roomType + "</option>" )
     );

    });


   + '</select>'); */ 


   var hotel = HotelQuery('TetrisHotel');
   $('#HasCart_TetrisHotel .hotName').append(hotel.name);
   $('#HasCart_TetrisHotel .hotDesc').append(hotel.desc);
   $('#HasCart_TetrisHotel .hotMenu').append('<select name="price">' +  '</select>');  


   var hotel = HotelQuery('ParadiseInn');
   $('#HasCart_ParadiseInn .hotName').append(hotel.name);
   $('#HasCart_ParadiseInn .hotDesc').append(hotel.desc);
   $('#HasCart_ParadiseInn .hotMenu').append('<select name="price">' +  '</select>'); 

   var hotel = HotelQuery('JamstoneInn');
   $('#HasCart_JamstoneInn .hotName').append(hotel.name);
   $('#HasCart_JamstoneInn .hotDesc').append(hotel.desc);
   $('#HasCart_JamstoneInn .hotMenu').append('<select name="price">' +  '</select>'); 


  });

 });








  function HotelQuery(HotelName) {
   switch (HotelName) {
    case 'TimelessHotel': 
     var strHotelName = 'Timeless Hotel';
     var strHotelDesc = 'Hotel Description Timeless Hotel';
     var strHotelRate = ['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 strHotelRate = ['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'];    
break; //end Paradise Inn

case 'TetrisHotel': 
 var strHotelName = 'Tetris Hotel';
 var strHotelDesc = 'Hotel Description Tetris Hotel';
 var strHotelRate = ['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'];  
 break; //end Tetris Hotel 

case 'JamstoneInn': 
 var strHotelName = 'Jamstone Inn';
 var strHotelDesc = 'Hotel Description Jamstone Inn';
 var strHotelRate = ['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'];    
break; //end Jamstone Inn 
}
return {
          name: strHotelName,
          desc: strHotelDesc,
          rate: strHotelRate,
          roomType: strHotelRoomType 
       }; 
};


 });

   </script>     

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

<body>


 <div id="HasCart_TetrisHotel">
     <table width="380px" border="1" cellspacing="3" cellpadding="0">
          <tr>
            <td class="hotName"></td>
            <td class="hotDesc">&nbsp;</td>
            <td class="hotMenu"></td>
          </tr>
        </table>
    </div>

   <div id="HasCart_ParadiseInn">
     <table width="380px" border="1" cellspacing="3" cellpadding="0">
          <tr>
            <td class="hotName"></td>
            <td class="hotDesc">&nbsp;</td>
            <td class="hotMenu"></td>
          </tr>
        </table>
    </div> 

    <div id="HasCart_JamstoneInn">
     <table width="380px" border="1" cellspacing="3" cellpadding="0">
          <tr>
            <td class="hotName"></td>
            <td class="hotDesc">&nbsp;</td>
            <td class="hotMenu"></td>
          </tr>
        </table>
    </div>    



<h2>Something Like This</h2>

    <select name="price">
        <option value="980.00">Single Room (980.00)</option>
        <option value="1,300.00">Deluxe Room (1,300.00)</option>
        <option value="1,600.00">Twin Room (1,600.00)</option>

        <option value="1,500.00">Matrimonial Room (1,500.00)</option>
        <option value="1,800.00">Presidential Suites (1,800.00)</option>
        <option value="300.00">Extra Bed (300.00)</option>   
        <option value="150.00">Free Breakfast (150.00)</option>    
        <option value="200.00">Extra Person (200.00)</option>          
    </select>



</body>
</html>
A: 

You're on the right track, it's best to build the options in your HotelQuery function. Here we're using a self-terminating while (optimized 'for' statement), and using an array join it's faster and perhaps cleaner than string concatenation. Let me know if you have any questions. All the best, M

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"&gt;
</script>
<script type="text/javascript" charset="utf-8">
    $(function(){

        function buildPriceOptions(rate,type)
        {
            var i = rate.length, a = [];
            while(i--) a.push(
                [
                    '<option value="',rate[i],'">',type[i],
                    ' (',rate[i],')','</option>'
                ]
                .join('')
            );
            return a.reverse().join('\n')
        }

        function HotelQuery()
        {
            switch (true) {
                case true : 
                    var strHotelName = 'Jamstone Inn';
                    var strHotelDesc = 'Hotel Description Jamstone Inn';

                    var strHotelRate = [
                        '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'];    

                    var htmPrice = buildPriceOptions(
                        strHotelRate,
                        strHotelRoomType
                        );
                break;
            }
            return {
                name     : strHotelName,
                desc     : strHotelDesc,
                rate     : strHotelRate,
                roomType : strHotelRoomType,
                prices   : htmPrice
            }; 
        };
        hotel = HotelQuery();
        $('#HasCart_TetrisHotel .hotMenu').append(
            [ 
                '<select name="price">',
                hotel.prices,
                '</select>'
            ]
            .join('')
        );
    })
</script>
</head>
<body>
    <div id="HasCart_TetrisHotel">
        <div class="hotMenu">

        </div>
    </div>
</body>
</html>
Matt Gardner  2009-09-16 21:24:03
Thanks Matt,If you have minute, Could you take a look at my code and tell me whats wrong with it?, http://boxwithsand.0fees.net/query-js.htmlIt's just pulling data from the Jamstone Inn, Why is that?Thanks You!
Pennf0lio  2009-09-17 18:40:36

related questions

[c#] How to pass a single object[] to a params object[]
How to declare an array of strings in C++?
Pass reference to element in C# Array
Ruby - Convert Integer to String
Comparing Arrays of Objects in JavaScript
.NET Multi Dimensional Array Printing
Iterating over a complex Associative Array in PHP
How would you implement a hashtable in language x?
How can I merge PHP arrays?
Classes vs 2D arrays
How Does One Sum Dimensions of an Array Specified at Run-Time?
How do I compare two arrays of DataRow objects in PowerShell?
How to split a byte array
Pointer Manipulation Help
Can placement new for arrays be used in a portable way?
How does one rank an array (sort) by value? *With a twist*
Replacement for for... if array iteration
php: access array value on the fly
Remove duplicates from array
How do I remove duplicate items from an array in Perl?
Length of Javascript Associative Array
Can you force either a scalar or array ref to be an array in Perl?
What is the best way to iterate through an array in Classic Asp VBScript?
Using 'in' to match an attribute of Python objects in an array
What's the best way to generate a tag cloud from an array? (using h1 through h6 for sizing)