如何在 x-editable 弹出窗口中的选择旁边添加输入答案

【问题标题】：How to add an input next to select in x-editable popup如何在 x-editable 弹出窗口中的选择旁边添加输入
【发布时间】：2015-05-14 14:59:18
【问题描述】：

我正在使用 bootstrap x-editable 让用户输入值。这是我的代码：

    var supportSecondaryOptions = [
    { value: 'A', text: 'Prorated based on direct hours' },
    { value: 'B', text: 'Prorated based on client team HC' },
    { value: 'C', text: 'Explicitly defined percentage' }
    ];

 $("a[id^=secondaryoption_][id!='secondaryoption_{departmentid}']").editable({
        source: supportSecondaryOptions,
        onblur: 'submit',
        success: function (response, newValue) {
            $(this).attr("data-value", newValue);
        }
    });

这基本上显示了一个带有用户选择的选择元素的弹出窗口。现在我被要求添加另一个功能。如果用户选择特定项目（即明确定义的百分比），则输入元素必须出现在弹出窗口中的选择元素旁边，用户必须在其中输入比率，即“60/40”。我尝试通过在其中输入 html 来使用 tpl 选项，但后来我失去了选择。所以我尝试像这样将整个 html 写入 tpl：

tpl: '<select class="form-control input-sm">' +
            '<option value="A">Prorated based on direct hours</option>' +
            '<option value="A">Prorated based on client team HC</option>' +
            '<option value="A">Explicitly defined percentage</option></select>' +
            ' <input style="width:50px;"></input>',

但现在输入默认显示该值。我确信有一个更好的方法可以使用 x-editable 来做到这一点。有人可以指导我正确的方向吗？

【问题讨论】：

标签： jquery twitter-bootstrap x-editable

【解决方案1】：

也许将 onchange 事件与 select 挂钩？

$(".editable-input select").on('change', function () {
    $(this).after('<input style="width:50px;"></input>');
}

【讨论】：