重新加载后 SumoSelect 无法打开

SumoSelect won't open after reload

我在我的网络中使用 sumoselect 输入。

问题是 - 如果你打开第二个 sumoselect 然后你想先打开 - 所以点击第一个但他没有打开...

我的代码:

$('.country').SumoSelect({placeholder: 'first'});
$('.anotherSumo').SumoSelect({placeholder: 'second'});

$('.anotherSumo').on('sumo:closing', function(e) {

  $('.country').empty();
  $('.country').append('<option value="newValue">newValue</option>');
  $('.country')[0].sumo.reload({placeholder: 'first'});
});

这里正在工作fiddle。只需打开第二个 select,然后尝试先打开 - 2 次点击。以相反的顺序 - 首先点击打开第一个 sumo,然后第二次点击第二个 sumo 一切正常...

我试图在重新加载后添加 $('country').trigger("click"); 但没有添加

https://jsfiddle.net/eqa9og2v/5/

我需要知道如何以任何方式在第二次点击时打开第一个 sumo,但在 sumo 上使用功能触发器select 关闭 - 因为第一个用户做出了他的选择,如果用户完成了 selecting他关闭相扑的选项select(打开另一个或只关闭)

我认为您尝试实施的方式不可行,也无法实现,因为当您单击第一个打开它时,会调用第二个下拉关闭,您会在其中重新创建第一个。所以第一个下拉列表的实际点击会丢失,因为所有新绑定都添加到第一个下拉列表中。

如果你想实现它,你必须更改插件中的代码,这不是一个好习惯。您也可以使用 $('.sumo_country').addClass('open').attr('aria-expanded', 'true'); 强制第一个下拉菜单显示选项,但再次关闭下拉菜单时,您必须第一次单击两次。

更改任何依赖于其他下拉值的下拉值的正确可行方法是使用下拉列表的 change 功能。

在您的情况下,无论何时从第二个下拉列表中选择或取消选择适合您的值,您都必须更改数据。

这是工作示例。正如您在评论中提到的,您希望在 select 从第二个 select 中更改第一个 select 之后,而不仅仅是在关闭它之后。 .on('change', ...) 似乎可以解决问题。

https://jsfiddle.net/eqa9og2v/6/

所以我想通了...有办法做到!我非常需要这个 - 如果您有任何通知或任何欢迎。

我的代码:

$('.country').SumoSelect({placeholder: 'first'});
$('.anotherSumo').SumoSelect({placeholder: 'second'});

$('.anotherSumo').on('sumo:closed', function(e) { 

    var count = $('.country option').length;

    for(var i = 0; i < count; i++) {
        $('.country')[0].sumo.remove(0);    
    }

    $('.country')[0].sumo.add('newValue','newValue', 0);
});

工作fiddle: https://jsfiddle.net/eqa9og2v/7/

注意:如果您需要正常工作的输入(用于发送表单或其他),您也需要 add/remove option select 中的元素......