如何从当前的成功功能中触发新的X-Editable打开？

I'm using the Bootstrap X-editable to let people do inline edits of their profile. One of the things that the user can edit, has an influence on another editable though. If editable A (a year) is set to the current year, the user is obliged to make a decision in editable B (a certain tax rate) as well.

我正在使用Bootstrap X-editable来让人们对他们的个人资料进行内联编辑。用户可以编辑的内容之一，但对另一个可编辑的影响。如果可编辑的A（一年）设置为当前年份，则用户也有义务以可编辑的B（特定税率）做出决定。

So the editable options for the editable year are as follows:

因此，可编辑年份的可编辑选项如下：

$('#year').editable({
    pk: 1,
    success: function(response, newValue){
        if (newValue == 2014){
            $('#tax_rate').trigger('click');
        } else {
            $('#tax_rate').html(2);
        }
    }
});

EXAMPLE FIDDLE HERE

这里的例子很简单

This behaves fine except for the year 2014, in which it does indeed post the correct value to the back-end, and subsequently indeed clicks/opens #tax_rate, but somehow, the click prevents the new year from being displayed correctly in #year. If I refresh the page, the year displays correctly again, but it's just when I try to trigger the other editable, that it doesn't display the year correctly after saving it. Just try opening the fiddle and changing the year to 2014 to see what I mean.

除了2014年之外，它的表现确实很好，它确实会将正确的值发布到后端，然后确实点击/打开#tax_rate，但不知何故，点击会阻止新年在#year中正确显示。如果我刷新页面，年份会再次正确显示，但是当我尝试触发另一个可编辑时，它在保存后不会正确显示年份。试着打开小提琴并将年份改为2014年，看看我的意思。

So does anybody know how I can both update the new year in the DOM and also click/open the tax_rate editable? All tips are welcome!

那么有谁知道我如何在DOM中更新新年并点击/打开tax_rate可编辑？欢迎所有提示！

1 个解决方案

#1

I advice you to async UI interact:

我建议你进行异步UI交互：

Like this:

喜欢这个：

$('#year').editable({
    pk: 1,
    success: function(response, newValue){
        if (newValue == 2014){
          setTimeout(function(){
             $('#tax_rate').trigger('click');
          }, 0); 
        } else {
            $('#tax_rate').html(2);
        }
    }
});

It should work correctly, I think

我认为它应该正常工作

Add:
Also you can trigger click event vanillaJS framework using.
I think $.trigger cause the some UI update fault.
It's simple:

添加：您也可以使用触发click事件vanillaJS框架。我认为$ .trigger导致一些UI更新错误。这很简单：

document.getElementById('tax_rate')
  .dispatchEvent(new Event('click'));

#1