从数据库中查找数据绑定到datalist中
   在绑定之前先显示一个图片,当从数据库中查询完数据之后,
   显示数据,把图片隐藏掉。如何实现数据加载完后显示数据,隐藏图片
   要真的效果,不要糊弄人的那种(隔几秒钟就显示数据的那人),要根据查询的进度显示

解决方案 »

  1.   

    这个..  有点晕,哈哈.就像 adobe ps启动时,显示正在加载什么,正在检测什么的提示一样.
    或者 progressbar 类似的功能.
    b/s实现,有难度,能实现也是模拟的.
      

  2.   

    我在网上找到个这个,大虾们帮看看可不可以实现,可以的话帮我弄成.net的
       另外谁有一些用ajax做的一些动态效果或网站告诉小弟下, 我想学习学习, 谢谢在代码清单4-9所示的例子中,再次在pollCallback()方法中使用了setTimeout(),从而每隔2秒调用一次服务器。在processResult()方法中,只是从服务器查找已完成比例(百分数)的第一位数字,从而得出要将进度条中的哪些进度块着色(灰色)。
    代码清单4-9  progressBar.html
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
     
    <html>
      <head>
        <title>Ajax Progress Bar</title>
        <script type="text/javascript">
            var xmlHttp;
            var key;
            var bar_color = 'gray';
            var span_id = "block";
            var clear = "&nbsp;&nbsp;&nbsp;"
     
            function createXMLHttpRequest() {
                if (window.ActiveXObject) {
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                }
                else if (window.XMLHttpRequest) {
                    xmlHttp = new XMLHttpRequest();
                }
            }
     
            function go() {
                createXMLHttpRequest();
                checkDiv();
                var url = "ProgressBarServlet?task=create";
                var button = document.getElementById("go");
                button.disabled = true;
                xmlHttp.open("GET", url, true);
                xmlHttp.onreadystatechange = goCallback;
                xmlHttp.send(null);
            }
     
            function goCallback() {
                if (xmlHttp.readyState == 4) {
                    if (xmlHttp.status == 200) {
                        setTimeout("pollServer()", 2000);
                    }
                }
            }
     
            function pollServer() {
                createXMLHttpRequest();
                var url = "ProgressBarServlet?task=poll&key=" + key;
                xmlHttp.open("GET", url, true);
                xmlHttp.onreadystatechange = pollCallback;
                xmlHttp.send(null);
            }
     
            function pollCallback() {
                if (xmlHttp.readyState == 4) {
                    if (xmlHttp.status == 200) {
                        var percent_complete =
                               xmlHttp.responseXML
                                   .getElementsByTagName("percent")[0].firstChild.data;
     
                        var index = processResult(percent_complete);
                        for (var i = 1; i <= index; i++) {
                            var elem = document.getElementById("block" + i);
                            elem.innerHTML = clear;
     
                            elem.style.backgroundColor = bar_color;
                            var next_cell = i + 1;
                            if (next_cell > index && next_cell <= 9) {
                                document.getElementById("block" + next_cell)
                                      .innerHTML =
                                            percent_complete + "%";
                            }
                        }
                        if (index < 9) {
                            setTimeout("pollServer()", 2000);
                        } else {
                            document.getElementById("complete").innerHTML = "Complete!";
                            document.getElementById("go").disabled = false;
                        }
                    }
                }
            }
     
            function processResult(percent_complete) {
                var ind;
                if (percent_complete.length == 1) {
                    ind = 1;
                } else if (percent_complete.length == 2) {
                    ind = percent_complete.substring(0, 1);
                } else {
                    ind = 9;
                }
                return ind;
            }
     
            function checkDiv() {
                var progress_bar = document.getElementById("progressBar");
                if (progress_bar.style.visibility == "visible") {
                    clearBar();
                    document.getElementById("complete").innerHTML = "";
                } else {
                    progress_bar.style.visibility = "visible"
                }
            }
     
            function clearBar() {
                for (var i = 1; i < 10; i++) {
                    var elem = document.getElementById("block" + i);
                    elem.innerHTML = clear;
                    elem.style.backgroundColor = "white";
                }
            }
     
        </script>
      </head>
      <body>
        <h1>Ajax Progress Bar Example</h1>
        Launch long-running process:
               <input type="button" value="Launch" id="go" onclick="go();"/>
        <p>
        <table align="center">
            <tbody>
                <tr><td>
                    <div id="progressBar"
                        style="padding:2px;border:solid black 2px;visibility:hidden">
                        <span id="block1">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block2">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block3">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block4">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block5">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block6">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block7">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block8">&nbsp;&nbsp;&nbsp;</span>
                        <span id="block9">&nbsp;&nbsp;&nbsp;</span>
                    </div>
                </td></tr>
                <tr><td align="center" id="complete"></td></tr>
            </tbody>
        </table>
      </body>
    </html>
    这个例子的服务器代码“模拟”了一个长时间运行的事务(见代码清单4-10)。在真实环境中,这期间可能还要同时创建多个新实例并注册,之前还需要客户发出请求。为简单起见,我们忽略了这点,也没有编写线程代码。
    代码清单4-10  ProgressBarServlet.java
    package ajaxbook.chap4;
     
    import java.io.*;
     
    import javax.servlet.*;
    import javax.servlet.http.*;
     
    public class ProgressBarServlet extends HttpServlet {
        private int counter = 1;
     
        /** Handles the HTTP <code>GET</code> method.
         * @param request servlet request
         * @param response servlet response
         */
        protected void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
            String task = request.getParameter("task");
            String res = "";
     
            if (task.equals("create")) {
                res = "<key>1</key>";
                counter = 1;
            }
            else {
                String percent = "";
                switch (counter) {
                    case 1: percent = "10"; break;
                    case 2: percent = "23"; break;
                    case 3: percent = "35"; break;
                    case 4: percent = "51"; break;
                    case 5: percent = "64"; break;
                    case 6: percent = "73"; break;
                    case 7: percent = "89"; break;
                    case 8: percent = "100"; break;
                }
                counter++;
     
                res = "<percent>" + percent + "</percent>";
            }
            PrintWriter out = response.getWriter();
            response.setContentType("text/xml");
            response.setHeader("Cache-Control", "no-cache");
            out.println("<response>");
            out.println(res);
            out.println("</response>");
            out.close();
        }
    }
      

  3.   

    .net绑定用ajax控件可以实现,UpdatePannel很容易实现的~~