为长时间运行的PHP进程整合jquery UI进度条

时间:2014-11-07 15:18:33

标签: php twitter-bootstrap jquery-ui

我正在研究聊天记录管理器 - 我想要更多地控制Thunderbird的聊天记录档案。有一个同步功能,基本上解析日志文件并将消息上传到数据库,压缩日志并将它们存储在存档文件夹中。

这个过程需要很长时间才能运行,我想显示一个进度条。我正在使用jQueryUI和Bootstrap - 因此可以使用其中任何一种的解决方案。

到目前为止,我尝试过这两种方法都无济于事。进度条没有显示,我无法判断它是否正在递增。

我已粘贴到目前为止我已经获得的代码。任何帮助将不胜感激...我有CSS的基本知识,我对javascript的知识充其量是有限的。

HTML Head

<script>
    function UpdatePBar(x){
        $( "#progressbar" ).progressbar( "value", x );}
</script>

HTML正文

<div id="progressbar"></div>

同步过程PHP

if(count($this->Contacts) > 0)
        {
            //GET CONTACTS ALIASES
            $result = $this->GetContacts_aliases($folderPath);
            if($result) {
                echo '<script>UpdatePBar(10)</script>';
                flush();
                //SYNCH CONTACTS
                $result = $this->synch_Contacts();
                echo '<script>UpdatePBar(20)</script>';
                flush();
                if ($result) {
                    //SYNCH MESSAGES
                    $result = $this->synch_Messages($folderPath);
                    echo '<script>UpdatePBar(50)</script>';
                    flush();
                    if ($result) {
                        //SYNCHING SUCCESSFULLY COMPLETED
                        $log = "Synching of Messages Complete without errors. <br><br>";
                        $this->log = $this->log . $log;

                        //UPDATE LAST SYNCHED
                        $result = $this->UpdateLastSynched();
                        echo '<script>UpdatePBar(70)</script>';
                        flush();
                        if (!$result) {
                            //Update lastSynched failed
                            $log = "Updating lastSynched failed! <br><br>";
                            $this->log .= $log;
                        } else {
                            $log = "Updated Last Synched date stamp without errors <br><br>";
                            $this->log .= $log;

                            //ARCHIVE LOGS
                            $result = $this->ArchiveLogs($folderPath);
                            echo '<script>UpdatePBar(100)</script>';
                            flush();
                            if ($result) {
                                $log = "Archiving of log files successful!<br><br>";
                                $this->log .= $log;
                            } else {
                                $log = "Archiving of log files unsuccessful.<br><br>";
                                $this->log .= $log;
                            }

                        }
                    } else { 
...

感谢您的时间

1 个答案:

答案 0 :(得分:0)

我认为你应该通过递归的ajax调用来做到这一点。

在php上创建一个返回百分比的文件;

Example: getPercentage.php 
<?
//do your stuff

echo $PERCENTAGE;
?>

Then on jquery:

<script>
readPHP();

function readPHP () {
   var file="getPercentage.php";

    $.ajax({
        url: file,
        cache: false,
        success: function (data , status ) {
         percentage=data;
         if (percentage < 100)
         {
           $("#progressbar").progressbar({
               value:percentage
           })
           setTimeout(readPHP(),1000);
         }
         else
         {
           $("#progressbar").progressbar({
               value:percentage
           })

         }
        }
   })
}
</script>