Сетка / Таблица вкладок не работает, есть ли альтернатива? - PullRequest
0 голосов
/ 17 мая 2019

Пытаясь создать таблицу / сетку вкладок, моя проблема заключается в том, что вкладки не отображаются, как я надеялся, и отображают каждый элемент там, где он не должен. Я взял пример из http://jsfiddle.net/DHTTWL/jmdjpge0/ и изменил его, чтобы он работал для того, что мне нужно.

Я пытался использовать таблицы div с CSS, чтобы выровнять все, но вкладка не отображается. Я пытался использовать обычные таблицы, хотя я ненавижу использовать таблицы и div. Я сделал все классы DIV разными, изменив их со счетчиком в базе данных. Запустил немного базового кода на Jfiddle, чтобы выяснить расположение, но как только я добавляю любой php, он разбивается на части.

   $count = mysqli_num_rows($result);
   $i = 1;
   echo "<table>";

   while ($row = mysqli_fetch_assoc($result)) 
   {
   ///VARIABLES///
   if($i%2==1) echo "<tr>"; 

   echo "<style> span.stext {
   font-size: 20px;
   display:table;
   margin-left: auto;
   margin-right: auto;
   text-align: center</style>";

   echo "<style>///TABLE STYLING</style>";

   echo "<tr>";
   echo "<td>";
   echo "<a href='someaddress.php?              
   stocknr=$stock'>$rvehicle</a>";
   echo "</td></tr>";

   echo "<tr><td>";
   echo "<a href='someaddress.php?stocknr=$stock'>";
   echo "<img src='$picloc' border='0' alt='' width='400' height='250'>       
   </a>";
   echo "</td></tr><tr><td>";
   echo "<div class ='$tabheader'>";

     echo "<ul>";
    echo "<li>";
   echo "<a href='#$tabone'>";
   ///QUERY///
    {
   echo $kilometers1;
    }
   echo "</a>";
   echo "</li>";
   echo "<li>";

   echo "<a href='#$tabtwo'>";
   ///QUERY////
    { 
   echo "$kilometers2";
    }
   echo "</a>";
   echo "</li>";

     echo "</ul>";
   ///TAB FOR $KILOMETERS1////

     echo "<div id='$tabheader1'>";
   echo "<div class='rTable'>";
   echo "<div class='rTableRow'>";
   echo "<div class='rTableCellimg'>";
   ////QUERY////
    {
   echo "<img src='$airconup' border='0' alt='' width='32' height='32'>";
    }
   echo "</div>";
   echo "<div class='rTableCelldesc'>";
   echo "<span class='stext'>$aircon</span>";
   echo "</div>";
   echo "<div class='rTableCellimg'>"; 
   ///QUERY////
    {
   echo "<img src='$transup' border='0' alt='' width='32' height='32'>";
    }
   echo "</div>";
   echo "<div class='rTableCelldesc'>";
   echo "<span class='stext'>$trans</span>";
   echo "</div>";
   echo "<div class='rTableCellimg'>";
   ///QUERY///
    {
   echo "<img src='$fuelup' border='0' alt='' width='32' height='32'>";
    }
   echo "</div>";
   echo "<div class='rTableCelldesc'>";
   echo "<span class='stext'>$fuel</span>";
   echo "</div>";
   echo "</div>";
   echo "<div class='rTableRow'>";
   echo "<div class='rTableCellimg'>";
   ////QUERY///
    {
   echo "<img src='$luggup' border='0' alt='' width='32' height='32'>";
    }
   echo "</div>";
   echo "<div class='rTableCelldesc'>";
   echo "<span class='stext'>$luggage</span>";
   echo "</div>";
   echo "<div class='rTableCellimg'>";
   ///QUERY/// 
    {   
   echo "<img src='$seatsup' border='0' alt='' width='32' height='32'>";
    }
   echo "</div>";
   echo "<div class='rTableCelldesc'>";
   echo "<span class='stext'>$seats</span>";
   echo "</div>";
   echo "<div class='rTableCellimg'>";
    ///QUERY///
    {
   echo "<img src='$psteerup' border='0' alt='' width='32' height='32'>";
    }
   echo "</div>";        
   echo "<div class='rTableCellimg'>";
   echo "<span class='stext'>$psteer</span>";
      echo "</div>";
   echo "</div>";
   echo "</div>";

   echo "<div id='$tabone'>";
      echo "<ul>";

   echo "<li><a href='#$tab1nt1'>";
   ///QUERY///
    {
   echo "$pricelengthn3";
    }
   echo "</a></li>";

   echo "<li><a href='#$tab1nt2'>";
   ///QUERY///
   {
   echo "$pricelengthn4";
    }
   echo "</a></li>";
   echo "<li><a href='#$tab1nt3'>";
   ///QUERY///
   {
   echo "$pricelengthn5";
    }
   echo "</a></li>";

      echo "</ul>";
      echo "<div id='$tab1nt1'>";

   echo "<div class='rTableRow'>";
   echo "<div class='rTableCell'>";
   echo "<span class='stext'>$pricelength3</span>";
       echo "</div>";
   echo "<div class='rTableCell'>";
   echo "///FORM DATA///";
   echo "</div>";


      echo "<div id='$tab1nt2'>";

   echo "<div class='rTableCell'>";
   echo "<span class='stext'>$pricelength4</span>";
       echo "</div>";
   echo "<div class='rTableCell'>";
   echo "///FORM DATA///";
       echo "</div>";
   echo "</div>";


   echo "<div id='$tab1nt3'>";

   echo "<div class='rTableCell'>";
   echo "<span class='stext'>$pricelength5</span>";
       echo "</div>";
   echo "<div class='rTableCell'>";
   echo "///FORM DATA///";
     echo "</div></div></div></div>";

   ///TAB FOR $KILOMETERS2////

    echo "<div id='$tabheader2'>";

  echo "<div id='$tabtwo'>";

      echo "<ul>";

   echo "<li><a href='#$tab2nt1'>";
   ///QUERY/// {        
   echo "$pricelengthn3";
    }
   echo "</a></li>";
   echo "<li><a href='#$tab2nt2'>";
   ///QUERY///{
   echo "$pricelengthn4";
    }
   echo "</a></li>";
   echo "<li><a href='#$tab2nt3'>";
   //QUERY//{
   echo "$pricelengthn5";
    }
   echo "</a></li>";

      echo "</ul>";
      echo "<div id='$tab2nt1'>";
   echo "<div class='rTableRow'>";
   echo "<div class='rTableCell'>";
   echo "<span class='stext'>$pricelength3</span>";
       echo "</div>";
   echo "<div class='rTableCell'>";
   echo "///FORM DATA///";

       echo "</div></div></div>";

   echo "<div id='$tab2nt2'>";
   echo "<div class='rTableRow'>";
   echo "<div class='rTableCell'>";
   echo "$pricelength4";
echo "</div>";
   echo "<div class='rTableCell'>";
   echo "///FORM DATA//";
echo "</div>";
   echo "</div>";
   echo "</div>";

      echo "<div id='$tab2nt3'>";
      echo "<div class='rTableRow'>";
   echo "<div class='rTableCell'>";
   echo "<span class='stext'>$pricelength5</span>";
echo "</div>";
   echo "<div class='rTableCell'>";
   echo "///FORM DATA///";
echo "</div>";
   echo "</div>";    

   echo "</div>";
   echo "</div>";    
   echo "</div>";
   echo "</div>";    

   echo "</td>";

     if($i%2==0 || $i == $count) echo "</tr>";

       $i++;
   echo "<script>
   $(function() {
       $( '#$tabheader' ).tabs();
       $( '#$tabone' ).tabs();
       $( '#$tabtwo' ).tabs();
   });
   </script>";           
   }

        echo "</table>";

    // filling row with empty cells 

   while ($row = mysqli_fetch_array($result))
   {
       $count = mysqli_num_rows($result);
       for ($i = 1; $i <= $count; $i++)
       {

       if(($i - 1) % 2 != 0) 
       {
        echo "<td></td>";
       }
        $i++;

       // for 4th, 8th, 12th etc record insert a tag for end of the row
       if (($i - 1) % 2 == 0) 
       {
    echo "</tr>";
       }
       }

   }

   echo "</table>";

Согласно тому, что я испытал, существует огромная разница с тем, что появляется на http://jsfiddle.net/DHTTWL/jmdjpge0/, и тем, что появляется на моем веб-сайте. У меня были загружены две вложенные вкладки одна за другой

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...