如何更改bootstrap editable元素中的数据值？

I'm using the bootstrap editable plugin to allow users to edit fields on the screen. One of the fields, when clicked, displays a small popup that lets users select from a dropdown with a checkmark next to the dropdown to allow the user to apply the value to the field. My markup has a simple anchor that looks like this:

我正在使用bootstrap可编辑插件来允许用户编辑屏幕上的字段。其中一个字段在单击时会显示一个小弹出窗口,允许用户从下拉列表中选择下拉列表旁边的复选标记,以允许用户将值应用于该字段。我的标记有一个简单的锚,看起来像这样:

<a href="#" id="primaryoption_1" data-type="select" data-name="option" data-value="0" class="editable-discreet">Split EM/SEM</a>

My jQuery code has this to enable this feature using bootstrap:

我的jQuery代码使用bootstrap启用此功能:

 var gaPrimaryOptions = [
    { value: 0, text: 'Split EM/SEM' },
    { value: 1, text: 'Only EM' },
    { value: 2, text: 'Only SEM' }
    ];

$("a[id^=primaryoption_][id!='primaryoption_{departmentid}']").editable({
        source: gaPrimaryOptions,
        onblur: 'submit'
    });

If you notice my markup has a data-value attribute with a default value of "0".

如果您注意到我的标记具有默认值为“0”的数据值属性。

The problem I'm having is how to change the data-value to the appropriate value when a user selects another item from the dropdown list and clicks the checkmark. My data-value always stays to "0" even when the user selects another item like "Only EM" which has a value of "1".

我遇到的问题是当用户从下拉列表中选择另一个项目并单击复选标记时,如何将数据值更改为适当的值。即使用户选择具有值“1”的“仅EM”之类的另一项,我的数据值也总是保持为“0”。

1 个解决方案

#1

How are you checking the value, using the dev tools in the browser? If so, I don't think you'll see the value changing like you want it to.

如何使用浏览器中的开发工具检查值?如果是这样,我认为你不会看到你想要的价值变化。

Reason for asking is because the code seems fine, try this:

问的原因是因为代码看起来很好,试试这个:

var gaPrimaryOptions = [
    { value: 0, text: 'Split EM/SEM' },
    { value: 1, text: 'Only EM' },
    { value: 2, text: 'Only SEM' }
];


$("a[id^=primaryoption_][id!='primaryoption_{departmentid}']").editable({
    source: gaPrimaryOptions,
    onblur: 'submit',
    validate: function(value) {
        console.log("You've chosen " + value);
    }, success: function(response, newValue) {
        console.log("New value is " + newValue);
    }
});

current_value = $("a[id^=primaryoption_][id!='primaryoption_{departmentid}']").editable('getValue', true);
console.log("Curent value is " + current_value);

http://jsfiddle.net/3KkZd/375/

#1