LoginSignup
kanazawaT
@kanazawaT

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

spring boot リスト表示ができない th:each Thymeleaf

ご教示お願い致します。デバックの方法などでも結構です。

このサイトを元にデータベースから取得した値をリスト表示させたいです。
コントローラまでデータは取得できているようですが、htmlに反映しません。

Springフレームワーク
https://kanda-it-school-kensyu.com/java-spring-contents/

■できていること
 データベースから取得した値が表示されないが、検索ボタンやテーブルの作成はできて表示されています。
 
■できていないこと
 データベースから取得した値(isbn、タイトル、価格)が、明細部分に表示されない。空というか真っ白です。

■確認したとこと
 リスト表示部分の書き方が悪いかと,以下のように書き換えましたが駄目でした。

<td th:text="${book.price}"></td>
<td th:text="*{price}"></td>
<td th:text="*{book[i].price}"></td>

■やったこと
 試しにコントローラ部分に以下のように固定値を渡してhtmlに表示できました。

 mav.addObject("hw", "Hello world");

 データベースから取得したリスト「book_list」をデバックで確認したところ
 データベースに登録した値がきちんと配列で入っていました。

 mav.addObject("book_list", book_list);

■プログラム

コントローラー

package jp.co.f1.spring.bms.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;

import jp.co.f1.spring.bms.entity.Book;
import jp.co.f1.spring.bms.repository.BookRepository;

@Controller
public class BmsController {
	// Repository インターフェースを自動インスタンス化
	@Autowired
	private BookRepository bookinfo;
	
	//listへのアクセス
	@RequestMapping("/list")
	public ModelAndView list(ModelAndView mav) {
		// テーブルから全件取得
		Iterable<Book> book_list = bookinfo.findAll();
		
		//viewに渡す変数をモデルに格納
		mav.addObject("book_list", book_list);
		mav.addObject("hw", "Hello worlds");
		
		// 画面に出力するviewを指定
		mav.setViewName("list");

		
		// モデルとビュー情報を返す
		return mav;
	}
	
}

html

書籍一覧
書籍管理システム
<div id = "menu">
	<div class ="container">
		<!-- ナビ-->
		<div id = "nav">
			<ul>
				<li><a href="#">[メニュー]</a></li>
				<li><a href="/insert">[書籍登録]</a></li>
			</ul>
		</div>
		
		<!--ページタイトル-->
		<div id = "page_title">
			<h2>書籍一覧</h2>
		</div>
	</div>
</div>

<!--書籍一覧のコンテンツ部分-->
<div id ="main" class ="container">
	
	<!--検索フォーム-->
	<form class ="inline-block" action="seartch">
		ISBN<input type ="text" name ="isbn">
		TITLE<input type ="text" name ="title">
		価格<input type ="text" name ="price">
		<input type ="submit" value="検索">
	</form>
	<form class ="inline-block" action ="/list">
		<input type ="submit" value ="全権表示">
	</form>
	
	<!--書籍情報リスト-->
	<h1 th:text="${hw}"></h1>

	<table>
		<thead>
		 	<tr>
				<th>ISBN</th>
				<th>TITLE</th>
				<th>価格</th>
				<th>変更削除</th>
			</tr>
		</thead>
		<tbody th;if="${book_list.size()>=1}">
			<tr th:each="book:${book_list}" th:object="${book}">
				<td><a href="#" th:text="${isbn}"></a></td>
				<td th:text="${title}"></td>
				<td th:text="${price}"></td>
				<td>
					<a href="#">変更</a>
					<a href="#">削除</a>
				</td>
			</tr>
		</tbody>

	</table>
</div>

<!--フッター-->
<footer>
	<div class ="container">
		<h1>copyright YYYYMMDD</h1>
	</div>
</header>

エンティティ

package jp.co.f1.spring.bms.entity;

import jakarta.persistence.Column;
import jakarta.persistence.Entity;
import jakarta.persistence.Id;
import jakarta.persistence.Table;

//import javax.persistene.Entity;

@Entity
@Table(name="bookinfo")
public class Book {

	//ISBN
	@Id
	@Column(length=20)
	private String isbn;
	
	public String geteIsbn() {
		return isbn;
	}
	
	public void setIsbn(String isbn) {
		this.isbn = isbn;
	}
	
	//タイトル
	@Column(length=100, nullable =true)
	private String title;
	
	public String geteTitle() {
		return title;
	}
	
	public void setTitle(String title) {
		this.title = title;
	}

	//価格
	@Column(length=11, nullable =true)
	private String price;
	
	public String getePrice() {
		return price;
	}
	
	public void setPrice(String price) {
		this.price = price;
	}
}

リポジトリ

package jp.co.f1.spring.bms.repository;

import org.springframework.data.jpa.repository.JpaRepository;

import jp.co.f1.spring.bms.entity.Book;

public interface BookRepository extends JpaRepository<Book, String> {
}

0

1Answer

エンティティのBookクラスにおいて、Getterのメソッド名が間違っています。
誤)geteIsbn
正)getIsbn
他のフィールドも同様、余計な「e」が途中に入っています。
Javaの命名規則に従っていないため、Thymeleafがフィールドを認識できていないのだと思われます。
こういったGetterやSetterは、基本的には自分の手で書かずIDEの機能で自動生成したほうが良いです。手で書くとどうしても打ち間違いが発生しますからね。

また、htmlの以下コードでセミコロン(;)がありますが、正しくはコロン「:」です。

<tbody th;if="${book_list.size()>=1}">
0

Comments

  1. @kanazawaT

    Questioner

    できました~~~感動、、、ありがとうございます。

    ちなみに、

    はで動きました。

    今後ともよろしくお願いいたします。

Your answer might help someone💌