Question

我正在.net中创建一个webform，其中有大约14个字段。我想在webform的末尾创建一个进度条，它将显示状态表格完成。如果填写的所有表格字段都显示100％正在进行中否则它会根据表格状态显示一些％。

我如何在.Net中实现这一目标。是否有任何类型的ajax扩展器为这项特殊的工作

Answer 1

您可以使用两个div，并调整内部div的大小以显示进度，如本例所示。编辑字段时，将调用“检查”功能，该功能会检查字段并更新进度条。

<html>
<head>
<script type="text/javascript">
    function check() {
        var completion = 0;
        if (document.getElementById("field1").value != "") {
            completion++;
        }
        if (document.getElementById("field2").value != "") {
            completion++;
        }
        if (document.getElementById("field3").value != "") {
            completion++;
        }
        document.getElementById("progressbar").style.width = completion*20+"px";
    }
</script>
</head>
<body>
<form action="script.aspx" method="GET">
    Name: <input type="text" id="field1" onchange="check()" /><br />
    Tel No.: <input type="text" id="field2" onchange="check()" /><br />
    Email: <input type="text" id="field3" onchange="check()" /><br />
    Completion: <div style="width: 60px; height: 10px; border: 1px solid black;">
        <div style="width: 0px; height: 10px; background-color: green;" id="progressbar">&nbsp;</div>
    </div>
    <input type="submit" />
</form>
</body>
</html>

Answer 2

请参阅以下内容：

ASP.NET ProgressBar ASP.NET ProgressBar＆amp;条形指示器 - 专业控制是一种非常有用的服务器控件，允许图形表示数值。

您可以选择“进度条”或“条形指示器”样式，也可以设置水平或垂直方向。

它支持DataBinding，因此您可以将其插入Datagrid模板列中。

此控件的安装文件会自动将控件图标添加到Visual Studio.Net的工具箱中

一个简单的教程将向您解释如何刷新进度条的值。

它很有用，很好用，非常容易使用。

ASP.NET AJAX Progress Bar Control如果你在你的网络应用程序中使用AJAX，你无疑会使用某种进度/状态指示器让用户知道某些操作当前正在执行。在我正在开发的应用程序中，我们使用动画gif。它工作得很好，但有时您可能会发现很好地控制指标 - 即通过JavaScript与其交互并使用CSS设置样式。

enter image description here

Answer 3

您可以使用jQueryUI的Progressbar control。每当文本框失去焦点时，请验证输入。如果它有效，则积极更新进度条，如果文本框为空，则负面更新进度条。

webform中的进度条

3 个答案: