Skip to content

Instantly share code, notes, and snippets.

@ali-sheiba
Last active July 24, 2024 07:49
Show Gist options
  • Save ali-sheiba/74e7d1c0591c43f8e97b9ffff28d7bf0 to your computer and use it in GitHub Desktop.
Save ali-sheiba/74e7d1c0591c43f8e97b9ffff28d7bf0 to your computer and use it in GitHub Desktop.
Rails scaffold with Bootstrap 4
<%%= form_with(model: <%= model_resource_name %>, local: true) do |form| %>
<div class="card mb-4">
<div class="card-body">
<%% if <%= singular_table_name %>.errors.any? %>
<div id="error_explanation" class="alert alert-danger">
<h2 class="h4"><%%= pluralize(<%= singular_table_name %>.errors.count, "error") %> prohibited this <%= singular_table_name %> from being saved:</h2>
<ul>
<%% <%= singular_table_name %>.errors.full_messages.each do |message| %>
<li><%%= message %></li>
<%% end %>
</ul>
</div>
<%% end %>
<% attributes.each do |attribute| -%>
<div class="form-group">
<% if attribute.password_digest? -%>
<%%= form.label :password %>
<%%= form.password_field :password, class: 'form-control' %>
</div>
<div class="form-group">
<%%= form.label :password_confirmation %>
<%%= form.password_field :password_confirmation, class: 'form-control' %>
<% else -%>
<%%= form.label :<%= attribute.column_name %> %>
<%%= form.<%= attribute.field_type %> :<%= attribute.column_name %>, class: 'form-control' %>
<% end -%>
</div>
<% end -%>
<div class="form-group mb-0">
<%% if <%= model_resource_name %>.persisted? %>
<div class="float-right">
<%%= link_to 'Destroy', <%= model_resource_name %>, method: :delete, class: "text-danger", data: { confirm: 'Are you sure?' } %>
</div>
<%% end %>
<%%= form.submit class: 'btn btn-primary' %>
<%% if <%= model_resource_name %>.persisted? %>
<%%= link_to "Cancel", <%= model_resource_name %>, class: "btn btn-link" %>
<%% else %>
<%%= link_to "Cancel", <%= index_helper %>_path, class: "btn btn-link" %>
<%% end %>
</div>
</div>
</div>
<%% end %>
<h1>Edit <%= singular_table_name.capitalize %></h1>
<%%= render 'form', <%= singular_table_name %>: @<%= singular_table_name %> %>
<div class="row">
<div class="col-sm-6">
<h1><%= plural_table_name.capitalize %></h1>
</div>
<div class="col-sm-6 text-right">
<%%= link_to "Add New <%= human_name %>", new_<%= singular_table_name %>_path, class: 'btn btn-primary' %>
</div>
</div>
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<%- attributes.each do |attribute| -%>
<th><%= attribute.human_name %></th>
<%- end -%>
<th></th>
</tr>
</thead>
<tbody>
<%% @<%= plural_table_name%>.each do |<%= singular_table_name %>| %>
<%%= content_tag :tr, id: dom_id(<%= singular_table_name %>), class: dom_class(<%= singular_table_name %>) do %>
<%- attributes.each do |attribute| -%>
<td><%%= <%= singular_table_name %>.<%= attribute.name %> %></td>
<%- end -%>
<td><%%= link_to 'Show', <%= singular_table_name %> %></td>
<%% end %>
<%% end %>
</tbody>
</table>
</div>
<h1>New <%= singular_table_name %></h1>
<%%= render 'form', <%= singular_table_name %>: @<%= singular_table_name %> %>
<div class="page-header">
<div class="row">
<div class="col">
<%%= link_to "All <%= plural_table_name.capitalize %>", <%= index_helper %>_path, class: 'btn btn-default' %>
</div>
<div class="col text-right">
<%%= link_to "Edit", edit_<%= singular_table_name %>_path(@<%= singular_table_name %>), class: 'btn btn-primary' %>
</div>
</div>
<h1>Show <%= singular_table_name %></h1>
</div>
<dl class="dl-horizontal">
<%- attributes.each do |attribute| -%>
<dt><%= attribute.human_name %>:</dt>
<dd><%%= @<%= singular_table_name %>.<%= attribute.name %> %></dd>
<%- end -%>
</dl>
@ali-sheiba
Copy link
Author

Copied from https://github.com/excid3/jumpstart with minor changes

Place those files in lib/templates/erb/scaffold

The index columns and form fields will be generated automatically from the scaffold command, example:

rails g scaffold user first_name:string last_name:string

Or just scaffold_controller

rails g scaffold_controller users first_name last_name

@tomash
Copy link

tomash commented Jul 16, 2024

that _form is just a copy of show and will break when called from new

@ali-sheiba
Copy link
Author

ali-sheiba commented Jul 16, 2024

@tomash Ops. I think this should work , I pulled it from old project, I don't use bootstrap anymore

<%%= form_with(model: <%= model_resource_name %>, local: true) do |form| %>
  <div class="card mb-4">
    <div class="card-body">
      <%% if <%= singular_table_name %>.errors.any? %>
        <div id="error_explanation" class="alert alert-danger">
          <h2 class="h4"><%%= pluralize(<%= singular_table_name %>.errors.count, "error") %> prohibited this <%= singular_table_name %> from being saved:</h2>

          <ul>
          <%% <%= singular_table_name %>.errors.full_messages.each do |message| %>
            <li><%%= message %></li>
          <%% end %>
          </ul>
        </div>
      <%% end %>

    <% attributes.each do |attribute| -%>
      <div class="form-group">
    <% if attribute.password_digest? -%>
        <%%= form.label :password %>
        <%%= form.password_field :password, class: 'form-control' %>
      </div>

      <div class="form-group">
        <%%= form.label :password_confirmation %>
        <%%= form.password_field :password_confirmation, class: 'form-control' %>
    <% else -%>
        <%%= form.label :<%= attribute.column_name %> %>
        <%%= form.<%= attribute.field_type %> :<%= attribute.column_name %>, class: 'form-control' %>
    <% end -%>
      </div>

    <% end -%>
      <div class="form-group mb-0">
        <%% if <%= model_resource_name %>.persisted? %>
          <div class="float-right">
            <%%= link_to 'Destroy', <%= model_resource_name %>, method: :delete, class: "text-danger", data: { confirm: 'Are you sure?' } %>
          </div>
        <%% end %>

        <%%= form.submit class: 'btn btn-primary' %>

        <%% if <%= model_resource_name %>.persisted? %>
          <%%= link_to "Cancel", <%= model_resource_name %>, class: "btn btn-link" %>
        <%% else %>
          <%%= link_to "Cancel", <%= index_helper %>_path, class: "btn btn-link" %>
        <%% end %>
      </div>
    </div>
  </div>
<%% end %>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment