自动提交 jeditable onchange

Question

我有带有 x 个可编辑输入字段的表单，我希望这些字段自动提交数据。除 datetimepicker 外，一切正常。

基本上，对于 x 可编辑的 datetimepicker，我有这样的东西：

<a href="#" class="form-control date2" data-date="1971-12-27" data-type="datetime" style="display: block;">27 Dec 1971</a>

和这样的脚本：

$('.date2').editable({
    format: 'yyyy-mm-dd',
    viewformat: 'd M yyyy',
    inputclass: 'form-control',
    showbuttons: false,
    tpl: '<div class="input-group date"><input type="text" readonly class="form-control input-medium"/><span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span><span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span></div>',
    datetimepicker:{
        startView: 4,
        minView: 2,
        pickerPosition: 'bottom-left'
    }
});

所以，我只想输入没有确定和取消按钮的字段。

我发现自动提交没有按预期工作。

我已经测试了由 x 可编辑托管（包装）的 datetimepicker 的行为以及单独使用时的行为。测试代码可以在这里找到：http://jsfiddle.net/2kYNq/25/

这里是对输入组件行为的简短描述：

组件 A. 由 x 包裹的 datetimepicker 可使用 showbuttons 编辑：false

当用户选择日期时，新日期出现在输入字段中，但没有提交：当用户移动到另一个输入字段时，更改的日期被丢弃。 如果用户选择 x 可编辑输入字段的输入部分并单击输入，则可以提交 --> 2+ 用户操作（单击）

组件 B. 由 x 包裹的 datetimepicker 可使用 showbuttons 编辑：true

可以通过点击确定按钮提交，或者和案例A一样，点击组件的输入部分，然后点击进入。

单独的组件 C. datetimepicker

通过日历组件选择日期后立即提交。

---

是否可以让由 x 包装的 datetimepicker 可以在没有 ok 和 cancel 按钮的情况下进行编辑，一旦通过日历组件选择日期，它就会自动提交日期？用户无需单击任何内容即可实现日期提交。仅用于选择日期。

Answer 1

经过一番摆弄，技巧如下：

$(document).on('change','.form-control',function(){
   $(this).trigger("submit")
});

form-control 是文本输入的类，因为这是引导程序中的默认类，您可以将其更改为任何唯一类并在您的 .editable() 函数中进行修改。

jeditable 也有一个onblur 参数，您可以使用它提交为：

$('.date3').editable({
  onblur:'submit'
});

这将在您进行更改并离开输入框后提交数据。

DEMO