DataGrid cell 驗證失敗後回到當前的cell 繼續編輯

karen

這個DataGird 的 Amount 設定了onblur 事件, 去檢查當前輸入的Amount格式是否正確

驗證失敗後, 會彈警告視窗, 但是我想讓游標回到當前的cell 讓user 修正到正確的格式為止, 該怎麼做比較好呢 ?

dforce

用表格的验证，不要在编辑器上绑onblur处理了
在oncellendedit事件里面
获取到验证未通过的单元格，再次定位进去编辑

karen

dforce 发表于 2015-6-19 10:27
用表格的验证，不要在编辑器上绑onblur处理了
在oncellendedit事件里面
获取到验证未通过的单元格，再次定 ...

用以下方式會不斷地跳出 "Amount is null" 視窗,雖然Cell為編輯狀態, 因alert視窗一直反覆地跳出來, 反而無法編輯, 要如何調整?

function onCellEndEdit(e) {
        if (e.field == "Amount") {
            if (e.value == "") {
                alert("Amount is null!");
                grdItem.beginEditCell();
            }
        }
    }

felt

karen 发表于 2015-6-22 16:22
用以下方式會不斷地跳出 "Amount is null" 視窗,雖然Cell為編輯狀態, 因alert視窗一直反覆地跳出來, 反而 ...

未发现问题，请提供示例重现

karen

Steps :
1, 輸入description 欄
2, 點Amount欄, 不輸入任何東西
3, 點Comments 欄
然後 Amount is null 視窗一直跳出, 關不掉

Table 如下
<table class="myTable" style="width: 100%;">
        <tr>
            <td>
                <div id="grdItembutton" class="mini-toolbar" style="border-bottom: 0; padding: 5px;">
                    <a class="mini-button" iconcls="icon-add" onclick="addRow()" plain="true" tooltip="增加...">new</a>
                    <a class="mini-button" iconcls="icon-remove" onclick="removeRow()" plain="true">delete</a>
                </div>
                <div id="grdItem" class="mini-datagrid" style="width: 100%; height: 120px;"
                    idfield="itemno"
                    allowresize="true" pagesize="5"
                    allowcelledit="true" allowcellselect="true" multiselect="true"
                    editnextonenterkey="true" showpager="false"
                    onCellEndEdit="onCellEndEdit" >
                    <div property="columns">
                        <div type="checkcolumn"></div>

                        <div name="ItemDesc" field="ItemDesc" headeralign="center" width="100">
                            description
                            <input property="editor" class="mini-textbox" style="width: 100%;" value="" required="true" />
                        </div>
                        <div name="Amount" field="Amount" headeralign="center"  numberFormat="#,0.00" align="right" width="100" >
                           amount
                            <input property="editor" class="mini-textbox" style="width: 100%;"  required="true" vtype="int" />
                        </div>
                        <div name="Remark" field="Remark" width="200" headeralign="center">
                            comments
                            <input id="Remark" property="editor" class="mini-textbox" style="width: 100%;" />
                        </div>
                    </div>
                </div>
            </td>
        </tr>
    </table>

JS 如下
<script type="text/javascript">
        mini.parse();
        var grdItem = mini.get("grdItem");

        //grditem add new row
        function addRow() {     
                var newRow = { name: "New Row" };
                grdItem.addRow(newRow);
                grdItem.beginEditCell(newRow, "ItemDesc");
        }
        //grditme remove row
        function removeRow() {
            var rows = grdItem.getSelecteds();
            if (rows.length > 0) {
                grdItem.removeRows(rows, true);
            }
        }

        function onCellEndEdit(e) {
            if (e.field == "Amount") {
                if (e.value == null) {
                    alert("Amount is null!");
                    grdItem.beginEditCell();
                }
            }
        }      
</script>

felt

karen 发表于 2015-6-23 10:53
Steps :
1, 輸入description 欄
2, 點Amount欄, 不輸入任何東西

1. setTimeout(function () {
   
2.                         var cell = [e.row, e.column]
   
3.                         grdItem.setCurrentCell(cell)
   
4.                         grdItem.beginEditCell();
   
5.                     },100)

复制代码

karen

felt 发表于 2015-6-23 11:05

可以了, 不過訊息視窗會跳出二個 ?

felt

karen 发表于 2015-6-23 11:41
可以了, 不過訊息視窗會跳出二個 ?

本地测试未发现弹2次

karen

felt 发表于 2015-6-23 13:24
本地测试未发现弹2次

我發現點完一個alert 視窗, comments會變編輯狀態, 再點掉第二個alert視窗, 游標跳回 Amount 編輯
稍微調整後, 就只剩下一個alert視窗了

felt

karen 发表于 2015-6-23 15:57
我發現點完一個alert 視窗, comments會變編輯狀態, 再點掉第二個alert視窗, 游標跳回 Amount 編輯
稍微調 ...

因为是通过控制光标来实现你说的功能
本身按回车后是会自动进去下一个单元格，上面的代码是强制跳回去，如果你下一个单元格有弹出什么的，也会执行到