Browse Source

Add example input values for users; Update web form styles

Signed-off-by: Pekka Helenius <fincer89@hotmail.com>
v0.0.1-alpha
Pekka Helenius 4 years ago
parent
commit
f3ac94faeb
4 changed files with 62 additions and 12 deletions
  1. +7
    -0
      bookstore/src/main/resources/messages.properties
  2. +27
    -6
      bookstore/src/main/resources/templates/bookadd.html
  3. +27
    -6
      bookstore/src/main/resources/templates/bookedit.html
  4. +1
    -0
      bookstore/src/main/resources/templates/booklist.html

+ 7
- 0
bookstore/src/main/resources/messages.properties View File

@ -16,6 +16,13 @@ book.desc.set.isbn = Set book ISBN code
book.desc.set.year = Set book publication year
book.desc.set.price = Set book price
book.desc.set.category = Select appropriate category
book.desc.example.headertext = Valid inputs
book.desc.example.author = Andrzej Sapkowski
book.desc.example.title = The Witcher\:\ The Lady of the Lake
book.desc.example.isbn = 1212121-3 or 4545454-67 or 6767676-890
book.desc.example.year = 1914
book.desc.example.price = 45.67
book.error.author = Invalid author name
book.error.title = Invalid title


+ 27
- 6
bookstore/src/main/resources/templates/bookadd.html View File

@ -2,6 +2,7 @@
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" th:href="@{../css/bootstrap.min.css}" />
<title th:text="#{page.title.browser.add}"></title>
</head>
@ -11,39 +12,55 @@
<form th:object="${book}" action="#" th:action="@{__${addpage}__}" method="post">
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookAuthor" th:text="#{book.author}"></label>
<input class="form-control" type="text" th:field="*{author}" placeholder="Book author"/>
<small class="form-text text-muted" th:text="#{book.desc.set.author}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.author}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author')}"
th:errors="*{author}">Invalid author name</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookTitle" th:text="#{book.title}"></label>
<input class="form-control" type="text" th:field="*{title}" placeholder="Book title"/>
<small class="form-text text-muted" th:text="#{book.desc.set.title}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.title}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('title')}"
th:errors="*{title}">Invalid title</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookISBN" th:text="#{book.isbn}"></label>
<input class="form-control" type="text" th:field="*{isbn}" placeholder="Book ISBN code"/>
<small class="form-text text-muted" th:text="#{book.desc.set.isbn}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.isbn}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('isbn')}"
th:errors="*{isbn}">Invalid ISBN code</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookYear" th:text="#{book.year}"></label>
<input class="form-control" type="text" th:field="*{year}" placeholder="Book publication year (YYYY)"/>
<small class="form-text text-muted" th:text="#{book.desc.set.year}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.year}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('year')}"
th:errors="*{year}">Invalid year</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookPrice" th:text="#{book.price}"></label>
<div class="input-group mb-2">
<div class="input-group-prepend">
@ -52,11 +69,15 @@
<input class="form-control" type="text" th:field="*{price}" placeholder="Book price"/>
</div>
<small class="form-text text-muted" th:text="#{book.desc.set.price}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.price}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('price')}"
th:errors="*{price}">Invalid price</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookCategory" th:text="#{book.category}"></label>
<select class="form-control" th:field="*{category}">
<option


+ 27
- 6
bookstore/src/main/resources/templates/bookedit.html View File

@ -2,6 +2,7 @@
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" th:href="@{../css/bootstrap.min.css}" />
<title th:text="#{page.title.browser.edit}"></title>
</head>
@ -11,39 +12,55 @@
<form th:object="${book}" action="#" th:action="@{{id}(id=${book.id})}" method="post">
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookAuthor" th:text="#{book.author}"></label><br>
<input class="form-control" type="text" th:field="*{author}" placeholder="Book author"/>
<small class="form-text text-muted" th:text="#{book.desc.set.author}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.author}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author')}"
th:errors="*{author}">Invalid author name</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookName" th:text="#{book.title}"></label><br>
<input class="form-control" type="text" th:field="*{title}" placeholder="Book title"/>
<small class="form-text text-muted" th:text="#{book.desc.set.title}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.title}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('title')}"
th:errors="*{title}">Invalid title</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookISBN" th:text="#{book.isbn}"></label><br>
<input class="form-control" type="text" th:field="*{isbn}" placeholder="Book ISBN code"/>
<small class="form-text text-muted" th:text="#{book.desc.set.isbn}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.isbn}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('isbn')}"
th:errors="*{isbn}">Invalid ISBN code</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookYear" th:text="#{book.year}"></label><br>
<input class="form-control" type="text" th:field="*{year}" placeholder="Book publication year (YYYY)"/>
<small class="form-text text-muted" th:text="#{book.desc.set.year}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.year}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('year')}"
th:errors="*{year}">Invalid year</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="fname" th:text="#{book.price}"></label>
<div class="input-group mb-2">
<div class="input-group-prepend">
@ -52,11 +69,15 @@
<input class="form-control" type="text" th:field="*{price}" placeholder="Book price"/>
</div>
<small class="form-text text-muted" th:text="#{book.desc.set.price}"></small>
<small style="display: inline-block;" class="form-text text-info" th:text="#{book.desc.example.headertext} + ': '"></small>
<small style="display: inline-block;" class="form-text text-muted" th:text="#{book.desc.example.price}"></small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('price')}"
th:errors="*{price}">Invalid price</div>
</div>
<div class="form-group">
<div class="form-group bookform-section">
<label for="BookCategory">Category</label>
<select class="form-control" th:field="*{category}" th:selected="${book.category}">
<option


+ 1
- 0
bookstore/src/main/resources/templates/booklist.html View File

@ -2,6 +2,7 @@
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" th:href="@{css/bootstrap.min.css}" />
<title th:text="#{page.title.browser.list}"></title>
</head>


Loading…
Cancel
Save