Как включить древовидную структуру на странице php?

У меня есть база данных mysql. В таблице у меня есть некоторые записи загруженного файла. Я хочу показать это на php-странице. Но эти файлы классифицируются по одному столбцу. Поэтому я хочу, чтобы на этой странице было названо эти категории. Перед каждым именем я хочу иметь кнопку. Первоначально при загрузке страницы он не должен показывать файлы. когда кто-то нажимает на кнопку, тогда соответствующая категория должна расширяться. Но я не могу это сделать. Я даю вам ссылку на образец кода. HTML кодКак включить древовидную структуру на странице php?

<span class="show"></span> 
<p>category</p> 
<table width='100%' class='tree'> 
    <tr> 
     <td width='70%'><b>Name</b></td> 
     <td width='30%'><b>Last Updated</b></td> 
    </tr> 
</table>

http://jsfiddle.net/SumitRathore/FqcSM/

Редактировать

это мой пример HTML-код, где я показываю таблицы. Этот код имеет несколько имен переменных, а sql-запрос не подходит для этого. Я нашел ответ здесь http://jsfiddle.net/JGLaa/2/, но это не работает здесь. Я не знаю почему?

<span class="show"></span> 
    <p><b>category<b></p><br/> 
    <table width='100%' class='tree'> 
    <tr> 
    <td width='35%'><b>Name</b></td> 
    <td width='25%'><b>Last Updated</b></td> 
    </tr> 
    while($row = $result_sql->fetch_assoc()) 
    { 
     <tr> 
    <td width='50%'><a href='http://127.0.0.1/wordpress/?page_id=464&name_file={$row['name']}&cat={$cat}&sec={$sec}' target='_blank'>{$row['title']}</a></td> 
     <td width='25%'>{$row['created']}</td> 
     <td width='25%'><input type='checkbox' class='checkbox'><input type='button' class= 'input1 input_box' value='delete' name='delete' id= '{$row['id']}'><input type='button' class='input2 input_box2' value='edit' name='edit' id= '{$row['id']}'></td>           
    </tr> 

    } 
    </table>

источник

2013-11-29 Sumit Rathore

Ваш вопрос в том, что .next() поиски братья и сестры, поэтому он не находит table. Попробуйте обход до кнопок родителя (span), а затем найти пролет в родственном столе -

$(this).parent().nextAll('table:first').find('td').toggle();

обновленного JSFiddle - http://jsfiddle.net/JGLaa/1/

здесь обновленный JSFiddle, который имеет несколько кнопок/столов - http://jsfiddle.net/JGLaa/2/

источник

2013-11-29 05:34:02 Sean

это правильно спасибо –

Можете ли вы снова просмотреть отредактированную часть –

, так как вы говорите, что игнорируете имена переменных и sql-запрос, можете ли вы опубликовать образец выводимого HTML-кода, а не код php – Sean

$(document).ready(function(){ 
$(".show").html("<input type='button' value='Show All' class='treebtn'>"); 
    $('.tree').hide(); 
    $('.treebtn ').on('click', function() { 
     $(this).parent('span').next('table').toggle(); 

    if (this.value=="Show All") this.value = "Hide All"; 
    else this.value = "Show All"; 

    }); 
});

fiddle

источник

2013-11-29 05:15:23

спасибо за ответ, но у меня более одной категории на одной странице. и ваше решение не дает правильного результата, см. эту скрипту. –

http://jsfiddle.net/SumitRathore/FqcSM/4/ –

http://jsfiddle.net/FqcSM/5/ проверить эту скрипту –

Глядя на вас закодировать использование следующего селектора является некорректной. От Jquery.com:

.next ([селектор])
Описание: Получить сразу после родственной каждого элемента в наборе соответствующих элементов. Если предусмотрен селектор, он получает следующий брат, только если он соответствует этому селектору.

Я хотел бы предложить sourround свою кнопку и таблицу с DIV и использовать следующий код:

$(document).ready(function(){ 
$(".show").html("<input type='button' value='Show All' class='treebtn'>"); 
    $('.tree td').hide(); 
    $('.treebtn ').click(function() { 
     $(this).parent().parent().find('table td').toggle(); 
     if (this.value=="Show All") this.value = "Hide All"; 
     else this.value = "Show All"; 
    }); 
});

http://jsfiddle.net/FqcSM/3/

источник

2013-11-29 05:33:41

Как включить древовидную структуру на странице php?

ответ

Смежные вопросы