ヌンタコのプログラミング学習ブログ

フィヨルドブートキャンプ37期生

webアプリ作りがちょっと煮詰まる

ちょっと煮詰まってるけども、頑張ろう💪

煮詰まっている内容

  • 検索フォームの処理をどうつけるか?
  • 削除の確認ウィンドウのjavascript分岐

主にこんなところ

進めていくTODO

前のブログの内容は書いただけになってしまっているけれど、 何回も同じこと書いていたらすみません・・・。

  • 個人情報:住所、メールアドレス、備考欄の登録
  • デザイン修正
  • githubに草立てる
  • 検索フォームの設定
  • 削除の確認ウィンドウ分岐
  • ユーザー一覧をidの番号順に並べる

流れをまとめておく

検索フォームの流れ

ユーザー側の見かけ上の流れ 1.検索idを入力して検索ボタンを押すと 2.内容に合った個人情報が表示される

制作側での流れ 1.入力フォームと検索ボタン:デザイン 2.入力されたidをinputタグのnameとかに格納 3.id番号のデータをデータベースと照合させる処理:ruby 4.登録なかったらnot foundページ、あったら一覧に表示させるページ

かなりざっくり。 データを渡して処理するところが大変。

削除の流れ

  1. 削除confirmはjsで作ってある 2.削除するかの確認ではい・いいえを選択 3.「はい」なら削除してトップページへ 4.「いいえ」なら何もせずにトップページへ

この条件分岐はjavascriptでやりたいのだけれど、 /delというルーティングをrubyでやってて→削除する作業 htmlタグで<form action="/del">→ボタン押したらrubyのdelete作業実行

という流れをすでに組んでしまっているので、 /delの作業をするかどうかをjsの中に入れたい。

これが結構詰まってる。

前回詰まってたcssがかからない問題について

階層が問題だったみたい。 paramsでidを押すと個別ページが表示されるようにしていたので、 /mypage/:idでerbファイルが表示されるようにしていた。

cssファイルのある階層は/public/style.cssに対して、 mypage.erbならhref="style.css"でよかったけども階層が/mypage/:idでは もう一つ下のイメージになるので、相対パスで指定してあげることで解消した。

このサイトが参考になった。

teratail.com

他にもあったのだけれど間違えて消してしまってどこのサイトかわからなくなった💦

課題は細分化して考えることにする💪