【问题标题】:x-editable on shown event dropdown (<select />) source refreshx-editable 在显示的事件下拉列表(<select />)源刷新
【发布时间】:2013-12-31 14:02:35
【问题描述】:

我正在尝试在显示之前更改 x 可编辑源数据,以便即使源更改,我的下拉菜单条目也始终是新的。

这里有一个解释链接:http://jsfiddle.net/XN7np/3/

// my source that can change over time
var source = [{'value': 1, 'text': 'fine'}, {'value': 2, 'text': 'bad'}];

$('#my_select').editable({
    'mode'  : 'inline',
    'source': source,
});

$('#my_select').on('shown', function(ev, editable) {
    // now changing my source just before dropdown is shown
    source = [{'value': 1, 'text': 'GOOD'}, {'value': 2, 'text': 'FU'}];

    //$(editable).editable('option', 'source', source); NOT WORKING
    //$('#my_select').editable('option', 'source', source); NOT WORKING
    //$(this).editable('option', 'source', source); NOT WORKING
});

有什么想法吗?

【问题讨论】:

  • 一旦显示为时已晚,需要该来源来创建要显示的元素。建议您在关闭时销毁并制作自己的点击处理程序以在点击链接时初始化插件
  • 这就是文档所说的“显示”事件:在显示容器并呈现表单时触发(因为选择将等待加载下拉选项)。
  • 如果它不起作用,请挖掘源代码以查看它应该如何工作。关闭时销毁,点击时创建是一个失败的简单解决方案

标签: javascript jquery drop-down-menu x-editable


【解决方案1】:

我在文档中没有看到它,但是您可以像这样将函数传递给源参数:

var source = [{'value': 1, 'text': 'fine'}, {'value': 2, 'text': 'bad'}];

$('#my_select').editable({
    'mode'  : 'inline',
    'source': function() {
        return source;
    },
});

这样它总是使用更新的源数组。我更新了你的小提琴: http://jsfiddle.net/XN7np/4/

【讨论】:

    【解决方案2】:

    这条线有效:

    $('#my_select').editable('option', 'source', source);
    

    对于任何可编辑的源,例如 source2,您必须对“value”和“text”使用双引号,而不是单引号 'value'、'text':

     var source2 = [{"value": 1, "text": "fine111"}, {"value": 2, "text": "bad22"}];
    
    
     $('#change').click(function(e) {
        $('#my_select').editable('option', 'source', source2)
     });
    

    将上面的代码复制到您的小提琴示例中,看看它是如何工作的。

    【讨论】:

      【解决方案3】:
      <span class="editable ea-appsch-agntid" data-type="select" data-source="URL" data-value="">agntname</span>
      

      【讨论】:

      • 欢迎来到 Stackoverflow。对于其他程序员,您是否介意进一步扩展答案,以了解它如何帮助解决问题。
      猜你喜欢
      • 1970-01-01
      • 2017-11-05
      • 1970-01-01
      • 1970-01-01
      • 2012-11-18
      • 2012-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多