2017-10-09 9 views
0

Webサービスからレコードを取得し、this exampleのようにdiv内にうまく表示したいとします。php Foreachは限られた時間だけ実行し、正しいdiv内にデータを挿入します

誰かが「日数」を選択すると、結果をフィルタリングする必要があります。他

<script> 
function itinerary(name) 
{ 
    var last = document.getElementById(selected); 
    selected = name; 
    var current = document.getElementById(selected); 

    last.style.display = "none"; 
    current.style.display = ""; 

    document.getElementById("selectItinerary").blur(); 
    } 
</script> 
<?php 
    ini_set("display_errors", 1); 

    $days = "http://services.gerbertours.com/tours.asmx/Days?type=2&cityID=1146"; 
    $ch1 = curl_init($days); 
    curl_setopt($ch1, CURLOPT_HEADER, 0); 
    curl_setopt($ch1, CURLOPT_BINARYTRANSFER, 1); 
    curl_setopt($ch1, CURLOPT_RETURNTRANSFER, 1);  // make sure we get the response back 
    $xml1 = curl_exec($ch1);  // execute the post 
    curl_close($ch1);    // close our session 
    $var1 = simplexml_load_string($xml1); 
    $configData1 = json_decode($var1, true); 

    $days = 0; 
    foreach ($configData1 as $key=>$val) { 
     if ($val > $days) { 
      $days = $val; 
     } 
    } 
    //echo $days; 

    //$days = "http://services.gerbertours.com/tours.asmx/Days?type=2&cityID=1146"; 
    $url = "http://services.gerbertours.com/tours.asmx/Sample?type=2&CityID=1146&days=$days"; 
    $ch = curl_init($url); 
    curl_setopt($ch, CURLOPT_HEADER, 0); 
    curl_setopt($ch, CURLOPT_BINARYTRANSFER, 1); 
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);  // make sure we get the response back 
    $xml = curl_exec($ch);  // execute the post 
    curl_close($ch);    // close our session 
    $var = simplexml_load_string($xml); 

    $configData = json_decode($var, true); 

echo '<pre>'; 
print_r($configData); 
echo '</pre>'; 

foreach ($configData as $row) { 
    echo 'Day:' . $row['Day'].'<br>'; 
    echo 'Time:' .$row['Time'].'<br>'; 
    echo 'Description:' .$row['Description'].'<br>'; 
} 

?> 
    <select id="selectItinerary" onchange="itinerary(this.options[this.selectedIndex].value); this.blur" style="font-size:11px"> 

<?php 
    for ($day = 1; $day <= $days; $day++) { 
?> 
    <option value="<?php echo $day; ?>"><?php echo $day; ?> Day Tour</option> 
<?php 

    } 
?> 
    </select> 

<?php 
    $dayCount = 1; 
    foreach ($configData as $row) { 
     $currentDay = $row['Day']; 
     if($dayCount==$days);break; 
?> 

     <div id="<?php echo $dayCount; ?>" class="itinerary"> 
      <div class="day"> 
       <?php echo 'Day:' . $row['Day']; ?> 
      </div> 

      <div class="time"> 
       <?php echo 'Time:' .$row['Time']; ?> 
      </div> 

      <div class="description"> 
       <?php echo 'Description:' .$row['Description']; ?> 
      </div> 
     </div> 

    <?php 
     $dayCount++; 
    } 
?> 

すべてが大丈夫起こっている:これは私がこれまで持っているものである

。私がする必要があるのは、ユーザーの選択に基づいて結果をフィルタリングすることです。たとえば、「3 Day Tour」を選択すると結果の3つの項目が表示されます。それをどうすれば実現できますか?

答えて

0

あなたはjQueryのを使用していない場合は、使用して/非表示要素を表示することができます。

document.getElementById('elementId').style.display = 'block'; // to show 
document.getElementById('elementId').style.display = 'none'; 

を考えはのonchangeイベント火災は、あなたが表示したい要素を表示するときに、すべての要素を非表示にすることですが。

document.getElementById('1').style.display = 'none'; 
document.getElementById('2').style.display = 'none'; 
document.getElementById('3').style.display = 'none'; 
:だからあなたのコードでは、あなたはちょうどあなたがすべてを隠すように、あなたが必要なのdivを表示する前に非表示にする必要がある、私も前に、これらを置くところ

current.style.display = ""; 

current.style.display = "block"; 

に変更する必要があります

もちろん、大規模なプロジェクトの場合は、簡単にするためにJqueryまたは任意のJavascriptフレームワークをお勧めします。チェックアウト:Jquery dynamic hide and show for drop down menu

+0

こんにちは@aljoご回答いただきありがとうございます。現在、問題なしでJqueryの情報を更新できます。たとえば、1日目のコンテンツが1のdiv ID内に表示される場合は、データを入力する必要があります。 –

+0

あまりにも多くはない、あなたはすべての日のすべてのdivを生成することができます、そして、それらのすべてを隠すだけです。あなたのドロップダウンがonchangeを引き起こすとき、あなたは関連divを表示することができます。 –

関連する問題