在可编辑表单内的元素上调用函数

Question

我有一个 x-editable 表单，里面有几个字段。为了简洁起见，我在这里只显示了复选框字段。有一个编辑按钮可以打开所有元素进行编辑，当我单击提交时，所有元素都将被保存。在编辑模式下，我希望能够在提交表单之前单击复选框时调用一个函数。它将用于验证以确保用户确实想要取消选中该框。我想阻止复选框的默认行为并显示一个对话框进行确认。这对于常规复选框来说很简单，但我可以弄清楚如何使用 x-editable 来做到这一点。 ng-click 似乎不起作用。正如您从示例中看到的那样，e-onClick 可以工作，但只能使用 alert() 和 console.log() 等内置函数。

<form editable-form name="tableform" onaftersave="save()"oncancel="cancel()">    
    <table>
        <tr>
            <th>Active:</th>
                <td>
                    <span editable-checkbox="user.active" e-form="tableform" e-onClick="console.log('test')"> {{user.active)}}
                    </span>
                </td>
        </tr>
   </table>
</form>

我想做这样的事情：

<span editable-checkbox="user.active" e-form="tableform" e-onClick="confirm($event)"> {{user.active)}}
                    </span>

然后在我的控制器中执行如下操作：

 $scope.confirm = function($event){
            $event.preventDefault();
            // show confirmation code

        };

Answer 1

你能试试吗

<span editable-checkbox="user.active" e-form="tableform" e-ng-click="confirm()"> {{user.active)}}</span>

和

 $scope.confirm = function(){
           console.log("test")
        };

这会起作用

在可编辑表单内的元素上调用函数

Calling a function on an element inside xeditable form

checkbox

preventdefault

x-editable