Coldfusion: отображение обновленного общего количества из базы данных cfajaxproxy

Я не очень хорош в javascript, Ajax & Jquery, но мне все еще нужно закончить одну задачу. Я пытаюсь показать обновленное количество записей во время выполнения. Это будет живой отчет для управления, номер должен меняться без обновления страницы. Я пытался написать сценарий, но все равно не получилось. В Интернете нашел один скрипт jquery, я его модифицировал, но не получил желаемого результата, я получил ошибку. Я не нашел полезного примера из поиска Google. Если у вас есть вспомогательный или полезный пример, пожалуйста, поделитесь.

Это то, что я сделал до сих пор:

CFC: функция счетчика, просто запускающая один цикл, но на самом деле здесь плохо извлекаются данные из базы данных.

<cfcomponent>
<cffunction name="counter" returntype="any" access="remote" >
    <cfset var o= 1>
    <cfloop index="b" from="1" to="1000">
        <cfset o = b>
        <cfset sleep = 1000>
     </cfloop>
<cfreturn o>
</cffunction>

Файл CFM:

<cfajaxproxy cfc="async" jsclassname="asyncjs" />
<!DOCTYPE html>
<html>
  <body>
    <div id="saa"><span class="count">200</span></div>
<div style="clear:both"></div>
<div id="talkbubble"><span class="count">1421</span></div>
<br />
    <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

     <script type="text/javascript">
        var objCfc =  new asyncjs();
            objCfc.setAsyncMode();

            alert(objCfc.counter());
            $('.count').each(function () {
                var i =300;
                $(this).prop('Counter',0).animate({
                    Counter: $(this).text()
                }, {
                    duration: 4000,
                    easing: 'swing',
                    step: function () {
                        //$(this).text(Math.ceil(now)

                        $(this).text(i);
                    }
                });
            });
        </script>
  </body>
</html>

Пожалуйста, порекомендуйте...

1 ответ

Решение

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>AJAX CFM</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#noteDiv').load('content_notes.cfm?_=' +Math.random()).fadeIn("slow");
}, 1000); // refresh every 10000 milliseconds

</script>
</head>

<body>


<cfdiv id="noteDiv" bind="url:content_notes.cfm"></cfdiv>


</body>
</html>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
     <br>
      ...DIV Content - Date Time : <cfoutput> #now()# </cfoutput> 
     <br>
</body>
</html>

Другие вопросы по тегам