2016-10-08 1 views
3

в моем феникс приложение, <% = ссылка ..., метод: Удаление%> в Bootstrap выпадающий не работаетметод Phoenix Ссылка: удалить не работает Bootstrap выпадающего списка

<ul class="nav navbar-nav navbar-right"> 
    <%= if [email protected]_user do %> 
     <li> <%= link "Log In" , to: session_path(@conn, :new) %></li> 
    <% else %> 
     <li class="dropdown"> 
     <a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
      Hi!, <%= @conn.assigns.current_user.username %> 
      <b class="caret"></b> 
     </a> 
     <ul class="dropdown-menu"> 
      <li><%= link "Log out", to: session_path(@conn, :delete, @conn.assigns.current_user), method: "delete" %></li> 
      <li> <%= link "Log In" , to: session_path(@conn, :new) %></li> 
     </ul> 
     </li> 
    <% end %> 
    </ul> 

, но когда я выхожу из «выпадающего меню», он работает отлично.
Когда я меняю <% = link ...%> <% = кнопка ...%>, он отлично работает !!

Моего brunch.js имеет дерзость включать в плагин

plugins: { 
    babel: { 
    // Do not use ES6 compiler in vendor code 
    ignore: [/web\/static\/vendor/] 
    }, 

    sass: { 
    options: { 
     includePaths: ["node_modules/bootstrap-sass/assets/stylesheets"], // tell sass-brunch where to look for files to @import 
     // minimum precision required by bootstrap-sass 
     //precision: 8 
    }, 
    precision: 8 
    }, 
    copycat: { 
    "fonts": ["node_modules/bootstrap-sass/assets/fonts/bootstrap"] // copy node_modules/bootstrap-sass/assets/fonts/bootstrap/* to priv/static/fonts/ 
    } 
}, 

... 
... 

npm: { 
    enabled: true, 
    whitelist: ["phoenix", "phoenix_html", "jquery"], 
    globals: { // bootstrap-sass' JavaScript requires both '$' and 'jQuery' in global scope 
    $: 'jquery', 
    jQuery: 'jquery', 
    bootstrap: 'bootstrap-sass' // require bootstrap-sass' JavaScript globally 
    } 
} 


Я думаю, что проблема связана с JavaScript, но я не знаю, как это исправить.
У кого-то есть такая же проблема? благодаря!

+0

Под «не работает» вы подразумеваете, что ничего не происходит, если вы нажмете его? или он не оформлен должным образом? или вы ничего не видите? или что-то другое? – Dogbert

+0

ничего не сделал. и в конце будет добавлен URL-адрес «#» –

+0

Правильно ли вы включаете 'phoenix_html'? В новом проекте конфигурация бранча имеет следующее: 'javascripts: {joinTo:" js/app.js "}', а в 'app.js' у него есть' import 'phoenix_html '' и 'link method:: delete' works с этим. Можете ли вы также проверить, содержит ли сгенерированный 'priv/static/js/app.js'' phoenix_html'? – Dogbert

ответ

7

Проблема возникает из части JavaScript Bootstrap.

Вот виновная линия bootstrap.js (линия 910 на v3.3.7):

.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() }) 

Для того, чтобы ваши ссылки работают, вы должны либо не обернуть ссылки в <form> тегах или удалить этот обработчик событий, включив в ваш код app.js следующий код:

$(document).off('click.bs.dropdown.data-api', '.dropdown form'); 
+1

да! оно работает! спасибо @Oskar –

 Смежные вопросы

  • Нет связанных вопросов^_^