honapon
@honapon

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

【rails・html】①view(html)部分を、nilの時に完全に非表示にしたい。②<th>の横幅の範囲を広げたい

解決したいこと

スケジュール管理アプリを実装中です。
スケジュールが何も登録されていないときに、トップページの本来スケジュールが表示される部分に「現在登録されているスケジュールはありません」と表示させ、
1つでも登録されているスケジュールがある時にはそれを非表示にしたいと思っています。

文字列の表示の切り替えは出来たのですが2つ躓いている部分があります。
①表示部分が左端の1マスになってしまっている(マスの大きさを各種カラムが表示されている横幅いっぱいにしたい。)
②非表示(条件分岐の結果がnilの時)にもmarginなどが反映され、小さいボックスが表示されてしまう

この部分について中々自己解決が出来ない状況です。解決方法のアドバイスを頂けると嬉しいです。

app>controllers>plans.controller.rbのindex部分

  def index
    @plans = Plan.all

    if Plan.count == 0
     @count = "現在登録済みのスケジュールはありません"
    else  
     @count = nil
    end
  end

app>views>plans>application.html.erbのtable部分

      <thead>
        <tr>
         <th> id</th>
          <th>タイトル</th>
          <th>開始日</th>
          <th>終了日</th>
          <th>終日</th>
          <th>スケジュール更新日時</th>
          <th>参照</th>
          <th>編集</th>
          <th>削除</th>
        </tr>
        <tr>
         <th><%= @count %></th>
        </tr>
      </thead>

↓「現在・・・」の文言の入っているボックスの横幅を”削除”の部分まで広げたいです
スクリーンショット 2022-05-11 22.49.08.png

↓thと吹き出しで表示のある部分を非表示にしたいと思っています
スクリーンショット 2022-05-11 22.04.14.png

↓検証画面
スクリーンショット 2022-05-11 22.04.39.png

0

3Answer

Comments

  1. @honapon

    Questioner

    コメント+リンクの貼り付け頂きありがとうございます!「結合」という発想が出てこず、初歩的な質問にお手数おかけしました。理想の形に変更できました!

Comments

  1. @honapon

    Questioner

    頂いたアドバイスを元にIF文を書き直したところ、エラーが消えました。
    ただIF文の書き方が間違えているみたいで、当初と変わらず空欄のBOXが出たままの状態で煮詰まっています・・・。

    <tr>
    <th colspan = "9"><% if @count =! nil %>
    <td><%= @count %></td>
    <% else %>
    <td></td>←この部分があるため表示されてしまうのでしょうか??
    <% end %>
    </th>
    </tr>
  2. <tr>
    <th colspan = "9">
    <% if @count =! nil %>
    <td><%= @count %></td>
    <% else %>
    <td></td>
    <% end %>
    </th>
    </tr>

    上記の状態だと、「 @count が nil」の時に
    空のデータセルが表示されるようになっていますが、意図したものですか?
    でなければ、「削除したらどのようになるのか」実際にやって
    動作確認してみてはいかがでしょうか。(大した手間ではありませんし)

    テーブルの作り方についての基礎は以下を参照してください
    https://www.tagindex.com/html_tag/table/table.html

    また、再度の指摘にはなるかと思いますが、
    「@count」には「スケジュールが空だった場合の表示メッセージ」を格納しているので
    用途に合った「@message」などの命名にすることが適切かと思われます。
  3. @honapon

    Questioner

    再質問へのコメントありがとうございます。<td>の消去、条件の終了、htmlの非表示方法など考えてみましたが上手く行かなかったので、一旦controllerのコードを書き直してview側はすっきりと<%= @count %>で表示が出来るやり方にチャレンジしてみたいと思います。命名に関しても、どんどんコードを変更したために変数の趣旨から外れてしまっていたことが分かりました。ご指摘ありがとうございます!

①は上の方のcolspan
②は

        <tr>
         <th><%= @count %></th>
        </tr>

の部分を@countnilではないとき、のif文で囲ってあげれば良いと思います。

0Like

Comments

  1. @honapon

    Questioner

    回答ありがとうございます。①については希望通りに変更が完了しました!その後②のIF文を書き足そうとしましたが上手く反映されなくて悪戦苦闘しています・・・。if @count =! nil の部分が間違えているのでしょうか??

    <tr>
    <th colspan = "9"><%= if @count =! nil %>
    <td><%= @count %></td>
    <% else %>
    <td></td>
    <% end %>
    </th>
    </tr>
  2. @honapon

    Questioner

    ifの左の"="を消したところエラーが解消されました。

Your answer might help someone💌