jQuery Forum

I've been trying to use a remote JSON datasource but just isn't working so I'm giving an XML solution a try.

The code I have is along the lines:

1. From: <input id="frmFlightFrom" name="frmFlightFrom" type="text" class="Airports" value="" />
   
   <script type="text/javascript">
   jQuery(document).ready(function(){
        jQuery.ajax({
               url: "http://www.proudlycarbonneutral.com/CarbonFootprintCalculator/FlightList.aspx",
               dataType: "xml",
               success: function( xmlResponse ) {
                   var data = jQuery( "airport", xmlResponse ).map(function() {
                       return {
                           value: jQuery( "name", this ).text()
                       };
                   }).get();
                   jQuery( ".Airports" ).autocomplete({
                       source: data,
                       minLength: 0;
                   }
               };
           });
   });
   </script>
   

I'm trying to implement Autocomplete using a remote JSON datasource as the load time is excessive when I embed the list.

The datasource I have is at http://www.proudlycarbonneutral.com/CarbonFootprintCalculator/FlightList.aspx

The page where this is used is at http://www.proudlycarbonneutral.com/CarbonFootprintCalculator.aspx in the Flights section (submenu on right).  It just isn't loading here and I'm not too sure why.  I'd like the entire data to be searched when typing as it could be by airport name, city, or country which all appear in the AirportName field.

The code I'm using is:

1. jQuery( ".Airports" ).autocomplete({
               source: function( request, response ) {
                   jQuery.ajax({
                       url: "http://www.proudlycarbonneutral.com/CarbonFootprintCalculator/FlightList.aspx",
                       dataType: "jsonp",
                       data: {
                           featureClass: "P",
                           style: "full",
                           maxRows: 12,
                           name_startsWith: request.term
                       },
                       success: function( data ) {
                           response( jQuery.map( data.airportlist, function( item ) {
                               return {
                                   label: item.AirportName,
                                   value: item.AirportName
                               }
                           }));
                       }
                   });
               },
               minLength: 2
           });
   

The same code works when I use the demo geonames source but not this.

Any help at all would be appreciated.

Thanks

David

Hopefully someone here might know what I'm doing wrong.

I have a list of checkboxes, in multiple rows with each along the lines of:

    <tr>
        <td style="text-align: center;">
            <input id="frmEmployee" name="frmEmployee" value="'[PayrollRef,Employees]'" type="checkbox" checked="checked" />
        </td>
        <td>[FirstName,Employees] [LastName,Employees]</td>
        <td style="text-align: center;">
            <input id="frmUseTimesheets[PayrollRef,Employees]" name="frmUseTimesheets[PayrollRef,Employees]" value="True" type="checkbox" checked="checked" />
        </td>
        <td style="text-align: center;">
            <input id="frmUseExpenses[PayrollRef,Employees]" name="frmUseExpenses[PayrollRef,Employees]" value="True" type="checkbox" checked="checked" />
        </td>
    </tr>

What I want to do is when the #frmEmployee checkbox is checked/unchecked it will also check/uncheck the other two checkboxes in that same row only.

The script I have which isn't yet doing this is:

<script type="text/javascript">
jQuery(document).ready(function(){  
   jQuery("[id=^frmEmployee]").change(function(){
        var selected = jQuery(this);
        var scope = jQuery(this).parent("tr");
        jQuery("[id=^frmUseTimesheets]",scope).attr('checked', selected.is(':checked'));
        jQuery("[id=^frmUseExpenses]",scope).attr('checked', selected.is(':checked'));
    });
});
</script>

Is it something obvious that's wrong?

Thanks

David

I have a list of products where they have minimum quantities in a hidden input. Some products have multiple colours, though the same minimum quantity and I'm trying to implement a jQuery check that entries made are at least equal to the minimum. 

Blank or '0' entries are fine but if it's below the minimum quantity it should set to the minimum.

1. HTML:
2. <div class="ProductGrouping"> <!-- with colours -->
3. <input id='frmQuickAdd1234c1' name='frmQuickAdd1234c1' type='text' style='width: 40px; text-align: center;' class='auto {mDec: 0}' value='' /> Black
4. 
   
5. <input id='frmQuickAdd1234c2' name='frmQuickAdd1234c2' type='text' style='width: 40px; text-align: center;' class='auto {mDec: 0}' value='' /> White
6. <input id="QuickAddMinOrderQty1234" name="QuickAddMinOrderQty1234" type="hidden" class="auto {mDec: 0}" value="6" />
7. </div>
8. <div class="ProductGrouping"> <!-- without colours -->
9. <input id='frmQuickAdd4567' name='frmQuickAdd4567' type='text' style='width: 40px; text-align: center;' class='auto {mDec: 0}' value='' /> Product B
10. 
    
11. <input id="QuickAddMinOrderQty4567" name="QuickAddMinOrderQty4567" type="hidden" class="auto {mDec: 0}" value="3" />
12. </div>
13. jQuery:
14. <script type="text/javascript">
15. jQuery(document).ready(function(){
16.     if (jQuery.browser.msie) {
17.         jQuery("[id=^frmQuickAdd]").bind("keyup", CheckStr);
18.         };
19.    
20.     jQuery('[id=^frmQuickAdd]').change(CheckMin);
21.     function CheckMin(){
22.         var AmountStr = jQuery(this);
23.         var Amount = Number(AmountStr.val().replace(/[$£,]+/g,""));
24.         var ProductScope = jQuery(this).parent("div.ProductGrouping")
25.         var MinQtyStr = jQuery("[id=^QuickAddMinOrderQty]",ProductScope);
26.         var MinQty = Number(MinQtyStr.val().replace(/[$£,]+/g,""));
27.         if (parseFloat(Amount) == 0){}
28.         else if (parseFloat(Amount) == ''){}
29.         else if(parseFloat(Amount) < parseFloat(MinQty)){
30.             AmountStr.val(MinQtyStr.val());
31.             };
32.     };
33.     function CheckStr(){
34.         if (isNaN(jQuery(this).val() )) {
35.             var ProductScope = jQuery(this).parent("div.ProductGrouping")
36.                 jQuery(this).val(jQuery("[id=^QuickAddMinOrderQty]",ProductScope).val())
37.         }
38.     };
39. });
40. </script>

Is there something obviously wrong with this?  It isn't performing the minimum check and I'm really not sure why.

Thanks

David