Как изменить положение открытого дропдауна?

Question

[aaltw]

Есть 2 кнопки: А и B. Кнопка A с дропдауном. Она работает как должна.

По нажатию на кнопку B, я через JS открываю дропдаун кнопки A:
dropdown.dropdown('toggle');

Дропдаун, очевидно, открывается под кнопкой A, как если бы я нажимал на кнопку А. Но мне нужно, чтобы этот (именно от кнопки А) дропдаун открывался под кнопкой B.

Я пытался задавать transform открывающегося окна и до dropdown.dropdown('toggle'), и после. Но бутстрап в обоих случаях перезаписывает мои изменения. Делал так (где позиции брал от кнопки):

dropmenu.css('transform', 'translate(' + left + 'px, ' + top + 'px)');

Проблема в том, что таким образом я вполне могу указывать любое свойство, но они записываются в style элемента и следовательно бутстрап перезаписывает любое свойство из указанных ниже:

<div 
  class="filter-dropmenu dropdown-menu dropdown-menu-end show" 
  style="
    position: absolute; 
    inset: 0px auto auto 0px; 
    margin: 0px; 
    transform: translate(204px, 204px);
  " 
  data-popper-placement="bottom-start">
</div>

Можно ли двигать элемент с помощью других свойств или как-то менять его уже после действий бутстрапа? Через панель разработчика после все удачно меняется, но вот после клика - нет. Причем эвенты дропдауна тоже не помогли, даже "shown".

Answer 1

[aaltw]

Сделал так: по нажатию на кнопку B в нее перемещаю кнопку А через B.append( A.detach() ), A делаю display: none и сразу же активирую дропдаун А через А.dropdown('toggle'). Таким образом дропдаун открывается как-бы под B. А на месте кнопки А в этот момент лежит ее внешняя копия, по нажатию на которую А вернется на место.