Загрузка данных через прокрутку

Question

Загрузка данных через прокрутку

0

У меня есть веб-страница, которая показывает табличные данные,
и я хотел бы знать, как загрузить данные с помощью прокрутки вниз, в стиле facebook.
Например, загружая 50 строк, а когда вы прокручиваете до конца, загрузите еще 50.
Я не знаю, как задать вопрос, иначе я бы искал вопрос с ответом "возможно, уже где-то", но я не знаю, нужно ли мне использовать php, javascript или что. Может ли annione дать мне какие-нибудь указания по этому вопросу?
Это страница, о которой идет речь:

<html>
<head>
<script type="text/javascript" >
function test(id)
        {
            window.open("../remover/removeemail.php?id=" +     id,'Favourites','menubar,resizable,width=400,height=200');
        }
        function test2(id)
        {
            window.location = ("../editar/editaemail.php?id=" + id);
        }
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<?php
mysql_connect("localhost","root","") or die("problema na conexao");
mysql_select_db("trabalho1");
    $query = "SELECT COUNT(id) FROM email";
    $results = mysql_query($query) or die(mysql_error());
            while ($row = mysql_fetch_assoc($results)) {
                foreach ($row as $campo=>$valor) {
                    if($campo=="COUNT(id)") 
                    {
                    $maxemail = $valor;
                    }                   
                                             }                          
                                                        }                   
$query = "SELECT * FROM email GROUP BY id ORDER BY nome";
$results = mysql_query($query) or die(mysql_error());   
            echo"<center>";
            echo "<table border='2'>\n";
            echo"<form>";
            echo"<tr><td colspan='3'>Numero de Emails Registrados: ".$maxemail. "</td><td colspan='3'><a align='left' href='../filtrar/filtroemail.php'>Filtrar Resultados</a>        <a align='right' href='../inserir/inseriremail.html'>Adicionar Email</a></td</tr>";
            echo "<tr align='center'><td>Data de Criação</td><td>Nome</td><td>Email</td><td>Data da ultima Actualização</td><td>Remover</td><td>Actualizar</td></tr>";
            while ($row = mysql_fetch_array($results)) {    

                                echo "<tr align='center'>\n";
                                echo "<td><b></b>".$row['datahora']. "</td>";       

                                echo "<td><b></b>".$row['nome']. "</td>";

                                echo "<td><b></b>".$row['email']. "</td>";

                                echo "<td><b></b>".$row['dataactual']. "</td>";


                                echo "<td><input name='eliminar' type='button' onClick='test(".$row['id'].")' value='Remover'></td>";
                                echo "<td><input name='editar' type='button' onClick='test2(".$row['id'].")' value='Actualizar'></td>";


                echo "</form>\n";
                                                            }
                echo "</table>\n";
                echo"</center>";
?>
</body>
</html>

Heatmanofurioso 21 апр. 2014, в 15:19

Источник

Теги:

php

html

2 ответа

1

Вы можете использовать плагин типа JQuery Infinite scroll.

Бесконечная прокрутка

Вот демо.

Бесконечная демонстрация прокрутки

Jay Bhatt 21 апр. 2014, в 11:24

0

Спасибо, но вы также можете сказать мне альтернативу, которая будет зависеть от простого кодирования? Это для проекта, который я делаю для школы, и я думаю, чем больше мы делаем сами и чем меньше зависим от плагинов, тем лучше. В любом случае, я отмечу ваш ответ как принятый, так как он действительно ответил на мой вопрос. Но можете ли вы рассказать мне о чем-то еще? Через сам кодирование желательно
Heatmanofurioso 21 апр. 2014, в 12:56
0

@Heatmanofurioso Я согласен, что чем больше у вас контроля над вашим кодом, тем лучше. Но нет смысла изобретать велосипед. Вы можете использовать этот плагин безопасно. Я использовал это во многих моих собственных проектах. Он гибкий и может быть легко удлинен.
Jay Bhatt 21 апр. 2014, в 13:00
0

Правда. Спасибо вам большое! Я приму ваш ответ через 5 минут
Heatmanofurioso 21 апр. 2014, в 13:01

Показать ещё 1 комментарий

Ещё вопросы

Спасибо, но вы также можете сказать мне альтернативу, которая будет зависеть от простого кодирования? Это для проекта, который я делаю для школы, и я думаю, чем больше мы делаем сами и чем меньше зависим от плагинов, тем лучше. В любом случае, я отмечу ваш ответ как принятый, так как он действительно ответил на мой вопрос. Но можете ли вы рассказать мне о чем-то еще? Через сам кодирование желательно
@Heatmanofurioso Я согласен, что чем больше у вас контроля над вашим кодом, тем лучше. Но нет смысла изобретать велосипед. Вы можете использовать этот плагин безопасно. Я использовал это во многих моих собственных проектах. Он гибкий и может быть легко удлинен.
Правда. Спасибо вам большое! Я приму ваш ответ через 5 минут

dogiordano · Accepted Answer · 2014-04-21T15-23-00.000Z

Вы должны использовать как javascript, так и php.

Я дам вам несколько указателей, потому что вы сказали, что не можете использовать библиотеки.

Создайте div, содержащий таблицу
Дайте div фиксированную высоту и установите ее прокручиваемую вертикально (css)
Привязать слушателя к событию onscroll (javascript)
В слушателе вы проверяете, достигли ли прокрутки дна, и если да, вы должны сделать ajax-вызов для php файла (javascript делает вызов в php файл и возвращает результат без перезагрузки страницы)
Обратитесь к базе данных и возвратите данные (php)
Добавьте новые данные в таблицу (javascript)

Ajax звонки ОЧЕНЬ ЛЕГКО реализовать с помощью jQuery, но сложнее (если кросс-браузер) без него.

Вы можете найти учебник здесь.

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

Просто прочитайте ваш ответ, большое спасибо. Я проверю это сегодня, если мне понадобится помощь, я позвоню. Спасибо!