2017-12-10 9 views
0

でアンカータグ、ディスプレイモデルオブジェクトをクリックすると、私はこのようなモデルオブジェクトを返します。Thymeleaf-私のコントローラではdivの

double[] calculateYearMonth=statistics.CalculateActive(); 
modelAndView.addObject("statistics",calculateYearMonth); 

このcalculateActive関数は4人のメンバーとして配列を返します。 女性、男性、年、月、比率。 - その第三のメンバー、私は月を言うのアンカーをクリックすると

<div class="row centerAlign"> 
<h1><strong>RESULTS</strong></h1> 
</div> 

    <div class="row centerAlign" id="month"> 
<div><a href="" style="float: right;"> Month </a> 
    <a href="" style="float: left;">Year</a> 
</div> 
</div> 

が、私は、オブジェクトの統計[3]を取得したい:私は2つのリンクを持っていると下に私のHTMLで

私はdiv要素を持っています結果を表示する場所に表示します。 年をクリックすると、統計を取得したいが、4番目のメンバーが表示されます。結果に表示します。

Thyemeleafを使ってどうすればいいですか?選択したアンカーを表示するにはどうすればリンクできますか? おかげであなたはjavascriptオブジェクト内のデータ保存するには、以下を使用することができます

+0

Javascriptを使用していますか? – Antoniossss

+0

どのように? Quz th:utext = {{$ statistics}}統計情報オブジェクトを取得するには、クリックしたアンカーに応じて変更する方法がわかりません。 –

答えて

0

<script th:inline="javascript"> 
    var stats = /*[[${statistics}]]*/{}; 
</script> 

を次にこのjavascriptオブジェクトstatsは、クライアント側で利用可能であり、あなたがアンカーに基づいて、必要なデータを取り出すことができますが

をクリック
<a href="javascript:void(0);" style="float: right;" 
    class="results" data-index="3">Month</a> 
<a href="javascript:void(0);"style="float: right;" 
    class="results" data-index="4">Year</a> 

そして、あなたが書くことができるイベントハンドラで:

$(".results").on('click', function(){ 
    var index = $(this).data("index"); 
    var statObj = stats[index]; 
}); 
関連する問題