12月4日(木)1コマ目

今日、やったこと

  • [REST API]価格帯で検索 追加
  • [REST API]新規登録

今日のホワイトボード

[REST API]価格帯で検索 追加

画面を下図のように価格帯で検索できるように追加。

図 価格帯で検索を追加

search.html

検索条件入力用<input>タグ、検索ボタンを追加。


search.js

価格帯で検索ボタンクリック時に、searchByPrice()関数呼び出し。

searchByPrice()関数にて、fetch()でAPIをリクエスト。


Controller.java

価格帯で検索するためのメソッドを追加。

2つの検索条件はクエリパラメータで受け取る。


[REST API]新規登録

新規登録はPOSTコマンドでリクエスト。
登録データはHTTPのボディ部にJSON形式で格納。
これに伴い、HTTPのヘッダ部にContent-typeにapplication/jsonを設定。
図 POSTコマンド送信時のパケット

画面は以下のとおり。
図 新規登録用画面

update.html


update.js

fetch()でPOSTコマンドでリクエストするには、第2引数で指定する。
(デフォルトはGETコマンド)
また、ヘッダ部やボディ部も第2引数で指定。

Controller.java

以前、POSTコマンドリクエスト時に、HTTPのボディ部にJSON形式で格納されたデータを登録するメソッドを追加済み。今回はこれを使う。

次回は

登録機能の確認。
変更、削除機能を追加。

 

このブログの人気の投稿

1月15日(木)1コマ目

10月30日(木)1コマ目