jQuery less/phcc foreach에 설정된 버튼

Question

for each의 각 게시물을 표시하고 싶습니다. 내 조건은 1st show 5 post이고 다른 게시물을 숨기려면 show more 버튼을 루프에 5 개 이상의 게시물이있는 경우 다음을 클릭하면 다른 게시물을 표시하고 show more 버튼을 숨기고 less more 버튼을 표시합니다. 게시물이 적 으면 5가 표시되고 show more 버튼이 표시되지 않습니다. jQuery로 어떻게 할 수 있습니까?

<?php 
     foreach ($hotel_data as $key => $hoteldata) 
    { 
     //Show 3 lowest price of hotel link 
     if(isset($hoteldata[0]->rooms)){ 
      /*$ii = 0;*/ 
      foreach ($hoteldata[0]->rooms as $key => $bookinginfo) { 
       ?> 
       <tr> 
       <td class=""> 
        <div class="hotel_name"> 
         <?php echo $bookinginfo->desc; ?> 
        </div> 
       </td> 


       <td class="booking-img"> 
        <img src="http://pics.avs.io/hl_gates/100/30/<?php echo $bookinginfo->agencyId; ?>.png"/> 
       </td> 
       <td> 
        <div class="hotel-price"> 
         Price : $ <?php echo $bookinginfo->price; ?> 
        </div> 
       </td> 
       <td class="booking-url"> 
        <a href="<?php echo $bookinginfo->fullBookingURL; ?>" class="btn btn-info" role="button" data-toggle="tooltip" data-placement="top" title="<?php echo $bookinginfo->agencyName; ?>"> BOOK NOW</a> 
       </td> 
       </tr> 
       <?php 
       /*$ii++; 
       if($ii > 2){ 
        break; 
       }*/ 
      } 
     } 
    } 
?> 

Answer 1

전략을 다시 생각해 봐야합니다. 원하는 것은 AJAX 호출로 가장 잘 수행 할 수 있습니다. 따라서 JS/jQuery로 루프를 작성해야한다. PHP는 게시물 검색 만 처리합니다.

예를 들어 PHP 스크립트에 POST 요청을 보내어 원하는 게시물 수를 보내는 AJAX 호출을 만들 수 있습니다. PHP는 요청을 받으면 DB에서 필요한 게시물을 가져와 결과를 JSON 형식으로 다시 보내면 JS는 그 결과를 HTML로 구문 분석합니다.

AJAX 호출은 페이지로드 (처음 5 개로드)에서 한 번 호출 할 수 있으며, "추가로드"버튼을 클릭하면 다시 호출 할 수 있습니다.

Answer 2

5 이상인 경우 배열 수를 표시하고 "더보기"버튼을 표시합니다. 예를 들어 아래를 참조하십시오 :

<?php 
    // Get count 
    $count = count($hotel_data); 
    foreach ($hotel_data as $key => $hoteldata) { 
     //Show 3 lowest price of hotel link 
     if(isset($hoteldata[0]->rooms)) { 
      /*$ii = 0;*/ 
      foreach ($hoteldata[0]->rooms as $key => $bookinginfo) { 
       ?> 
       <tr> 
        <td class=""> 
         <div class="hotel_name"> 
          <?php echo $bookinginfo->desc; ?> 
         </div> 
        </td> 


        <td class="booking-img"> 
         <img src="http://pics.avs.io/hl_gates/100/30/<?php echo $bookinginfo->agencyId; ?>.png"/> 
        </td> 
        <td> 
         <div class="hotel-price"> 
          Price : $ <?php echo $bookinginfo->price; ?> 
         </div> 
        </td> 
        <td class="booking-url"> 
         <a href="<?php echo $bookinginfo->fullBookingURL; ?>" class="btn btn-info" role="button" data-toggle="tooltip" data-placement="top" title="<?php echo $bookinginfo->agencyName; ?>"> BOOK NOW</a> 
        </td> 
       </tr> 
       <?php 
      } 
     } 

     if ($count>5) { 
      // Code for "show more" button 
     } 
    } 
?> 

그런 다음 당신이 어떤 CSS 클래스의 스타일 속성 display: none;에 의해 다른 게시물을 숨길 수 있습니다. jQuery 코드의 경우 더 많은 버튼 표시에 스크립트를 만들고 숨긴 다른 게시물의 속성을 변경해야합니다. 또한 버튼 텍스트를 "더 적게 표시"로 변경하십시오.