0
Grailsプロジェクトでは、マルチレベルのドロップダウンメニューでNAVBAR（BootStrap）を使い、グーグルグーグルを使って動作させる必要があることを知りたいと思っています。 手がかりを与えることができる例が見つからないことがわかりました。私はそれらのほとんどが古いものだと思っています。最新バージョンのgrailsとブートストラップでは動作しません。GRAILSプロジェクトのブートストラップでsmartmenusを使用するには何が必要ですか？
私はsmartmanuesをダウンロード（git-repositoryをクローン）して、多くのスクリプトとスタイルシートを見つけました。しかし、すべて私はちょうど私に混乱しています。
私は正しい方向に私を置くためにいくつかの助けを得ることができたら、私は非常に幸せです。 // LG
OKが、私は新しいGrailsのプロジェクト（testMultiLevel）を作成したとしてindex.gspを修正：これは単なる表示するために、次に上部のメニューを変更する必要があります
<!doctype html>
<html>
<head>
<meta name="layout" content="main"/>
<title>Welcome to Grails</title>
<asset:link rel="icon" href="favicon.ico" type="image/x-ico" />
</head>
<body>
<content tag="nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Grails Info <span class="caret"></span></a>
<ul class="dropdown-menu">
<li>
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Application Status <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Environment: ${grails.util.Environment.current.name}</a></li>
<li><a href="#">App profile: ${grailsApplication.config.grails?.profile}</a></li>
<li><a href="#">App version:
<g:meta name="info.app.version"/></a>
</li>
<li role="separator" class="divider"></li>
<li><a href="#">Grails version:
<g:meta name="info.app.grailsVersion"/></a>
</li>
<li><a href="#">Groovy version: ${GroovySystem.getVersion()}</a></li>
<li><a href="#">JVM version: ${System.getProperty('java.version')}</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Reloading active: ${grails.util.Environment.reloadingAgentEnabled}</a></li>
</ul>
</li>
<li>
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Artefacts <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Controllers: ${grailsApplication.controllerClasses.size()}</a></li>
<li><a href="#">Domains: ${grailsApplication.domainClasses.size()}</a></li>
<li><a href="#">Services: ${grailsApplication.serviceClasses.size()}</a></li>
<li><a href="#">Tag Libraries: ${grailsApplication.tagLibClasses.size()}</a></li>
</ul>
</li>
<li>
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Installed Plugins <span class="caret"></span></a>
<ul class="dropdown-menu">
<g:each var="plugin" in="${applicationContext.getBean('pluginManager').allPlugins}">
<li><a href="#">${plugin.name} - ${plugin.version}</a></li>
</g:each>
</ul>
</li>
</ul>
</li>
</content>
<div class="svg" role="presentation">
<div class="grails-logo-container">
<asset:image src="grails-cupsonly-logo-white.svg" class="grails-logo"/>
</div>
</div>
<div id="content" role="main">
<section class="row colset-2-its">
<h1>Welcome to Grails</h1>
<p>
Congratulations, you have successfully started your first Grails application! At the moment
this is the default page, feel free to modify it to either redirect to a controller or display
whatever content you may choose. Below is a list of controllers that are currently deployed in
this application, click on each to execute its default action:
</p>
<div id="controllers" role="navigation">
<h2>Available Controllers:</h2>
<ul>
<g:each var="c" in="${grailsApplication.controllerClasses.sort { it.fullName } }">
<li class="controller">
<g:link controller="${c.logicalPropertyName}">${c.fullName}</g:link>
</li>
</g:each>
</ul>
</div>
</section>
</div>
<script>
$(document).ready(function(){
$('.dropdown a.dropdown-toggle').on("click", function(e){
$(this).next('ul').toggle();
e.stopPropagation();
e.preventDefault();
});
});
</script>
1つの項目をクリックすると、2つ目のレベルが表示されます。そしてこれまでのところうまくいっていますが、2：ndレベルをクリックすると展開したいが、そうではない。 動作する例が見つかりましたが、それはgrailsにはありませんでした。彼らは私がGSPの最後に追加した簡単なスクリプトを使用しました。しかし、それはまだ動作しません。
ブートストラップは以前のバージョンではマルチレベルのメヌエットを持っていましたが、それを取り除きましたが、現在はスマートメヌースを使用することをお勧めします。 問題は、スマートメヌーカをアプリケーションに組み込んで、それを動作させる方法を教えてくれるものが見つからないということです。 私は今、どのファイルをどこに置く必要があるのですか？
これは非常に多くの組み合わせであるため、TRY-and-Errorメソッドを使用することはできません。 しかし、スマートメヌースを使うのが簡単な他の解決策があるかもしれません。それは私にとっては大丈夫です。 // LG
私はここのレイアウトとブートストラップが含まれているレイアウトも使用しています。しかしそれは終わりではなく、それは含まれているapplication.jsです。これは順番にブートストラップを呼び出します。
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<title>
<g:layoutTitle default="Grails"/>
</title>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<asset:stylesheet src="application.css"/>
<g:layoutHead/>
</head>
<body>
<div class="navbar navbar-default navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/#">
<i class="fa grails-icon">
<asset:image src="grails-cupsonly-logo-white.svg"/>
</i> Grails
</a>
</div>
<div class="navbar-collapse collapse" aria-expanded="false" style="height: 0.8px;">
<ul class="nav navbar-nav navbar-right">
<g:pageProperty name="page.nav" />
</ul>
</div>
</div>
</div>
<g:layoutBody/>
<div class="footer" role="contentinfo"></div>
<div id="spinner" class="spinner" style="display:none;">
<g:message code="spinner.alt" default="Loading…"/>
</div>
<asset:javascript src="application.js"/>
</body>
</html>
あなたはあなたのコードを提供することができますか？どこに問題がありますか？ –
あなたは適切にブートストラップのjsを含んでいますか？ – sean
私はそうだと思いますが、NAVBARは下位レベルを展開しない限りOKですが、わかりません。しかし、それは何をインストールする必要があり、どこにインストールする必要があり、いくつかのインクルードをGSPに追加する必要があるのかという質問です。等 – larand