关于遍历

Foxtable的所有集合,包括常用的DataTables、DataRows、DataCols、Tables、Rows、Cols等等,并不支持js的原生遍历语法。

所以在前端js代码中,只能用索引形式遍历Foxtable中的各种集合。

示例一

本示例可参考示例文件"CaseStudy\WebViewer\调用Foxtable对象.Table"的窗口"遍历基础"。

假定我们要在前端用js代码通过遍历订单表的所有行来累计总的订购数量:



AfterLoad事件代码如下:

'''Async
Dim wv As WebViewer = e.Form.Controls("WebViewer1").WebViewer
Await wv.EnsureCoreWebView2Async(Nothing) '初始化浏览器
wv.CoreWebView2.AddHostObjectToScript(
"Orders", DataTables("订单")) '注入订单表
'
定义测试页面
Dim
html As String =<![CDATA[
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>
遍历DataRows</title>
    <style>
        *{font-size:16px; margin:5px;}
        button{padding:12px 40px; font-size:18px; margin:30px 5px; cursor:pointer;background:#5cb85c;color:#fff;border:none;border-radius:6px;}
    </style>
</head>
<body>
    <h3>
遍历DataRows</h3>
    <button onclick="calcTotalQty()">
统计总的订购数量</button>
    <script>
        const Orders = window.chrome.webview.hostObjects
.sync.Orders; // 获得DataTables("订单")
        async function calcTotalQty() {
            let total = 0;
            const dataRows =  Orders.DataRows;
// 核心, 先获得DataRows,不要在循环过程中反复获取
            const rowCount =  dataRows.Count;
/
/ 核心, 先获得总行数
            //
通过索引遍历
            for(let i = 0; i < rowCount; i++){
                const dr =  dataRows[i];
                const qty =  dr["
数量"];
                total += qty;
            }
            alert("
总订购数量:" + total);
        }
    </script>
</body>
</html>
]]>
.Value
wv.NavigateToString(html)
'打开测试页面

注意有红色注释的两行代码,要点就是在遍历开始之前,先获得行集合和总行数,并存储在局部变量中,避免在遍历过程中取反复获取而影响效率,因为每一次获取,就是对Foxtable的一次调用。

示例二

遍历Foxtable中的所有集合类型,包括常用的表、行和列,都应该遵循上述要点。

例如希望通过遍历Rows,将数量超过500订的订单的折扣设置为0.2,AfterLoad事件代码如下:

'''Async
Dim wv As WebViewer = e.Form.Controls("WebViewer1").WebViewer
Await wv.EnsureCoreWebView2Async(Nothing) '初始化浏览器
wv.CoreWebView2.AddHostObjectToScript(
"Orders", Tables("订单")) '注入订单表
'
定义测试页面
Dim
html As String = <![CDATA[
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>
遍历DataRows修改折扣</title>
    <style>
        *{font-size:16px; margin:5px;}
        button{padding:12px 40px; font-size:18px; margin:30px 5px; cursor:pointer;background:#5cb85c;color:#fff;border:none;border-radius:6px;}
    </style>
</head>
<body>
    <h3>
批量设置折扣</h3>
    <button onclick="setDiscount()">
数量≥500,折扣统一设为0.2</button>
    <script>
        const Orders = window.chrome.webview.hostObjects.sync.Orders; //
获取Tables("订单")
        async function setDiscount() {
            let totalUpdate = 0;
            const rows =  Orders.Rows; //
核心,先获取Rows
            const rowCount =  rows.Count; //
核心,先获取总行数
            for(let i = 0; i < rowCount; i++){
                const dr = rows[i]; //
获取行
                const qty = dr["
数量"]; // 获取数量
                if(qty >= 500){ //
如果符合条件
                    dr["
折扣"] = 0.2; // 设置折扣
                    totalUpdate++;
                }
            }
            //
弹窗提示执行结果
            alert(`
批量修改完成!共扫描 ${rowCount} 行数据,其中 ${totalUpdate} 行数量≥500,已设置折扣为0.2`);
        }
    </script>
</body>
</html>
]]>
.Value
wv.NavigateToString(html)
'加载页面

提示:

当然我这里是为了演示遍历的用法,如果你要批量修改,直接在JS调用DataTale的ReplaceFor方法,一行代码即可搞定:

async function
setDiscount(){
    Orders.DataTable.ReplaceFor("折扣", 0.2, "[数量] >= 500");
}


示例三


如果你要遍历部分列,可以用js原生的遍历语法了,参考代码:

'''Async
Dim wv As WebViewer = e.Form.Controls("WebViewer1").WebViewer
Await wv.EnsureCoreWebView2Async(Nothing) '初始化浏览器
wv.CoreWebView2.AddHostObjectToScript(
"Orders", Tables("订单"))
'
定义测试页面
Dim
html As String = <![CDATA[
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>
遍历部分列</title>
    <style>
        *{font-size:16px; margin:5px;}
        button{padding:12px 40px; font-size:18px; margin:30px 5px; cursor:pointer;background:#5cb85c;color:#fff;border:none;border-radius:6px;}
    </style>
</head>
<body>
    <button onclick="toggleSpecCols()">
遍历部分列</button>
    <script>
        const Orders = window.chrome.webview.hostObjects.sync.Orders;
        async function toggleSpecCols() {
            const nms = ["
产品", "折扣", "数量"];
            for(let nm of nms){
                const dc = Orders.Cols[nm];
                dc.AllowEdit = !dc.AllowEdit;
            }
        }
    </script>
</body>
</html>
]]>
.Value
wv.NavigateToString(html)
'加载页面


本页地址:http://www.foxtable.com/webhelp/topics/6235.htm