Make a dynamic form in Rails

Let the routing work

I expect to have a form to be filled in localhost:3000/articles/new, but there is on such route yet. Thus, we need to do something with routes.rb.

That resource :articles creates the methods a dynamic web app needs.

The router passes the request to the controller, so we’ll deal with the controller next.

Create articles_controller.rb file under controllers file. Add the new method first.

When you see missing template, it means the controller needs a view. Create new.html.erb under /views/articles file.

Add content using form helper

Start with new method

We’ll have to initiate an Article instance to collect data as its member variable, which will be stored in the database later. Since controller is the one which manages between model and view, it’s nature to initiate Article instance inside the controller.

As for erb syntax, if you render something in the UI, you would need to add a “=” sign inside the erb tag.

create method

create method with strong parameters

Strong Parameters were Deigned to protect database from being hacked. It only allows the attributes inside model with permission to be saved.

This successfully hit the database. Make some revision.

The conventional way of create method. Add flash to tell users article successfully created.

def create
@article = Article.new(article_params)
if @article.save
flash[:notice] = "Article was successfully created"
redirect_to article_path(@article)
else #validation failed
render 'new'
end
end

We want the success message to show in show page. We can simply custom the flash message to every page by modifying application.html.erb.

What if the validation failed, we want to tell the users what errors have been made. This message should be shown on the render ‘new’ page, so add the code in new.html.erb.

Try it out!

Since we didn’t have “show” action, the form stays there. So, let’s go on with “show”. Inside articles_controller.rb,

def show
@article = Article.find(params[:id])
end

Then add show.html.erb inside views/articles file.

<h1>Showing selected Article</h1>
<p>
Title: <%= @article.title %>
</p>
<p>
Description: <%= @article.description %>
</p>

Editing articles

So we’ll start with the controller and the view page. Just to make sure the web page works.

Make the edit form

Just like the “new” form submission was handled by “create” action, “edit” form submission was handled by “update” action.

Article Listing

Add code to controller and view test out if it works.

Use erb to iterate through the article.

Delete Article

Add destroy action inside articles_controller.rb.

def destroy
@article = Article.find(params[:id])
@article.destroy
flash[:notice] = "Article was successfully deleted"
redirect_to articles_path
end

Add the method while deleting it.

partial form

new.html.erb and edit.html.erb have WET code. It’s better to write a partial code and use it like a function. Create _form.html.erb and paste the repeated code inside. Replace the repeated part in new.html.erb and edit.html.erb with <%= render 'form' %>

before action to write DRY code

There are 4 repeated code, and it’s good convention to make it into function.

private
def set_article
@article = Article.find(params[:id])
end

Then simply use before_action to call the function.