DROP DOWN box no longer works in move from PHP to Javascript

We are trying to offload load from the server to the browser.  We have a drop down box with SELECT OPTION statements that have been transferred from PHP to Javascript.  drop-down box works the first time.  The updated SELECT is transferred back to PHP code with a JSON return.  Now, the dropdown box no longer "works."
ccbergmanAsked:
Who is Participating?
 
Michel PlungjanConnect With a Mentor IT ExpertCommented:
Ah, You might want

   if (scheduleViewDays >0)  for (var i=1;scheduleViewDays <i && i<=10;i++) {    
            var sel = i==scheduleViewDays?' selected="selected"':"";
            o += '<option value="'+i+'" '+sel+'>'+i+'</option>';
      }
   }
0
 
Michel PlungjanIT ExpertCommented:
Please wait while I put on my telepathy helmet so I can see your code through your eyes.... Hmmm no. Too much interference. Please post the code here instead and wrap it in [ code] ... [/ code] tags
0
 
ccbergmanAuthor Commented:
function updateData()
{
	// update panel headers
	$.getJSON('/xml/xml.flights.counter.php', function (json)
	{
		var scheduledFlightData = json.scheduled;
		var scheduleViewDays = json.scheduleViewDays;
		var scheduleExpanded = json.scheduleExpanded;
		var php_Self = json.php_Self;

           var optIn = json.optIn;

		// Here we have the data structure that is returned from xml.flight.counters - so we can now pass this into
		// the new javascript function to display the scheduled pane.

		// As we make this same change to the other panes the calls to render them will occur here, meaning that we've now
		// limited the number of requests to draw the left panel of the page to just one
		genHTML_Scheduled(scheduledFlightData, showBlock, scheduleViewDays, scheduleExpanded, php_Self);
	
	});
}

Open in new window


[code]


function updateScheduled()
{
    $.getJSON('/xml/xml.flights.counter.php', function (json)
    {
        var scheduledFlightData = json.scheduled;
    });
}


function genHTML_Scheduled(scheduledFlightData, showBlock, scheduleViewDays, scheduleExpanded, php_Self)
{
        var SO = '';

        var o = '<table border="0" width="100%" style="border-collapse: collapse; border-color: #f0f0f0;" id="scheduledflights">';
        o += '<tr><th colspan="9" style="cursor:pointer"><b><? echo($current_flights_current_sched_text); ?></b></th></tr>';
        o += '<tr id="csf">';
    
        if (showBlock == "none")
        {
            SO = "no";
        }
        else
        {
            SO = "yes";
        }
     
        if(scheduleExpanded)
            o += '<td align="left" id="_hs"><a href="#" onclick="showNestedScheduled(false);"><? echo($current_flights_close_all_text); ?></a></td>';
        else
            o += '<td align="left" id="_hs"><a href="#" onclick="showNestedScheduled(true);"><? echo($current_flights_open_all_text); ?></a></td>';

        //The form below allows a user to select a number of days to see worth of flights
        o += '<td align="left" colspan="6"><form name="ScheduleViewDaysForm" method="POST" action="' + php_Self + '?window=queue&SO=' + SO + '&ScheduleViewDays=' + scheduleViewDays + '"><? echo($current_flights_show_text); ?>';
        o += '<select name="ScheduleViewDays" id="ScheduleViewDays" size="1" onchange="updateScheduled();">';

        if(scheduleViewDays == 0)
            o += '<option value="0" selected="selected">Infinite</option>';
        else
            o += '<option value="0"><? echo($current_flights_infinite_text); ?></option>';
        if (scheduleViewDays==1)
            o += '<option value="1" selected="selected">1</option>';
        else
            o += '<option value="1">1</option>';
        if (scheduleViewDays==2)
            o += '<option value="2" selected="selected">2</option>';
        else
            o += '<option value="2">2</option>';
        if (scheduleViewDays==3)
            o += '<option value="3" selected="selected">3</option>';
        else
            o += '<option value="3">3</option>';
        if (scheduleViewDays==4)
            o += '<option value="4" selected="selected">4</option>';
        else
            o += '<option value="4">4</option>';
        if (scheduleViewDays==5)
            o += '<option value="5" selected="selected">5</option>';
        else
            o += '<option value="5">5</option>';
        if (scheduleViewDays==6)
            o += '<option value="6" selected="selected">6</option>';
        else
            o += '<option value="6">6</option>';
        if (scheduleViewDays==7)
            o += '<option value="7" selected="selected">7</option>';
        else
            o += '<option value="7">7</option>';
        if (scheduleViewDays==8)
            o += '<option value="8" selected="selected">8</option>';
        else
            o += '<option value="8">8</option>';
        if (scheduleViewDays==9)
            o += '<option value="9" selected="selected">9</option>';
        else
            o += '<option value="9">9</option>';
        if (scheduleViewDays==10)
            o += '<option value="10" selected="selected">10</option>';
        else
            o += '<option value="10">10</option>';
        o += '</select><? echo($current_flights_days_text); ?>';
        o += '</form>';
        o += '</td>';
        o += '</tr>';
        o += '</table>';
   
        o += '<table border="0" width="100%" style="border-collapse: collapse; border-color: #f0f0f0;" id="scheduledflights_2">';
        o += '<tr>';
        o += '    <th width="300"><b><? echo($current_flights_reg_text); ?></b></th>';
        o += '    <th width="300"><b><? echo($current_flights_flight_number_text); ?></b></th>';
        o += '    <th width="300"><b><? echo($current_flights_from_text); ?></b></th>';
        o += '    <th width="300"><b><? echo($current_flights_at_text); ?></b></th>';
        o += '    <th width="300"><b><? echo($current_flights_to_text); ?></b></th>';
        o += '    <th width="300"><b><? echo($current_flights_at_text); ?></b></th>';
        o += '    <th width="300"><b><? echo($current_flights_bay_text); ?>Bay</b></th>';
        o += '</tr>';

 

        if (scheduledFlightData.length == 0)
        {
            o += '<tr><td align="centered" colspan="7"><? echo($current_flights_no_flights_scheduled_text); ?></td><td colspan="5">&nbsp;</td></tr>';
        }
        else
        {
            var aircraftID_old = '';

            $.each(scheduledFlightData, function (key, value)
            {
                if(aircraftID_old != value.AircraftID) 
                {
                    o += '<tr><td align="left" style="cursor:pointer" onClick="ShowFlights(event,' + value.AircraftID + ')"><b>' + value.AircraftID + '</b></td>';
                }
                else
                {
                    if (scheduleExpanded)
                    { 
                        o += '<tr id="' + value.AircraftID + key + '_div" class="hs"><td>&nbsp;</td>';
                    }  
                    else
                    {
                        o += '<tr id="' + value.AircraftID + key + '_div" class="hs" style="display:none"><td>&nbsp;</td>';
                    }              
                }
            
                o += '<td>' + value.FlightID + '</td>';
                o += '<td>' + value.DeparturePoint + '</td>';
                o += '<td>' + value.ScheduledDeparture + '</td>';
                o += '<td>' + value.ArrivalPoint + '</td>';
                o += '<td>' + value.ScheduledArrival  + '</td>';
                o += '<td>' + value.BayNumber + '</td>';
                o += '</tr>';
                aircraftID_old = value.AircraftID;
            });
        }

        o += '<tr id="scheduledFlightRows"></tr>';
        o += '</table>';
        // Update 'Scheduled' element
        $('#scheduled').html(o);
}

Open in new window

0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
fiboCommented:
Not sure what you expect from moving this dropdown list from php(on the server) to javascript (on the client)

In both cases your list will be populated on the server by php...
0
 
Michel PlungjanIT ExpertCommented:
Any errors in the console?

Does the url to the php work on its own (look in Chrome network tab)

BTW the code is not using jQuery to it's fullest. It is not optimal.
0
 
Michel PlungjanIT ExpertCommented:
This snippet can replace your ifs


   o += '<option value="0" selected="selected">Infinite</option>';
   if (scheduleViewDays >0)  for (var i=1;i<=10;i++) {    
            var sel = i==scheduleViewDays?' selected="selected"':"";
            o += '<option value="'+i+'" '+sel+'>'+i+'</option>';
      }
   }
0
 
ccbergmanAuthor Commented:
Thanks.  I will implement the code snippet to replace ifs,
and check on the url.
How can I optimize JQuery?
Thanks so much again.
0
 
Michel PlungjanIT ExpertCommented:
Use $("#scheduled").append instead of that o += for example
0
 
ccbergmanAuthor Commented:
Oh.  Ok.  :)
0
 
Guy Hengel [angelIII / a3]Billing EngineerCommented:
I've requested that this question be deleted for the following reason:

Not enough information to confirm an answer.
0
 
Michel PlungjanIT ExpertCommented:
0
All Courses

From novice to tech pro — start learning today.