SlideShare a Scribd company logo
For each controller there is an associated directory in the
app/views directory which holds the template files that
make up the views associated with that controller. These
files are used to display the view that results from each
controller action.
The final HTML output is a composition of three Rails
elements: Templates, Partials and Layouts
Templates
 Action View templates can be written in several ways.
If the template file has a .erb extension then it uses a
mixture of ERB (included in Ruby) and HTML. If the
template file has a .builder extension then a fresh
instance of Builder::XmlMarkup library is used.
 http://railscasts.com/episodes/269-template-
inheritance
Partials
 Partial templates – usually just called "partials" – are
another device for breaking the rendering process into
more manageable chunks. With partials, you can
extract pieces of code from your templates to separate
files and also reuse them throughout your templates.
 Naming Partials
To render a partial as part of a view, you use the render method
within the view: <%= render "shared/menu“%>
That code will pull in the partial from
app/views/shared/_menu.html.erb.
 Passing Variables to Partials
%h1 User Registration
= form_for :user, url: users_path do |form|
.registration
.details.address.demographics
= render 'shared/address', form: form
%p= form.submit 'Register'
That code will pull in the partial from:
app/views/shared/_address.html.erb.
%p
%label Street
%br
= form.text_area :street, rows: 2, cols: 40
%p
%label City
%br
= form.text_field :city
 Rendering an Object
The render method also provides a shorthand syntax to render an object into a
partial, which strictly depends on Rails naming conventions.
<%= render entry %>
The partial corresponding to _entry.html.haml and gets a local variable named
entry. This is equivalent to the following:
<%= render partial: 'entry', object: entry%>
 Rendering Collections
It is very common that a template needs to iterate over a collection and
render a sub-template for each of the elements. This pattern has
been implemented as a single method that accepts an array and
renders a partial for each one of the elements in the array.
So this example for rendering all the products:
<% @products.each do |product| %>
<%= render partial: "product", locals: { product: product } %>
<% end %>
can be rewritten in a single line:
<%= render partial: "product", collection: @products %>
You can use a shorthand syntax for rendering collections. Assuming
@products is a collection of Product instances, you can simply write
the following to produce the same result:
<%= render @products %>
Layout
 Action View decides which layout to render based on the inheritance
hierarchy of controllers being executed.
 Most Rails applications have an application.html.erb file in their layout
directory. It shares its name with the ApplicationController, which is
typically extended by all the other controllers in an application;
therefore it is picked up as the default layout for all views.
 Within a layout, you have access to three tools for combining different
bits of output to form the overall response:
 Asset tags
 yield and content_for
 Partials
 Asset Tag Helpers
Asset tag helpers provide methods for generating HTML that
link views to feeds, JavaScript, stylesheets, images, videos and
audios. There are six asset tag helpers available in Rails:
 javascript_include_tag
 stylesheet_link_tag
 image_tag
 auto_discovery_link_tag
 video_tag
 audio_tag
 Linking to JavaScript Files with the javascript_include_tag
<%= javascript_include_tag "main" %>
Rails will then output a script tag such as this:
<script src='/assets/main.js'></script>
It will looking for file in app/assets/javascripts/main.js
To include app/assets/javascripts/main.js and
app/assets/javascripts/photos/columns.js:
<%= javascript_include_tag "main", "/photos/columns" %>
To include http://example.com/main.js:
<%= javascript_include_tag "http://example.com/main.js" %>
The same thing for include stylesheet_link_tag
 Understanding yield
Within the context of a layout, yield identifies a section where content from the view should be inserted.
The simplest way to use this is to have a single yield, into which the entire contents of the view
currently being rendered is inserted:
<html>
<head>
</head>
<body>
<%= yield %>
</body>
</html>
You can also create a layout with multiple yielding regions:
<html>
<head>
<%= yield :head %>
</head>
<body>
<%= yield %>
</body>
</html>
The main body of the view will always render into the unnamed yield. To render content into a
named yield, you use the content_for method.
 Using the content_for Method
 The content_for method allows you to insert content into a named yield block in your
layout. For example, this view would work with the layout that you just saw:
<% content_for :head do %>
<title>A simple page</title>
<% end %>
<p>Hello, Rails!</p>
The result of rendering this page into the supplied layout would be this HTML:
<html>
<head>
<title>A simple page</title>
</head>
<body>
<p>Hello, Rails!</p>
</body>
</html>
The content_for method is very helpful when your layout contains distinct regions such as
sidebars and footers that should get their own blocks of content inserted. It's also useful
for inserting tags that load page-specific JavaScript or css files into the header of an
otherwise generic layout.
References
 http://guides.rubyonrails.org/layouts_and_rendering.
html
 Rails 4 way.pdf in dcserver

More Related Content

What's hot

Adrotator in asp
Adrotator in aspAdrotator in asp
Adrotator in asp
Sireesh K
 
Jsp elements
Jsp elementsJsp elements
Jsp elements
Nuha Noor
 
RichControl in Asp.net
RichControl in Asp.netRichControl in Asp.net
RichControl in Asp.netBhumivaghasiya
 
Mvc in symfony
Mvc in symfonyMvc in symfony
Mvc in symfony
Sayed Ahmed
 
Symfony Admin Generator - generator.yml
Symfony Admin Generator - generator.ymlSymfony Admin Generator - generator.yml
Symfony Admin Generator - generator.yml
Ravi Mone
 
Creating Single Page Applications with Oracle Apex
Creating Single Page Applications with Oracle ApexCreating Single Page Applications with Oracle Apex
Creating Single Page Applications with Oracle Apex
Dick Dral
 
JSP Directives
JSP DirectivesJSP Directives
JSP Directives
ShahDhruv21
 
Standard List Controllers
Standard List Controllers Standard List Controllers
Standard List Controllers
Mohammed Safwat Abu Kwaik
 
Getting a Quick Start with Visualforce
Getting a Quick Start with Visualforce Getting a Quick Start with Visualforce
Getting a Quick Start with Visualforce
Mohammed Safwat Abu Kwaik
 
Murach : HOW to work with controllers and routing
Murach : HOW to work with controllers and routingMurach : HOW to work with controllers and routing
Murach : HOW to work with controllers and routing
MahmoudOHassouna
 
MVC Training Part 1
MVC Training Part 1MVC Training Part 1
MVC Training Part 1
Lee Englestone
 
Murach : How to develop a single-page MVC web
Murach : How to develop a single-page MVC web Murach : How to develop a single-page MVC web
Murach : How to develop a single-page MVC web
MahmoudOHassouna
 
Salesforce ANT migration
Salesforce ANT migration Salesforce ANT migration
Salesforce ANT migration
Cloud Analogy
 
'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF
'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF
'Best Practices for Elgg Plugin Developers' Cash Costello #ECSFCondiminds
 
Starting with angular js
Starting with angular js Starting with angular js
Starting with angular js
jagriti srivastava
 
Routing
RoutingRouting
Routing
Amal Subhash
 
Integration of APEX and Oracle Forms
Integration of APEX and Oracle FormsIntegration of APEX and Oracle Forms
Integration of APEX and Oracle Forms
Roel Hartman
 

What's hot (20)

Adrotator in asp
Adrotator in aspAdrotator in asp
Adrotator in asp
 
Jsp elements
Jsp elementsJsp elements
Jsp elements
 
RichControl in Asp.net
RichControl in Asp.netRichControl in Asp.net
RichControl in Asp.net
 
Rails introduction
Rails introductionRails introduction
Rails introduction
 
Mvc in symfony
Mvc in symfonyMvc in symfony
Mvc in symfony
 
Symfony Admin Generator - generator.yml
Symfony Admin Generator - generator.ymlSymfony Admin Generator - generator.yml
Symfony Admin Generator - generator.yml
 
Creating Single Page Applications with Oracle Apex
Creating Single Page Applications with Oracle ApexCreating Single Page Applications with Oracle Apex
Creating Single Page Applications with Oracle Apex
 
JSP Directives
JSP DirectivesJSP Directives
JSP Directives
 
Standard List Controllers
Standard List Controllers Standard List Controllers
Standard List Controllers
 
Getting a Quick Start with Visualforce
Getting a Quick Start with Visualforce Getting a Quick Start with Visualforce
Getting a Quick Start with Visualforce
 
Murach : HOW to work with controllers and routing
Murach : HOW to work with controllers and routingMurach : HOW to work with controllers and routing
Murach : HOW to work with controllers and routing
 
Struts Intro
Struts IntroStruts Intro
Struts Intro
 
MVC Training Part 1
MVC Training Part 1MVC Training Part 1
MVC Training Part 1
 
Murach : How to develop a single-page MVC web
Murach : How to develop a single-page MVC web Murach : How to develop a single-page MVC web
Murach : How to develop a single-page MVC web
 
Salesforce ANT migration
Salesforce ANT migration Salesforce ANT migration
Salesforce ANT migration
 
'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF
'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF
'Best Practices for Elgg Plugin Developers' Cash Costello #ECSF
 
Starting with angular js
Starting with angular js Starting with angular js
Starting with angular js
 
Jsf intro
Jsf introJsf intro
Jsf intro
 
Routing
RoutingRouting
Routing
 
Integration of APEX and Oracle Forms
Integration of APEX and Oracle FormsIntegration of APEX and Oracle Forms
Integration of APEX and Oracle Forms
 

Viewers also liked

Primeface
PrimefacePrimeface
Primeface
serserox
 
Team building
Team buildingTeam building
Team building
subrahmanyam Subbu
 
Ut ultrasonic methode 2
Ut ultrasonic methode 2Ut ultrasonic methode 2
Ut ultrasonic methode 2
thongmuadong
 
Baocao bt7 n15
Baocao bt7 n15Baocao bt7 n15
Baocao bt7 n15
Da To
 
Ngon ngu lap_trinh_c++
Ngon ngu lap_trinh_c++Ngon ngu lap_trinh_c++
Ngon ngu lap_trinh_c++
Da To
 
Matrix2 english
Matrix2 englishMatrix2 english
Matrix2 english
Alfia Magfirona
 
Guia ingreso al curso
Guia ingreso al cursoGuia ingreso al curso
Guia ingreso al curso
dvallester
 
Body language
Body languageBody language
Body language
Ahamed Yasmeen
 
Iaea ndt question
Iaea ndt questionIaea ndt question
Iaea ndt question
thongmuadong
 
Radar and sonar subbu
Radar and sonar subbuRadar and sonar subbu
Radar and sonar subbu
subrahmanyam Subbu
 

Viewers also liked (13)

Jessie lit id
Jessie lit idJessie lit id
Jessie lit id
 
Primeface
PrimefacePrimeface
Primeface
 
Team building
Team buildingTeam building
Team building
 
Ut ultrasonic methode 2
Ut ultrasonic methode 2Ut ultrasonic methode 2
Ut ultrasonic methode 2
 
My lit id
My lit idMy lit id
My lit id
 
Literacy
LiteracyLiteracy
Literacy
 
Baocao bt7 n15
Baocao bt7 n15Baocao bt7 n15
Baocao bt7 n15
 
Ngon ngu lap_trinh_c++
Ngon ngu lap_trinh_c++Ngon ngu lap_trinh_c++
Ngon ngu lap_trinh_c++
 
Matrix2 english
Matrix2 englishMatrix2 english
Matrix2 english
 
Guia ingreso al curso
Guia ingreso al cursoGuia ingreso al curso
Guia ingreso al curso
 
Body language
Body languageBody language
Body language
 
Iaea ndt question
Iaea ndt questionIaea ndt question
Iaea ndt question
 
Radar and sonar subbu
Radar and sonar subbuRadar and sonar subbu
Radar and sonar subbu
 

Similar to Templates, partials and layouts

Actionview
ActionviewActionview
Actionview
Amal Subhash
 
Rails review
Rails reviewRails review
Rails review
Alan Hecht
 
Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Plugins
navjeet
 
RubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendallRubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendalltutorialsruby
 
RubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendallRubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendalltutorialsruby
 
Rails
RailsRails
RailsSHC
 
Template rendering in rails
Template rendering in rails Template rendering in rails
Template rendering in rails
Hung Wu Lo
 
RoR 101: Session 2
RoR 101: Session 2RoR 101: Session 2
RoR 101: Session 2
Rory Gianni
 
Zend Framework Quick Start Walkthrough
Zend Framework Quick Start WalkthroughZend Framework Quick Start Walkthrough
Zend Framework Quick Start Walkthrough
Bradley Holt
 
AEM Sightly Deep Dive
AEM Sightly Deep DiveAEM Sightly Deep Dive
AEM Sightly Deep Dive
Gabriel Walt
 
Web Programming - 7 Blading Template
Web Programming - 7 Blading TemplateWeb Programming - 7 Blading Template
Web Programming - 7 Blading Template
AndiNurkholis1
 
6 introduction-php-mvc-cakephp-m6-views-slides
6 introduction-php-mvc-cakephp-m6-views-slides6 introduction-php-mvc-cakephp-m6-views-slides
6 introduction-php-mvc-cakephp-m6-views-slidesMasterCode.vn
 
Building a dashboard using AngularJS
Building a dashboard using AngularJSBuilding a dashboard using AngularJS
Building a dashboard using AngularJS
RajthilakMCA
 
ReactJS.pptx
ReactJS.pptxReactJS.pptx
ReactJS.pptx
SamyakShetty2
 
Ruby On Rails Siddhesh
Ruby On Rails SiddheshRuby On Rails Siddhesh
Ruby On Rails Siddhesh
Siddhesh Bhobe
 
Overview of MVC Framework - by software outsourcing company india
Overview of MVC Framework - by software outsourcing company indiaOverview of MVC Framework - by software outsourcing company india
Overview of MVC Framework - by software outsourcing company india
Jignesh Aakoliya
 
Asp.Net 2.0 Presentation
Asp.Net 2.0 PresentationAsp.Net 2.0 Presentation
Asp.Net 2.0 Presentationsasidhar
 

Similar to Templates, partials and layouts (20)

Actionview
ActionviewActionview
Actionview
 
Rails review
Rails reviewRails review
Rails review
 
Useful Rails Plugins
Useful Rails PluginsUseful Rails Plugins
Useful Rails Plugins
 
RubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendallRubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendall
 
RubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendallRubyOnRails-Cheatsheet-BlaineKendall
RubyOnRails-Cheatsheet-BlaineKendall
 
Ruby on rails RAD
Ruby on rails RADRuby on rails RAD
Ruby on rails RAD
 
Rails
RailsRails
Rails
 
Template rendering in rails
Template rendering in rails Template rendering in rails
Template rendering in rails
 
RoR 101: Session 2
RoR 101: Session 2RoR 101: Session 2
RoR 101: Session 2
 
Zend Framework Quick Start Walkthrough
Zend Framework Quick Start WalkthroughZend Framework Quick Start Walkthrough
Zend Framework Quick Start Walkthrough
 
AEM Sightly Deep Dive
AEM Sightly Deep DiveAEM Sightly Deep Dive
AEM Sightly Deep Dive
 
Web Programming - 7 Blading Template
Web Programming - 7 Blading TemplateWeb Programming - 7 Blading Template
Web Programming - 7 Blading Template
 
6 introduction-php-mvc-cakephp-m6-views-slides
6 introduction-php-mvc-cakephp-m6-views-slides6 introduction-php-mvc-cakephp-m6-views-slides
6 introduction-php-mvc-cakephp-m6-views-slides
 
The Rails Way
The Rails WayThe Rails Way
The Rails Way
 
Building a dashboard using AngularJS
Building a dashboard using AngularJSBuilding a dashboard using AngularJS
Building a dashboard using AngularJS
 
ReactJS.pptx
ReactJS.pptxReactJS.pptx
ReactJS.pptx
 
Ruby On Rails Siddhesh
Ruby On Rails SiddheshRuby On Rails Siddhesh
Ruby On Rails Siddhesh
 
Overview of MVC Framework - by software outsourcing company india
Overview of MVC Framework - by software outsourcing company indiaOverview of MVC Framework - by software outsourcing company india
Overview of MVC Framework - by software outsourcing company india
 
Session 1
Session 1Session 1
Session 1
 
Asp.Net 2.0 Presentation
Asp.Net 2.0 PresentationAsp.Net 2.0 Presentation
Asp.Net 2.0 Presentation
 

Recently uploaded

amptalk_RecruitingDeck_english_2024.06.05
amptalk_RecruitingDeck_english_2024.06.05amptalk_RecruitingDeck_english_2024.06.05
amptalk_RecruitingDeck_english_2024.06.05
marketing317746
 
The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...
balatucanapplelovely
 
-- June 2024 is National Volunteer Month --
-- June 2024 is National Volunteer Month ---- June 2024 is National Volunteer Month --
-- June 2024 is National Volunteer Month --
NZSG
 
Discover the innovative and creative projects that highlight my journey throu...
Discover the innovative and creative projects that highlight my journey throu...Discover the innovative and creative projects that highlight my journey throu...
Discover the innovative and creative projects that highlight my journey throu...
dylandmeas
 
Exploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social DreamingExploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social Dreaming
Nicola Wreford-Howard
 
Building Your Employer Brand with Social Media
Building Your Employer Brand with Social MediaBuilding Your Employer Brand with Social Media
Building Your Employer Brand with Social Media
LuanWise
 
Sustainability: Balancing the Environment, Equity & Economy
Sustainability: Balancing the Environment, Equity & EconomySustainability: Balancing the Environment, Equity & Economy
Sustainability: Balancing the Environment, Equity & Economy
Operational Excellence Consulting
 
Company Valuation webinar series - Tuesday, 4 June 2024
Company Valuation webinar series - Tuesday, 4 June 2024Company Valuation webinar series - Tuesday, 4 June 2024
Company Valuation webinar series - Tuesday, 4 June 2024
FelixPerez547899
 
Authentically Social Presented by Corey Perlman
Authentically Social Presented by Corey PerlmanAuthentically Social Presented by Corey Perlman
Authentically Social Presented by Corey Perlman
Corey Perlman, Social Media Speaker and Consultant
 
Project File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdfProject File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdf
RajPriye
 
Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...
Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...
Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...
SOFTTECHHUB
 
Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)
Lviv Startup Club
 
Event Report - SAP Sapphire 2024 Orlando - lots of innovation and old challenges
Event Report - SAP Sapphire 2024 Orlando - lots of innovation and old challengesEvent Report - SAP Sapphire 2024 Orlando - lots of innovation and old challenges
Event Report - SAP Sapphire 2024 Orlando - lots of innovation and old challenges
Holger Mueller
 
Search Disrupted Google’s Leaked Documents Rock the SEO World.pdf
Search Disrupted Google’s Leaked Documents Rock the SEO World.pdfSearch Disrupted Google’s Leaked Documents Rock the SEO World.pdf
Search Disrupted Google’s Leaked Documents Rock the SEO World.pdf
Arihant Webtech Pvt. Ltd
 
Set off and carry forward of losses and assessment of individuals.pptx
Set off and carry forward of losses and assessment of individuals.pptxSet off and carry forward of losses and assessment of individuals.pptx
Set off and carry forward of losses and assessment of individuals.pptx
HARSHITHV26
 
一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理
一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理
一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理
taqyed
 
3.0 Project 2_ Developing My Brand Identity Kit.pptx
3.0 Project 2_ Developing My Brand Identity Kit.pptx3.0 Project 2_ Developing My Brand Identity Kit.pptx
3.0 Project 2_ Developing My Brand Identity Kit.pptx
tanyjahb
 
An introduction to the cryptocurrency investment platform Binance Savings.
An introduction to the cryptocurrency investment platform Binance Savings.An introduction to the cryptocurrency investment platform Binance Savings.
An introduction to the cryptocurrency investment platform Binance Savings.
Any kyc Account
 
Bài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.doc
Bài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.docBài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.doc
Bài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.doc
daothibichhang1
 
Putting the SPARK into Virtual Training.pptx
Putting the SPARK into Virtual Training.pptxPutting the SPARK into Virtual Training.pptx
Putting the SPARK into Virtual Training.pptx
Cynthia Clay
 

Recently uploaded (20)

amptalk_RecruitingDeck_english_2024.06.05
amptalk_RecruitingDeck_english_2024.06.05amptalk_RecruitingDeck_english_2024.06.05
amptalk_RecruitingDeck_english_2024.06.05
 
The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...
 
-- June 2024 is National Volunteer Month --
-- June 2024 is National Volunteer Month ---- June 2024 is National Volunteer Month --
-- June 2024 is National Volunteer Month --
 
Discover the innovative and creative projects that highlight my journey throu...
Discover the innovative and creative projects that highlight my journey throu...Discover the innovative and creative projects that highlight my journey throu...
Discover the innovative and creative projects that highlight my journey throu...
 
Exploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social DreamingExploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social Dreaming
 
Building Your Employer Brand with Social Media
Building Your Employer Brand with Social MediaBuilding Your Employer Brand with Social Media
Building Your Employer Brand with Social Media
 
Sustainability: Balancing the Environment, Equity & Economy
Sustainability: Balancing the Environment, Equity & EconomySustainability: Balancing the Environment, Equity & Economy
Sustainability: Balancing the Environment, Equity & Economy
 
Company Valuation webinar series - Tuesday, 4 June 2024
Company Valuation webinar series - Tuesday, 4 June 2024Company Valuation webinar series - Tuesday, 4 June 2024
Company Valuation webinar series - Tuesday, 4 June 2024
 
Authentically Social Presented by Corey Perlman
Authentically Social Presented by Corey PerlmanAuthentically Social Presented by Corey Perlman
Authentically Social Presented by Corey Perlman
 
Project File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdfProject File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdf
 
Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...
Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...
Hamster Kombat' Telegram Game Surpasses 100 Million Players—Token Release Sch...
 
Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)
 
Event Report - SAP Sapphire 2024 Orlando - lots of innovation and old challenges
Event Report - SAP Sapphire 2024 Orlando - lots of innovation and old challengesEvent Report - SAP Sapphire 2024 Orlando - lots of innovation and old challenges
Event Report - SAP Sapphire 2024 Orlando - lots of innovation and old challenges
 
Search Disrupted Google’s Leaked Documents Rock the SEO World.pdf
Search Disrupted Google’s Leaked Documents Rock the SEO World.pdfSearch Disrupted Google’s Leaked Documents Rock the SEO World.pdf
Search Disrupted Google’s Leaked Documents Rock the SEO World.pdf
 
Set off and carry forward of losses and assessment of individuals.pptx
Set off and carry forward of losses and assessment of individuals.pptxSet off and carry forward of losses and assessment of individuals.pptx
Set off and carry forward of losses and assessment of individuals.pptx
 
一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理
一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理
一比一原版加拿大渥太华大学毕业证(uottawa毕业证书)如何办理
 
3.0 Project 2_ Developing My Brand Identity Kit.pptx
3.0 Project 2_ Developing My Brand Identity Kit.pptx3.0 Project 2_ Developing My Brand Identity Kit.pptx
3.0 Project 2_ Developing My Brand Identity Kit.pptx
 
An introduction to the cryptocurrency investment platform Binance Savings.
An introduction to the cryptocurrency investment platform Binance Savings.An introduction to the cryptocurrency investment platform Binance Savings.
An introduction to the cryptocurrency investment platform Binance Savings.
 
Bài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.doc
Bài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.docBài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.doc
Bài tập - Tiếng anh 11 Global Success UNIT 1 - Bản HS.doc
 
Putting the SPARK into Virtual Training.pptx
Putting the SPARK into Virtual Training.pptxPutting the SPARK into Virtual Training.pptx
Putting the SPARK into Virtual Training.pptx
 

Templates, partials and layouts

  • 1. For each controller there is an associated directory in the app/views directory which holds the template files that make up the views associated with that controller. These files are used to display the view that results from each controller action. The final HTML output is a composition of three Rails elements: Templates, Partials and Layouts
  • 2. Templates  Action View templates can be written in several ways. If the template file has a .erb extension then it uses a mixture of ERB (included in Ruby) and HTML. If the template file has a .builder extension then a fresh instance of Builder::XmlMarkup library is used.  http://railscasts.com/episodes/269-template- inheritance
  • 3. Partials  Partial templates – usually just called "partials" – are another device for breaking the rendering process into more manageable chunks. With partials, you can extract pieces of code from your templates to separate files and also reuse them throughout your templates.  Naming Partials To render a partial as part of a view, you use the render method within the view: <%= render "shared/menu“%> That code will pull in the partial from app/views/shared/_menu.html.erb.
  • 4.  Passing Variables to Partials %h1 User Registration = form_for :user, url: users_path do |form| .registration .details.address.demographics = render 'shared/address', form: form %p= form.submit 'Register' That code will pull in the partial from: app/views/shared/_address.html.erb. %p %label Street %br = form.text_area :street, rows: 2, cols: 40 %p %label City %br = form.text_field :city
  • 5.  Rendering an Object The render method also provides a shorthand syntax to render an object into a partial, which strictly depends on Rails naming conventions. <%= render entry %> The partial corresponding to _entry.html.haml and gets a local variable named entry. This is equivalent to the following: <%= render partial: 'entry', object: entry%>
  • 6.  Rendering Collections It is very common that a template needs to iterate over a collection and render a sub-template for each of the elements. This pattern has been implemented as a single method that accepts an array and renders a partial for each one of the elements in the array. So this example for rendering all the products: <% @products.each do |product| %> <%= render partial: "product", locals: { product: product } %> <% end %> can be rewritten in a single line: <%= render partial: "product", collection: @products %> You can use a shorthand syntax for rendering collections. Assuming @products is a collection of Product instances, you can simply write the following to produce the same result: <%= render @products %>
  • 7. Layout  Action View decides which layout to render based on the inheritance hierarchy of controllers being executed.  Most Rails applications have an application.html.erb file in their layout directory. It shares its name with the ApplicationController, which is typically extended by all the other controllers in an application; therefore it is picked up as the default layout for all views.  Within a layout, you have access to three tools for combining different bits of output to form the overall response:  Asset tags  yield and content_for  Partials
  • 8.  Asset Tag Helpers Asset tag helpers provide methods for generating HTML that link views to feeds, JavaScript, stylesheets, images, videos and audios. There are six asset tag helpers available in Rails:  javascript_include_tag  stylesheet_link_tag  image_tag  auto_discovery_link_tag  video_tag  audio_tag
  • 9.  Linking to JavaScript Files with the javascript_include_tag <%= javascript_include_tag "main" %> Rails will then output a script tag such as this: <script src='/assets/main.js'></script> It will looking for file in app/assets/javascripts/main.js To include app/assets/javascripts/main.js and app/assets/javascripts/photos/columns.js: <%= javascript_include_tag "main", "/photos/columns" %> To include http://example.com/main.js: <%= javascript_include_tag "http://example.com/main.js" %> The same thing for include stylesheet_link_tag
  • 10.  Understanding yield Within the context of a layout, yield identifies a section where content from the view should be inserted. The simplest way to use this is to have a single yield, into which the entire contents of the view currently being rendered is inserted: <html> <head> </head> <body> <%= yield %> </body> </html> You can also create a layout with multiple yielding regions: <html> <head> <%= yield :head %> </head> <body> <%= yield %> </body> </html> The main body of the view will always render into the unnamed yield. To render content into a named yield, you use the content_for method.
  • 11.  Using the content_for Method  The content_for method allows you to insert content into a named yield block in your layout. For example, this view would work with the layout that you just saw: <% content_for :head do %> <title>A simple page</title> <% end %> <p>Hello, Rails!</p> The result of rendering this page into the supplied layout would be this HTML: <html> <head> <title>A simple page</title> </head> <body> <p>Hello, Rails!</p> </body> </html> The content_for method is very helpful when your layout contains distinct regions such as sidebars and footers that should get their own blocks of content inserted. It's also useful for inserting tags that load page-specific JavaScript or css files into the header of an otherwise generic layout.