Question

我使用xeditable（http://vitalets.github.io/x-editable/docs.html）制作了一份清单，脚本如下所示，位于https://jsfiddle.net/m8L2hyko/。

<a href="#" id="options" data-type="checklist" data-pk="1" data-url="/post" data-title="Select options"></a>

$('#options').editable({
  value: [2, 3],
  source: [ {value: 1,text: 'option1'}, {value: 2,text: 'option2'}, {value: 3,text: 'option3'}]
});

该插件使用以下HTML替换<a>元素。

<a data-title="Select options" data-url="/post" data-pk="1" data-type="checklist" id="options" href="#" class="editable editable-click">
  option2<br>option3
</a>

如图所示，在每个选定选项之间插入<br>个元素。我不想将它显示为带换行符的垂直列表，而是将它们显示为水平逗号分隔列表，例如“option2，option3”。

这怎么可能？

Answer 1

使用显示选项。

  display: function(value, sourceData) {
    //display checklist as comma-separated values
    var html = [],
      checked = $.fn.editableutils.itemsByValue(value, sourceData);

    if (checked.length) {
      $.each(checked, function(i, v) {
        html.push($.fn.editableutils.escape(v.text));
      });
      $(this).html(html.join(', '));
    } else {
      $(this).empty();
    }
  }

https://jsfiddle.net/m8L2hyko/3/

Answer 2

看起来改变了CSS中的内容工作。

DoubleProperty progress = new SimpleDoubleProperty(0);
progText.textProperty().bind(progress.asString());

...
// update progress bar
pb.setProgress(cp*0.0001);
progress.setValue(cp*0.0001)

https://jsfiddle.net/8hcrxa95/

水平显示X-Editable核对表

2 个答案: