عرض مصدر Rails/action view overview

<noinclude>{{DISPLAYTITLE:نظرة عامة على وحدة العرض في ريلز}}</noinclude>
[[تصنيف:Rails]]
[[تصنيف:Rails View]]
بعد قراءة هذا الدليل، ستعرف:
* ما هو [[Rails/action view|Action View]] وكيفية استخدامه مع ريلز.
* أفضل طريقة لاستخدام القوالب والجزئيات (partials) والتخطيطات.
* ما الذي يقدمه المساعدون عن طريق [[Rails/action view|Action View]].
* كيفية استخدام العروض المحلية.

== ما هو Action View؟ ==
في ريلز، تُعَالَج طلبات الويب من خلال [[Rails/action controller overview|Action Controller]] و [[Rails/action view|Action View]]. عادةً ما يقع على عاتق وحدة التحكم التواصل مع قاعدة البيانات وتنفيذ الإجراءات CRUD عند الضرورة؛ بعد ذلك، يكون [[Rails/action view|Action View]] مسؤولًا عن تفسير (compiling) الاستجابة.

تُكتَب قوالب [[Rails/action view|Action View]] باستخدام [[Ruby|روبي]] المضمّنة بالوسوم التي تمزج مع [[HTML]]. لتجنب ازدحام القوالب بشيفرة نمطية، يوفر عدد من أصناف المساعد سلوكًا شائعًا للنماذج والتواريخ والسلاسل النصية. من السهل أيضًا إضافة مساعدين جدد إلى تطبيقك أثناء تطويره.

'''ملاحظة''': ترتبط بعض ميزات [[Rails/action view|Action View]] بـ [[Rails/active record basics|Active Record]]، ولكن هذا لا يعني أن [[Rails/action view|Action View]] يعتمد على [[Rails/active record basics|Active Record]]. إنَّ [[Rails/action view|Action View]] هو حزمة مستقلة يمكن استخدامها مع أي نوع من مكتبات [[Ruby|روبي]].

== استخدام Action View مع ريلز ==
هناك مجلد مرتبط في المجلد app/views لكل وحدة تحكم الذي يحتفظ بملفات القالب التي تشكل العروض المرتبطة بوحدة التحكم هذه. تُستخدَم هذه الملفات لعرض الشكل التي تنتج من كل [[Rails/action controller overview|Action Controller]].

دعنا نلقي نظرة على ما يفعله ريلز افتراضيَّا عند إنشاء مصدر جديد باستخدام المولد Scaffold:<syntaxhighlight lang="shell">
$ bin/rails generate scaffold article
      [...]
      invoke  scaffold_controller
      create    app/controllers/articles_controller.rb
      invoke    erb
      create      app/views/articles
      create      app/views/articles/index.html.erb
      create      app/views/articles/edit.html.erb
      create      app/views/articles/show.html.erb
      create      app/views/articles/new.html.erb
      create      app/views/articles/_form.html.erb
      [...]
</syntaxhighlight>يوجد اصطلاح تسمية للعروض في ريلز. عادةً ما تشارك العروض اسمَها مع Action Controller المرتبط، كما ترى أعلاه. على سبيل المثال، سيستخدم فهرس حدث وحدة التحكم article_controller.rb ملف العرض index.html.erb في المجلد app/views/articles. الملف HTML الكامل المعاد إلى العميل يتكون من مزيج من الملف ERB هذا، وقالب تخطيط يغلفه، وكل الجزئيات (partials) التي يشير إليها العرض. ضمن هذا الدليل، ستجد توثيقًا أكثر تفصيلًا حول كل من هذه المكونات الثلاثة.

== القوالب والجزئيات والتخطيطات ==
كما ذكرنا، فإن ناتج HTML النهائي هو عبارة عن تركيبة تتألف من ثلاثة عناصر هي: القوالب والجزئيات والتخطيطات. فيما يلي نظرة عامة موجزة لكل منها.

=== القوالب ===
يمكن كتابة قوالب [[Rails/action view|Action View]] بعدة طرق. إذا كان ملف القالب بامتداد <code>erb.</code>، فإنه يستخدم خليطًا من ERB ([[Ruby|روبي]] المضمَّنة [Embedded Ruby]) و [[HTML]]. إذا كان ملف القالب بامتداد <code>builder.</code>، فستُستخدَم المكتبة <code>Builder::XmlMarkup</code>.

يدعم ريلز أنظمة القوالب المتعددة ويستخدم امتدادًا للملف للتمييز بينها. على سبيل المثال، يملك الملف HTML المستخدِم لنظام القالب ERB الامتداد <code>html.erb.</code> كامتداد للملف.

==== القالب ERB ====
داخل قالب ERB، يمكن تضمين شيفرة [[Ruby|روبي]] باستخدام الوسم <code><% %></code> والوسم ‎<code><%= %>‎</code>. تُستخدَم الوسوم <code><% %></code> لتنفيذ شيفرة [[Ruby|روبي]] التي لا تعيد شيئًا، مثل الشروط أو الحلقات التكرارية أو الكُتَل، وتُستخدَم الوسوم ‎<code><%= %>‎</code> عندما تريد الحصول على مخرجات من الشيفرة.

تأمل الحلقة التكرارية التالية للأسماء:<syntaxhighlight lang="html">
<h1>Names of all the people</h1>
<% @people.each do |person| %>
  Name: <%= person.name %><br>
<% end %>
</syntaxhighlight>تنفَّذ الحلقة التكرارية باستخدام وسوم التضمين العادية (<code><% %></code>) ويُدرَج الاسم في ملف [[HTML]] باستخدام وسوم تضمين المخرجات (‎<code><%= %>‎</code>). لاحظ أن هذا ليس مجرد اقتراح للاستخدام: لن تصيَّر دوال الإخراج العادية مثل <code>print</code> و <code>puts</code> في العرض باستخدام قوالب ERB. لذلك، ستكون الشيفرة التالية خطأً:<syntaxhighlight lang="html">
<%# WRONG %>
Hi, Mr. <% puts "Frodo" %>


</syntaxhighlight>لإزالة المسافات البيضاء السابقة واللاحقة، يمكنك استخدام <code><%- -%></code> بدلًا من <code><%</code> و <code>%></code>.

==== Builder ====
القوالب Builder بديل أكثر قابلية للبرمجة عن القوالب ERB، وهي مفيدة بشكل خاص لتوليد محتوى [[XML]]. يُتَاح الكائن <code>XmlMarkup</code> المسمى <code>xml</code> تلقائيًا للقوالب ذات الامتداد <code>builder.</code>.

هُنا بعض الأمثلة الأساسية:<syntaxhighlight lang="rails">
xml.em("emphasized")
xml.em { xml.b("emph & bold") }
xml.a("A Link", "href" => "http://rubyonrails.org")
xml.target("name" => "compile", "option" => "fast")
</syntaxhighlight>التي تُنتِج:<syntaxhighlight lang="html">
<em>emphasized</em>
<em><b>emph &amp; bold</b></em>
<a href="http://rubyonrails.org">A link</a>
<target option="fast" name="compile" />
</syntaxhighlight>سيُتَعامَل مع أي دالة تحوي كتلةً كوسم ترميز XML مع ترميز متداخل في الكتلة. على سبيل المثال، ما يلي:<syntaxhighlight lang="rails">
xml.div {
  xml.h1(@person.name)
  xml.p(@person.bio)
}
</syntaxhighlight>قد ينتج شيئًا مثل:<syntaxhighlight lang="html">
<div>
  <h1>David Heinemeier Hansson</h1>
  <p>A product of Danish Design during the Winter of '79...</p>
</div>
</syntaxhighlight>فيما يلي مثال RSS كامل الطول مستخدم فعليًا في Basecamp:<syntaxhighlight lang="rails">
xml.rss("version" => "2.0", "xmlns:dc" => "http://purl.org/dc/elements/1.1/") do
  xml.channel do
    xml.title(@feed_title)
    xml.link(@url)
    xml.description "Basecamp: Recent items"
    xml.language "en-us"
    xml.ttl "40"
 
    for item in @recent_items
      xml.item do
        xml.title(item_title(item))
        xml.description(item_description(item)) if item_description(item)
        xml.pubDate(item_pubDate(item))
        xml.guid(@person.firm.account.url + @recent_items.url(item))
        xml.link(@person.firm.account.url + @recent_items.url(item))
        xml.tag!("dc:creator", item.author_name) if item_has_creator?(item)
      end
    end
  end
end
</syntaxhighlight>

==== Jbuilder ====
إن قوالب [https://github.com/rails/jbuilder Jbuilder] عبارة عن جوهرة يُحسِّنُها فريق ريلز وتُضمَّن في Gemfile الافتراضي الخاص بريلز. هذه القوالب مشابهة للقوالب Builder، ولكنها تُستخدم لإنشاء JSON، بدلًا من XML.

إذا لم تملك هذه الجوهرة، يمكنك إضافتها إلى Gemfile بتنفيذ السطر التالي:<syntaxhighlight lang="rails">
gem 'jbuilder'
</syntaxhighlight>يُتَاح كائن Jbuilder المسمى json تلقائيًا للقوالب ذات الامتداد <code>jbuilder.</code>.

هنا مثال أساسي:<syntaxhighlight lang="rails">
json.name("Alex")
json.email("alex@example.com")
</syntaxhighlight>ستُنتِج:<syntaxhighlight lang="json">
{
  "name": "Alex",
  "email": "alex@example.com"
}
</syntaxhighlight>راجع [https://github.com/rails/jbuilder#jbuilder توثيق Jbuilder] لمزيد من الأمثلة والمعلومات.

==== قالب التخزين المؤقت ====
بشكل افتراضي، ستُصرِّف ريلز كل قالب إلى دالة لتصييره وعرضه. عندما تُغيِّر قالبًا، سيفحص ريلز وقت تعديل الملف ويُعيد تصريفه في وضع التطوير.

=== الجزئيات ===
القوالب الجزئية (Partial templates) -تسمى "الجزئيات" (partials) عادةً- هي أداة أخرى لكسر عملية التصير إلى أجزاء أكثر قابلية للإدارة. باستخدام الجزئيات، يمكنك استخراج أجزاء من الشيفرة البرمجية من قوالبك لفصل الملفات وإعادة استخدامها أيضًا في جميع القوالب.

==== تسمية الجزئيات ====
لتصيير جزئية بفرض أنها جزءٌ من عرض، استخدم التابع <code>render</code> ضمن العرض:<syntaxhighlight lang="html">
<%= render "menu" %>
</syntaxhighlight>سيصيّر هذا ملفًا باسم menu.html.erb_ في تلك النقطة داخل العرض الذي يصيَّر. لاحظ الشَرطة البادئة السفلية؛ تُسمَّى الجزئيات باستخدام شرطة بادئة سفلية لتمييزها عن العروض العادية، حتى لو أُشِير إليها بدون شَرطة سُفلية. هذا صحيح حتى عند سحب جزئية من مجلد آخر:<syntaxhighlight lang="html">
<%= render "shared/menu" %>
</syntaxhighlight>ستسحب هذه الشيفرة في الجزئية من app/views/shared/_menu.html.erb.

==== استخدام الجزئيات لتبسيط العروض ====
إحدى الطرق لاستخدام الجزئيات هو معاملتها على أنها مكافئةٌ للوظائف الفرعية أو طريقةٌ لنقل التفاصيل خارج العرض بحيث يمكنك فهم ما يجري بسهولة أكبر. على سبيل المثال، قد يكون لديك عرض يشبه هذا:<syntaxhighlight lang="html">
<%= render "shared/ad_banner" %>
 
<h1>Products</h1>
 
<p>Here are a few of our fine products:</p>
<% @products.each do |product| %>
  <%= render partial: "product", locals: { product: product } %>
<% end %>
 
<%= render "shared/footer" %>
</syntaxhighlight>هنا، يمكن أن تحتوي الجزئيتان ‎_ad_banner.html.erb و ‎_footer.html.erb على محتوى يُشارَك بين العديد من الصفحات في تطبيقك. لست بحاجة إلى الاطلاع على تفاصيل هذه الأقسام عند التركيز على صفحة معينة.

==== تصيير بدون الخيارين <code>partial</code> و <code>locals</code> ====
في المثال أعلاه، يأخذ <code>render</code> خيارين هما: <code>partial</code> و <code>locals</code>. ولكن إذا كان هذان الخياران هما الخيارين اللذين تريد استعمالهما، فيمكنك تخطي استخدامهما ببساطة. على سبيل المثال، بدلًا من:<syntaxhighlight lang="html">
<%= render partial: "product", locals: { product: @product } %>
</syntaxhighlight>يمكنك أيضًا فِعل ما يلي:<syntaxhighlight lang="html">
<%= render "product", product: @product %>
</syntaxhighlight>

==== الخياران <code>as</code> و <code>object</code> ====
بشكل افتراضي، يحتوي <code>ActionView::Partials::PartialRenderer</code> على كائنه الخاص في متغير محلي بنفس الاسم مثل القالب. لذلك، كتابة:<syntaxhighlight lang="html">
<%= render partial: "product" %>
</syntaxhighlight>ضمن الجزئية ‎_product سيؤدي إلى الحصول على <code>product@</code> في المتغير المحلي <code>product</code>؛ أي  كما لو أننا قد كتبنا:<syntaxhighlight lang="html">
<%= render partial: "product", locals: { product: @product } %>
</syntaxhighlight>يمكن استخدام الخيار <code>object</code> لتحديد الكائن الذي يُعرَض مباشرة داخل الجزئية، وهو مفيد عندما يكون كائن القالب في مكان آخر (على سبيل المثال في متغير نسخة مختلف أو في متغير محلي).

على سبيل المثال، بدلًا من كتابة:<syntaxhighlight lang="html">
<%= render partial: "product", locals: { product: @item } %>
</syntaxhighlight>سنكتب:<syntaxhighlight lang="html">
<%= render partial: "product", object: @item %> 
</syntaxhighlight>مع الخيار <code>as</code>، يمكننا تحديد اسم مختلف للمتغير المحلي المذكور. على سبيل المثال، إذا أردنا أن يكون <code>item</code> بدلًا من <code>product</code>، فسنكتب ما يلي:<syntaxhighlight lang="html">
<%= render partial: "product", object: @item, as: "item" %>
</syntaxhighlight>هذا يعادل:<syntaxhighlight lang="html">
<%= render partial: "product", locals: { item: @item } %>
</syntaxhighlight>

=== تصيير المجموعات ===
من الشائع جدًا أن يحتاج القالب إلى التكرار عبر مجموعة ما وأن يصيِّر قالبًا فرعيًا لكل عنصر من عناصره. يُنفِّذ هذا النمط كتابع وحيد يقبل مصفوفة ويصيِّر جزئيَّةً لكل عنصر من العناصر في تلك المصفوفة. لذلك، المثال التالي الذي يعرض جميع المنتجات:<syntaxhighlight lang="html">
<% @products.each do |product| %>
  <%= render partial: "product", locals: { product: product } %>
<% end %>
</syntaxhighlight>يمكن إعادة كتابته في سطر واحد:<syntaxhighlight lang="html">
<%= render partial: "product", collection: @products %>
</syntaxhighlight>عند استدعاء جزئية ما مع مجموعة، تملك النسخ الفردية للجزئية حق الوصول إلى عضو المجموعة الذي يُصيَّر عبر متغير مسمى بعد الجزئية. في هذه الحالة، الجزئية هي product_، وضمنها يمكنك الرجوع إلى المنتج <code>product</code> للحصول على عضو المجموعة الذي يُصيَّر.

يمكنك استخدام صيغة مختصرة لتصيير المجموعات. بافتراض أن ‎<code>@products</code> عبارة عن مجموعة من النسخ <code>product</code>، يمكنك ببساطة كتابة ما يلي لتوليد النتيجة نفسها:<syntaxhighlight lang="html">
<%= render @products %>
</syntaxhighlight>يحدد ريلز اسم الجزئية المراد استخدامها من خلال النظر إلى اسم النموذج في المجموعة، هو <code>Product</code> في هذه الحالة. في الواقع، يمكنك حتى تصيير مجموعة تتكون من نسخ لنماذج مختلفة باستخدام هذا الاختزال، وسيختار ريلز الجزئية المناسبة لكل عضو في المجموعة.

==== قوالب فاصلة ====
يمكنك أيضًا تحديد جزئية ثانية لتصييرها بين نسخ الجزئية الرئيسية باستخدام الخيار ‎<code>:spacer_template</code>:<syntaxhighlight lang="html">
<%= render partial: @products, spacer_template: "product_ruler" %>
</syntaxhighlight>سيصيِّر ريلز الجزئية product_ruler_ (مع عدم تمرير بيانات إليها) بين كل زوج من جزئيات product_.

=== التخطيطات ===
يمكن استخدام التخطيطات (Layouts) لتصيير قالب عرض شائع حول نتائج [[Rails/action controller overview|Action Controller]] في ريلز. عادة، سيكون لتطبيق ريلز بعض التخطيطات التي ستُصيَّر هذه الصفحات ضمنها. على سبيل المثال، قد يحتوي أحد المواقع على تخطيط واحد للمستخدم الذي سجل دخوله وآخر لأحد جوانب التسويق أو المبيعات في الموقع. قد يشمل تخطيط المستخدم المسجل على مستوى أعلى من التنقل يجب أن يكون موجودًا عبر العديد من [[Rails/action controller overview|Action Controller]]. قد يشمل تخطيط المبيعات لتطبيق SaaS مستوى تنقل أعلى لأشياء مثل صفحات "الأسعار" و"اتصل بنا". ينبغي أن تتوقع أن يكون لكل تخطيط شكل ومظهر مختلف. يمكنك القراءة عن التخطيطات بتفصيل أوسع في دليل [[Rails/layouts and rendering|التخطيطات والتصيير]].

== تخطيطات الجزئية ==
يمكن أن يكون للجزئيات (Partials) تخطيطات خاصة بهم مطبقة عليهم فقط. تختلف هذه التخطيطات عن تلك التي تُطَبَّق على [[Rails/action controller overview|Action Controller]]، ولكنها تعمل بطريقة مماثلة.

لنفترض أننا نعرض مقالة على صفحة يجب أن تكون موجودة في <code>[[HTML/div|<nowiki><div></nowiki>]]</code> لأغراض العرض. أولًا، سننشئ مقالة <code>Article</code> جديدة:<syntaxhighlight lang="rails">
Article.create(body: 'Partial Layouts are cool!')
</syntaxhighlight>في قالب العرض، سنعرض الجزئية article_ في تخطيط صندوقي (box layout):

الملف articles/show.html.erb<syntaxhighlight lang="html">
<%= render partial: 'article', layout: 'box', locals: { article: @article } %>
</syntaxhighlight>التخطيط الصندوقي ببساطة يلف الجزئية article_ في عنصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code>:

الملف articles/_box.html.erb<syntaxhighlight lang="html">
<div class='box'>
  <%= yield %>
</div>
</syntaxhighlight>لاحظ أن تخطيط الجزئية يمكنه الوصول إلى المتغير <code>article</code> المحلي الذي مُرِّر عند استدعاء <code>render</code>. ومع ذلك، على عكس التخطيطات التي على مستوى التطبيق، لا تزال التخطيطات الجزئية تحتوي على بادئة سُفلية.

يمكنك أيضًا تصيير كتلة من الشيفرة داخل تخطيط جزئية بدلًا من استدعاء <code>yield</code>. على سبيل المثال، إذا لم تكن لدينا الجزئية article_، فيمكننا القيام بما يلي بدلًا من ذلك:

الملف articles/show.html.erb<syntaxhighlight lang="html">
<% render(layout: 'box', locals: { article: @article }) do %>
  <div>
    <p><%= article.body %></p>
  </div>
<% end %>
</syntaxhighlight>لنفترض أننا نستخدم الجزئية ‎_box نفسها مما سبق، فإن هذا سيولد نفس الناتج المولد من المثال السابق.

== مسارات العرض ==
عند تصيير استجابة، تحتاج وحدة التحكم إلى تحديد مكان وجود العروض المختلفة. بشكل افتراضي، سيُنظر فقط داخل المجلد app/views.

يمكننا إضافة مواقع أخرى ومنحهم أولوية معينة عند استبيان المسارات باستخدام التابعين <code>prepend_view_path</code> و <code>append_view_path</code>.

=== إضافة سابقة لمسار العرض ===
يمكن أن يكون هذا مفيدًا على سبيل المثال، عندما نريد وضع العروض داخل مجلد مختلف عن النطاقات الفرعية.

يمكننا القيام بذلك باستخدام:<syntaxhighlight lang="rails">
prepend_view_path "app/views/#{request.subdomain}"
</syntaxhighlight>بعد ذلك، سيظهر [[Rails/action view|Action View]] أولًا في هذا المجلد عند استبيان العروض.

=== إضافة لاحقة لمسار العرض ===
وبالمثل، يمكننا إضافة لاحقة للمسارات بالشكل التالي:<syntaxhighlight lang="rails">
append_view_path "app/views/direct"
</syntaxhighlight>سيضيف هذا المسار app/views/direct إلى نهاية مسارات البحث (lookup paths).

== نظرة عامة على المساعدين الذين يوفرهم Action View ==
'''قيد العمل''': ليس جميع المساعدين مذكورون هنا. للاطلاع على قائمة المساعدين الكاملة، انتقل إلى [http://api.rubyonrails.org/v5.2.2/classes/ActionView/Helpers.html توثيق الواجهة البرمجية].

ما يلي هو ملخص قصير للمساعدين المتوفرين في [[Rails/action view|Action View]]. يوصى بمراجعة [http://api.rubyonrails.org/v5.2.2/classes/ActionView/Helpers.html توثيق الواجهة البرمجية]، التي تغطي جميع المساعدين بمزيد من التفصيل، ولكن يجب أن يكون هذا بمثابة نقطة بداية جيدة.

=== المساعد <code>AssetTagHelper</code> ===
يوفر هذا النموذج دوالًّا لتوليد شيفرة [[HTML]] تربط العروض بالأصول (assets) مثل الصور وملفات جافاسكربت وملفات الأنماط وقارئي التغذية (feed readers).

بشكل افتراضي، يقترن ريلز بهذه الأصول على الاستضافة الحالية في المجلد العام، ولكن يمكنك توجيه ريلز للربط بالأصول من خادم أصول مخصص عن طريق تعيين <code>config.action_controller.asset_host</code> في تكوين التطبيق، عادةً في الملف config/environments/production.rb. على سبيل المثال، لنفترض أن استضافة الأصول لديك هي assets.example.com:<syntaxhighlight lang="rails">
config.action_controller.asset_host = "assets.example.com"
image_tag("rails.png") # => <img src="http://assets.example.com/images/rails.png" />

</syntaxhighlight>

==== <code>auto_discovery_link_tag</code> ====
يعيد وسم رابط يمكن للمتصفحات و[https://academy.hsoub.com/programming/c-sharp/xamarin/%D8%AA%D8%B7%D8%A8%D9%8A%D9%82-%D8%B9%D9%85%D9%84%D9%8A-%D8%AA%D8%B7%D8%A8%D9%8A%D9%82-%D9%82%D8%A7%D8%B1%D8%A6-%D8%A7%D9%84%D8%AE%D9%84%D8%A7%D8%B5%D8%A7%D8%AA-%D8%A7%D9%84%D8%AC%D8%B2%D8%A1-%D8%A7%D9 قارئي التغذية] (feed readers) استخدامها للاكتشاف التلقائي لتغذية RSS أو Atom أو JSON.<syntaxhighlight lang="rails">
auto_discovery_link_tag(:rss, "http://www.example.com/feed.rss", { title: "RSS Feed" }) # =>
  <link rel="alternate" type="application/rss+xml" title="RSS Feed" href="http://www.example.com/feed.rss" />

</syntaxhighlight>

==== <code>image_path</code> ====
يَحسب المسار إلى أصل الصورة في المجلد app/assets/images. ستُمرر المسارات الكاملة من جذر المستند. يُستخدم داخليًا بواسطة <code>image_tag</code> لبناء مسار الصورة.<syntaxhighlight lang="rails">
image_path("edit.png") # => /assets/edit.png
</syntaxhighlight>ستُضاف بصمة (fingerprint) إلى اسم الملف إذا ضُبِطَ config.assets.digest إلى القيمة true.<syntaxhighlight lang="rails">
image_path("edit.png") # => /assets/edit-2d1a2db63fc738690021fedb5a65b68e.png
</syntaxhighlight>

==== <code>image_url</code> ====
يَحسب عنوان URL لأصل الصورة في المجلد app/assets/images. سيستدعي هذا التابع <code>image_path</code> داخليًا ويدمجه مع استضافتك الحالية أو استضافة الأصول.<syntaxhighlight lang="rails">
image_url("edit.png") # => http://www.example.com/assets/edit.png
</syntaxhighlight>

==== <code>image_tag</code> ====
يعيد وسم [[HTML]] للصورة للمصدر. يمكن أن يكون المصدر مسارًا كاملًا أو ملفًا موجودًا في المجلد app/assets/images.<syntaxhighlight lang="rails">
image_tag("icon.png") # => <img src="/assets/icon.png" />
</syntaxhighlight>

==== <code>javascript_include_tag</code> ====
يعيد الوسم <code>[[HTML/script|<script>]]</code> لكل من المصادر المعطاة. يمكنك تمرير اسم الملف (تحديد الامتداد <code>‎.js</code> اختياري) لملفات JavaScript الموجودة في المجلد app/assets/javascripts لتضمينها في الصفحة الحالية أو يمكنك تمرير المسار الكامل المتعلق بجذر المستند.<syntaxhighlight lang="rails">
javascript_include_tag "common" # => <script src="/assets/common.js"></script>
</syntaxhighlight>

==== <code>javascript_path</code> ====
يحسب المسار إلى أصل جافاسكربت في المجلد app/assets/javascripts. إذا لم يحتو اسم الملف المصدر على امتداد، فسيُلحَق ‎<code>.js</code>. ستُمرَّر المسارات الكاملة من جذر المستند. يستخدم داخليًا بواسطة <code>javascript_include_tag</code> لإنشاء مسار شيفرة مكتوبة بلغة جافاسكربت.<syntaxhighlight lang="rails">
javascript_path "common" # => /assets/common.js
</syntaxhighlight>

==== <code>javascript_url</code> ====
يحسب عنوان URL لأصل جافاسكربت في المجلد app/assets/javascripts. سيستدعي هذا التابع  <code>javascript_path</code> داخليًا ويدمجه مع استضافتك الحالية أو استضافة الأصول.<syntaxhighlight lang="rails">
javascript_url "common" # => http://www.example.com/assets/common.js
</syntaxhighlight>

==== <code>stylesheet_link_tag</code> ====
يعيد وسم رابط ورقة أنماط للمصادر المحددة كوسائط. إذا لم تحدد لاحقة، فستستعمل اللاحقة ‎<code>.css</code> تلقائيًا.<syntaxhighlight lang="rails">
stylesheet_link_tag "application" # => <link href="/assets/application.css" media="screen" rel="stylesheet" />
</syntaxhighlight>

==== <code>stylesheet_path</code> ====
يحسب المسار إلى أصل ورقة الأنماط في المجلد app/assets/stylesheets. إذا لم يحتوِ اسم الملف المصدر على لاحقة، فستستعمل اللاحقة ‎<code>.css</code>. ستُمرَّر المسارات الكاملة من جذر المستند. يُستخدَم داخليًا بواسطة <code>stylesheet_link_tag</code> لإنشاء مسار ورقة الأنماط.<syntaxhighlight lang="rails">
stylesheet_path "application" # => /assets/application.css
</syntaxhighlight>

==== <code>stylesheet_url</code> ====
يحسب عنوان URL لأصل ورقة أنماط في المجلد app/assets/stylesheets. سيستدعي هذا التابع <code>stylesheet_path</code> داخليًا ويدمجه مع استضافتك الحالية أو استضافة الأصول.<syntaxhighlight lang="rails">
stylesheet_url "application" # => http://www.example.com/assets/application.css
</syntaxhighlight>

=== المساعد <code>AtomFeedHelper</code> ===

==== <code>atom_feed</code> ====
يجعل هذا المساعد بناء تغذية Atom عمليةً سهلةً. إليك مثال كامل عن كيفية الاستخدام:

'''الملف config/routes.rb'''<syntaxhighlight lang="rails">
resources :articles
</syntaxhighlight>'''الملف app/controllers/articles_controller.rb'''<syntaxhighlight lang="rails">
def index
  @articles = Article.all
 
  respond_to do |format|
    format.html
    format.atom
  end
end
</syntaxhighlight>'''الملف app/views/articles/index.atom.builder'''<syntaxhighlight lang="rails">
atom_feed do |feed|
  feed.title("Articles Index")
  feed.updated(@articles.first.created_at)
 
  @articles.each do |article|
    feed.entry(article) do |entry|
      entry.title(article.title)
      entry.content(article.body, type: 'html')
 
      entry.author do |author|
        author.name(article.author_name)
      end
    end
  end
end
</syntaxhighlight>

=== المساعد <code>BenchmarkHelper</code> ===

==== <code>benchmark</code> ====
يسمح لك بقياس وقت تنفيذ كتلة برمجية في قالب ويسجل النتيجة في السجل. قم بلف هذه الكتلة حول العمليات التي تؤثر بشكل كبير على الأداء أو تسبب اختناقات محتملة لمعرفة الوقت الذي استغرقته العملية.<syntaxhighlight lang="html">
<% benchmark "Process data files" do %>
  <%= expensive_files_operation %>
<% end %>
</syntaxhighlight>هذا من شأنه أن يضيف شيئًا مثل "Process data files (0.34523)‎" إلى السجل، والذي يمكنك استخدامه حينئذٍ لمقارنة الوقت الذي تستغرقه العملية مما يساعد على تحسين الأداء.

=== المساعد <code>CacheHelper</code> ===

==== <code>cache</code> ====
دالة للتخزين المؤقت لأجزاء من العرض بدلًا من كامل الإجراء أو الصفحة. هذه التقنية مفيدة للتخزين المؤقت مثل القوائم وقوائم مواضيع الأخبار وأجزاء من شيفرة HTML الثابتة وما إلى ذلك. تأخذ هذه دالة كتلة تحتوي على المحتوى الذي تريد تخزينه مؤقتًا. انظر <code>AbstractController::Caching::Fragments</code> لمزيد من المعلومات.<syntaxhighlight lang="html">
<% cache do %>
  <%= render "shared/footer" %>
<% end %>
</syntaxhighlight>

=== المساعد <code>CaptureHelper</code> ===

==== <code>capture</code> ====
يتيح لك التابع <code>capture</code> استخراج جزء من القالب إلى متغير. يمكنك بعد ذلك استخدام هذا المتغير في أي مكان ما في قوالبك أو تخطيطاتك.<syntaxhighlight lang="html">
<% @greeting = capture do %>
  <p>Welcome! The date and time is <%= Time.now %></p>
<% end %>
</syntaxhighlight>يمكن استخدام المتغير الذي ألتُقِط في أي مكان آخر.<syntaxhighlight lang="html">
<html>
  <head>
    <title>Welcome!</title>
  </head>
  <body>
    <%= @greeting %>
  </body>
</html>
</syntaxhighlight>

==== <code>content_for</code> ====
استدعاء التابع <code>content_for</code> يخزن كتلة من الشيفرة في مُعرِّف لاستخدامها لاحقًا. يمكنك إجراء استدعاءات متلاحقة للمحتوى المخزن في قوالب أخرى أو في المخطط بتمرير المعرف كوسيط إلى <code>yield</code>.

على سبيل المثال، لنفترض أن لدينا مخطط قياسي لتطبيق، ولكن أيضًا تتطلب صفحة خاصة شيفرة جافاسكربت محددة لا يحتاج إليها باقي الموقع. يمكننا استخدام <code>content_for</code> لتضمين شيفرة جافاسكربت في صفحتنا الخاصة دون إثقال باقي الموقع بها.

'''الملف app/views/layouts/application.html.erb'''<syntaxhighlight lang="html">
<html>
  <head>
    <title>Welcome!</title>
    <%= yield :special_script %>
  </head>
  <body>
    <p>Welcome! The date and time is <%= Time.now %></p>
  </body>
</html>
</syntaxhighlight>'''الملف app/views/articles/special.html.erb'''<syntaxhighlight lang="html">
<p>This is a special page.</p>
 
<% content_for :special_script do %>
  <script>alert('Hello!')</script>
<% end %>
</syntaxhighlight>

=== المساعد <code>DateHelper</code> ===

==== <code>date_select</code> ====
يعيد مجموعة من وسوم التحديد (واحد للسنة وواحد للشهر وواحد لليوم) المحددة مسبقًا للوصول إلى خاصية محددة تستند إلى التاريخ.<syntaxhighlight lang="rails">
date_select("article", "published_on")
</syntaxhighlight>

==== <code>datetime_select</code> ====
يعيد مجموعة من وسوم التحديد (واحد للسنة وواحد للشهر وواحد لليوم وواحد للساعة وواحد للدقيقة) محددة مسبقًا للوصول إلى خاصية محددة على أساس التاريخ والوقت.<syntaxhighlight lang="rails">
datetime_select("article", "published_on")
</syntaxhighlight>

==== <code>distance_of_time_in_words</code> ====
يُعد تقارير المسافة التقريبية في الوقت بين الكائنين <code>Time</code> أو <code>Date</code> أو بين أعداد صحيحة في واحدة الثانية. اضبِط <code>include_seconds</code> إلى القيمة <code>true</code> إذا كنت ترغب في الحصول على تقديرات تقريبية أكثر تفصيلًا.<syntaxhighlight lang="rails">
distance_of_time_in_words(Time.now, Time.now + 15.seconds)        # => less than a minute
distance_of_time_in_words(Time.now, Time.now + 15.seconds, include_seconds: true)  # => less than 20 seconds
</syntaxhighlight>

==== <code>select_date</code> ====
يعيد مجموعة من وسوم اختيار HTML (واحد للسنة وواحد للشهر وواحد لليوم) محددة مسبقًا مع التاريخ المعطى.<syntaxhighlight lang="rails">
# توليد اختيار تاريخ معين افتراضيًّا إلى التاريخ المعطى (ستة أيام بعد تاريخ اليوم)
select_date(Time.today + 6.days)
 
# توليد اختيار تاريخ معين افتراضيًا إلى تاريخ اليوم
select_date()
</syntaxhighlight>

==== <code>select_datetime</code> ====
يعيد مجموعة من وسوم اختيار HTML (واحد للسنة وواحد للشهر وواحد لليوم وواحد للساعة وواحد للدقيقة) محددة مسبقًا مع التاريخ والوقت المعطى.<syntaxhighlight lang="rails">
# توليد اختيار تاريخ ووقت معينين افتراضيًا إلى القيمة المعطاة (أربعة أيام من اليوم)
select_datetime(Time.now + 4.days)
 
# توليد اختيار تاريخ ووقت معينين افتراضيًا إلى اليوم
select_datetime()
</syntaxhighlight>

==== <code>select_day</code> ====
يعيد وسم اختيار يحتوي على خيارات لكل يوم من الأيام من 1 إلى 31 مع تحديد اليوم الحالي.<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل الأيام معين افتراضيًا إلى اليوم في التاريخ المعطى
select_day(Time.today + 2.days)
 
# توليد حقل اختيار من أجل الأيام معين افتراضيًا إلى الرقم المعطى
select_day(5)
</syntaxhighlight>

==== <code>select_hour</code> ====
يعيد وسم اختيار يحتوي على خيارات لكل ساعة من الساعات من 0 إلى 23 مع تحديد الساعة الحالية.<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل الساعات يعين افتراضيًا إلى الساعات في الوقت المعطى
select_hour(Time.now + 6.hours)

</syntaxhighlight>

==== <code>select_minute</code> ====
يعيد وسم اختيار يحتوي على خيارات لكل من الدقائق من 0 إلى 59 مع تحديد الدقيقة الحالية.<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل الدقائق معين افتراضيًا إلى الدقائق في الوقت المعطى
select_minute(Time.now + 10.minutes)
</syntaxhighlight>

==== <code>select_month</code> ====
يعيد وسم اختيار يحتوي على خيارات لكل من الأشهر من يناير حتى ديسمبر مع تحديد الشهر الحالي.<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل الأشهر يعين افتراضيًا إلى الشهر الحالي
select_month(Date.today)
</syntaxhighlight>

==== <code>select_second</code> ====
يعيد وسم اختيار يحتوي على خيارات لكل ثانية من الثواني من 0 إلى 59 مع تحديد الثاني الحالي.<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل الثواني يعين افتراضيًا إلى الثواني في الوقت المعطى
select_second(Time.now + 16.seconds)
</syntaxhighlight>

==== <code>select_time</code> ====
يعيد مجموعة من وسوم اختيار HTML (واحد للساعة وواحد للدقيقة).<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل الوقت يعين افتراضيًا إلى الوقت المعطى
select_time(Time.now)
</syntaxhighlight>

==== <code>select_year</code> ====
يعيد وسم اختيار مع خيارات لكل من السنوات الخمس على كل جانب من السنة الحالية، أو المحددة. يمكن تغيير نصف قطر الخمس سنوات باستخدام ‎<code>:start_year</code> و ‎<code>:end_year</code> في الخيارات.<syntaxhighlight lang="rails">
# توليد حقل اختيار من أجل خمس سنوات على كلا جانبي تاريخ اليوم
# الذي يعين افتراضيًا إلى السنة الحالية
select_year(Date.today)
 
# توليد حقل اختيار من 1900 إلى 2009 يعين افتراضيًا إلى السنة الحالية
select_year(Date.today, start_year: 1900, end_year: 2009)
</syntaxhighlight>

==== <code>time_ago_in_words</code> ====
يشبه التابع <code>distance_of_time_in_words</code> باستثناء أنه يضبط <code>to_time</code> إلى <code>Time.now</code>.<syntaxhighlight lang="rails">
time_ago_in_words(3.minutes.from_now)  # => 3 minutes
</syntaxhighlight>

==== <code>time_select</code> ====
يعيد مجموعة من وسوم اختيار (select tags، واحد للساعة وواحد للدقيقة وواحد للثانية اختياريًا) محددة مسبقًا للدخول إلى خاصية محددة تستند إلى الوقت. تُعد الاختيارات لتعيين معاملات متعددة إلى كائن [[Rails/active record basics|Active Record]].<syntaxhighlight lang="rails">
# submitted في الخاصية order توليد حقل اختيار وقت سيخزن عند إرساله في المتغير
time_select("order", "submitted")
</syntaxhighlight>

=== المساعد <code>DebugHelper</code> ===
يعيد الوسم <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> به كائن فُرِّغَ بواسطة YAML. يُنشِئ هذا طريقةً سهلة القراءة لفحص كائن.<syntaxhighlight lang="rails">
my_hash = { 'first' => 1, 'second' => 'two', 'third' => [1,2,3] }
debug(my_hash)
</syntaxhighlight><syntaxhighlight lang="html">
<pre class='debug_dump'>---
first: 1
second: two
third:
- 1
- 2
- 3
</pre>
</syntaxhighlight>

=== المساعد <code>FormHelper</code> ===
صُمِّمَ مساعدو [[HTML/form|النماذج]] لجعل العمل مع النماذج أسهل بكثير مقارنة باستخدام عناصر [[HTML]] القياسية فقط من خلال توفير مجموعة من الدوال لإنشاء النماذج استنادًا إلى نماذجك (models). يولد هذا المساعد شيفرة HTML للنماذج، ويوفر طريقة لكل نوع من أنواع [[HTML/input|عناصر الإدخال]] (مثل [[HTML/input/text|نص]]، و<nowiki/>[[HTML/input/password|كلمة المرور]]، و<nowiki/>[[HTML/input/checkbox|حقل اختيار]]، وما إلى ذلك). عند إرسال النموذج (أي عندما يضغط المستخدم على زر الإرسال أو تُستدعَى <code>form.submit</code> عبر [[JavaScript|جافاسكربت]]) ، ستُجمع مدخلات النموذج في كائن المعاملات ثم تُعاد إلى وحدة التحكم.

هناك نوعان من مساعدي النموذج: أولئك الذين يعملون تحديدًا مع خصائص النموذج وتلك التي لا تعمل. يتعامل هذا المساعد مع تلك التي تعمل مع خصائص النموذج. لمشاهدة مثال على مساعدي النموذج الذين لا يعملون مع خصائص النموذج، راجع توثيق <code>ActionView::Helpers::FormTagHelper</code>.

تمنحك الدالة الأساسية لهذا المساعد، <code>form_for</code>، القدرة على إنشاء نموذج لنسخة نموذج (model)؛ على سبيل المثال، لنفترض أنك تمتلك النموذج <code>Person</code> وتريد إنشاء نسخة جديدة منه:<syntaxhighlight lang="rails">
# (@person = Person.new في المتحكم (أي @person تنبيه: سيُنشَأ المتغير
<%= form_for @person, url: { action: "create" } do |f| %>
  <%= f.text_field :first_name %>
  <%= f.text_field :last_name %>
  <%= submit_tag 'Create' %>
<% end %>
</syntaxhighlight>شيفرة HTML التي أُنشِئَت لهذا ستكون:<syntaxhighlight lang="html">
<form class="new_person" id="new_person" action="/people" accept-charset="UTF-8" method="post">
  <input name="utf8" type="hidden" value="&#x2713;" />
  <input type="hidden" name="authenticity_token" value="lTuvBzs7ANygT0NFinXj98tfw3Emfm65wwYLbUvoWsK2pngccIQSUorM2C035M9dZswXgWTvKwFS8W5TVblpYw==" />
  <input type="text" name="person[first_name]" id="person_first_name" />
  <input type="text" name="person[last_name]" id="person_last_name" />
  <input type="submit" name="commit" value="Create" data-disable-with="Create" />
</form>
</syntaxhighlight>سبيدو الكائن <code>params</code> الذي أُنشِئَ عند إرسال هذا النموذج بالشكل:<syntaxhighlight lang="rails">
{"utf8" => "✓", "authenticity_token" => "lTuvBzs7ANygT0NFinXj98tfw3Emfm65wwYLbUvoWsK2pngccIQSUorM2C035M9dZswXgWTvKwFS8W5TVblpYw==", "person" => {"first_name" => "William", "last_name" => "Smith"}, "commit" => "Create", "controller" => "people", "action" => "create"}

</syntaxhighlight>يحتوي الكائن <code>params</code> ذي النوع <code>[[Ruby/Hash|Hash]]</code> على قيمة شخص (person) متداخلة، وبالتالي يمكن الوصول إليها باستخدام <code>params[:person]‎</code> في وحدة التحكم.

==== <code>check_box</code> ====
يعيد وسم مربع اختيار مصمم للوصول إلى خاصية محددة.<syntaxhighlight lang="rails">
# هي 1 @article.validated? لنَقُل أن
check_box("article", "validated")
# => <input type="checkbox" id="article_validated" name="article[validated]" value="1" />
#    <input name="article[validated]" type="hidden" value="0" />
</syntaxhighlight>

==== <code>fields_for</code> ====
ينشئ نطاقًا حول كائن نموذج محدد مثل <code>form_for</code>، ولكن لا ينشئ وسوم النموذج نفسها. وهذا يجعل <code>fields_for</code>  مناسبة لتحديد كائنات نماذج إضافية في نفس النموذج:<syntaxhighlight lang="html">
<%= form_for @person, url: { action: "update" } do |person_form| %>
  First name: <%= person_form.text_field :first_name %>
  Last name : <%= person_form.text_field :last_name %>
 
  <%= fields_for @person.permission do |permission_fields| %>
    Admin?  : <%= permission_fields.check_box :admin %>
  <% end %>
<% end %>
</syntaxhighlight>

==== <code>file_field</code> ====
يعيد [[HTML/input/file|وسم إدخال لتحميل ملف]] مصمم خصيصًا للوصول إلى خاصية محددة.<syntaxhighlight lang="rails">
file_field(:user, :avatar)
# => <input type="file" id="user_avatar" name="user[avatar]" />

</syntaxhighlight>

==== <code>form_for</code> ====
يُنشِئ نموذجًا ونطاقًا حول كائن نموذج (model object) محدد يُستخدم كأساس للاستعلام عن قيم الحقول.<syntaxhighlight lang="html">
<%= form_for @article do |f| %>
  <%= f.label :title, 'Title' %>:
  <%= f.text_field :title %><br>
  <%= f.label :body, 'Body' %>:
  <%= f.text_area :body %><br>
<% end %>
</syntaxhighlight>

==== <code>hidden_field</code> ====
يعيد [[HTML/input|وسم إدخال]] مخفي مصمم للوصول إلى خاصية محددة.<syntaxhighlight lang="rails">
hidden_field(:user, :token)
# => <input type="hidden" id="user_token" name="user[token]" value="#{@user.token}" />
</syntaxhighlight>

==== <code>label</code> ====
يعيد وسم [[HTML/label|تسمية]] مصمم لتسمية حقل إدخال لخاصية محددة.<syntaxhighlight lang="rails">
label(:article, :title)
# => <label for="article_title">Title</label>
</syntaxhighlight>

==== <code>password_field</code> ====
يعيد وسم إدخال من نوع "[[HTML/input/password|كلمة المرور]]" مصمم للوصول إلى خاصية محددة.<syntaxhighlight lang="rails">
password_field(:login, :pass)
# => <input type="text" id="login_pass" name="login[pass]" value="#{@login.pass}" />
</syntaxhighlight>

==== <code>radio_button</code> ====
يعيد وسم زر من النوع [[HTML/input/radio|<code>radio</code>]] للدخول إلى خاصية محددة.<syntaxhighlight lang="rails">
# "rails" يعيد @article.category لنفترض أن
radio_button("article", "category", "rails")
radio_button("article", "category", "java")
# => <input type="radio" id="article_category_rails" name="article[category]" value="rails" checked="checked" />
#    <input type="radio" id="article_category_java" name="article[category]" value="java" />
</syntaxhighlight>

==== <code>text_area</code> ====
يعيد مجموعة وسوم فتح وإغلاق لحقل نصي متعدد الأسطر <code>[[HTML/textarea|<textarea>]]</code> مصممة خصيصًا للوصول لخاصية محددة.<syntaxhighlight lang="rails">
text_area(:comment, :text, size: "20x30")
# => <textarea cols="20" rows="30" id="comment_text" name="comment[text]">
#      #{@comment.text}
#    </textarea>
</syntaxhighlight>

==== <code>text_field</code> ====
يعيد وسم  إدخال من النوع "[[HTML/input/text|نص]]" (text) مخصص للوصول لخاصية محددة.<syntaxhighlight lang="rails">
text_field(:article, :title)
# => <input type="text" id="article_title" name="article[title]" value="#{@article.title}" />

</syntaxhighlight>

==== <code>email_field</code> ====
يعيد وسم  إدخال من النوع "[[HTML/input/email|بريد الإلكتروني]]" (email) مخصص للوصول لخاصية  محددة.<syntaxhighlight lang="rails">
email_field(:user, :email)
# => <input type="email" id="user_email" name="user[email]" value="#{@user.email}" />
</syntaxhighlight>

==== <code>url_field</code> ====
يعيد وسم  إدخال من النوع "[[HTML/input/url|url]]" مخصص للوصول لخاصية محددة.<syntaxhighlight lang="rails">
url_field(:user, :url)
# => <input type="url" id="user_url" name="user[url]" value="#{@user.url}" />
</syntaxhighlight>

=== المساعد <code>FormOptionsHelper</code> ===
يوفر عددًا من الدوال لتحويل أنواع مختلفة من الحاويات إلى مجموعة من [[HTML/option|وسم الاختيار]].

==== <code>collection_select</code> ====
يعيد الوسمين <code>[[HTML/select|<select>]]</code> و <code>[[HTML/option|<option>]]</code> لتجميع قيم الإعادة الحالية للتابع <code>method</code> من أجل صنف الكائن (object's class).

مثال بنية الكائن للاستخدام مع هذا التابع:<syntaxhighlight lang="rails">
class Article < ApplicationRecord
  belongs_to :author
end
 
class Author < ApplicationRecord
  has_many :articles
  def name_with_initial
    "#{first_name.first}. #{last_name}"
  end
end
</syntaxhighlight>استخدام بسيط (تحديد المؤلف المرتبط لنسخة المقالة <code>article@</code>):<syntaxhighlight lang="rails">
collection_select(:article, :author_id, Author.all, :id, :name_with_initial, { prompt: true })

</syntaxhighlight>إذا كانت قيمة <code>article.author_id@</code> هي 1، فسيعيد هذا:<syntaxhighlight lang="rails">
<select name="article[author_id]">
  <option value="">Please select</option>
  <option value="1" selected="selected">D. Heinemeier Hansson</option>
  <option value="2">D. Thomas</option>
  <option value="3">M. Clark</option>
</syntaxhighlight>

==== <code>collection_radio_buttons</code> ====
يعيد وسوم <code>[[HTML/input/radio|radio_button]]</code> لتجميع قيم الإعادة الحالية للتابع <code>method</code> من أجل صنف الكائن (object's class).

مثال بنية الكائن للاستخدام مع هذا التابع:<syntaxhighlight lang="rails">
class Article < ApplicationRecord
  belongs_to :author
end
 
class Author < ApplicationRecord
  has_many :articles
  def name_with_initial
    "#{first_name.first}. #{last_name}"
  end
end
</syntaxhighlight>استخدام بسيط (تحديد المؤلف المرتبط لنسخة مقال، <code>article@</code>):<syntaxhighlight lang="rails">
collection_radio_buttons(:article, :author_id, Author.all, :id, :name_with_initial)
</syntaxhighlight>إذا كانت قيمة <code>article.author_id@</code> هي 1، فسيعيد هذا:<syntaxhighlight lang="html">
<input id="article_author_id_1" name="article[author_id]" type="radio" value="1" checked="checked" />
<label for="article_author_id_1">D. Heinemeier Hansson</label>
<input id="article_author_id_2" name="article[author_id]" type="radio" value="2" />
<label for="article_author_id_2">D. Thomas</label>
<input id="article_author_id_3" name="article[author_id]" type="radio" value="3" />
<label for="article_author_id_3">M. Clark</label>
</syntaxhighlight>

==== <code>collection_check_boxes</code> ====
يعيد وسوم <code>[[HTML/input/checkbox|check_box]]</code> لتجميع قيم الإعادة الحالية للتابع <code>method</code> من أجل صنف الكائن (object's class).

مثال بنية الكائن للاستخدام مع هذا التابع:<syntaxhighlight lang="rails">
class Article < ApplicationRecord
  has_and_belongs_to_many :authors
end
 
class Author < ApplicationRecord
  has_and_belongs_to_many :articles
  def name_with_initial
    "#{first_name.first}. #{last_name}"
  end
end
</syntaxhighlight>استخدام بسيط (تحديد المؤلفين المرتبطين بنسخة مقال، أي <code>article@</code>):<syntaxhighlight lang="rails">
collection_check_boxes(:article, :author_ids, Author.all, :id, :name_with_initial)
</syntaxhighlight>إذا كانت قيمة <code>article.author_id@</code> هي 1، فسيعيد هذا:<syntaxhighlight lang="html">
<input id="article_author_ids_1" name="article[author_ids][]" type="checkbox" value="1" checked="checked" />
<label for="article_author_ids_1">D. Heinemeier Hansson</label>
<input id="article_author_ids_2" name="article[author_ids][]" type="checkbox" value="2" />
<label for="article_author_ids_2">D. Thomas</label>
<input id="article_author_ids_3" name="article[author_ids][]" type="checkbox" value="3" />
<label for="article_author_ids_3">M. Clark</label>
<input name="article[author_ids][]" type="hidden" value="" />

</syntaxhighlight>

==== <code>option_groups_from_collection_for_select</code> ====
يعيد سلسلة وسوم <code>[[HTML/option|<option>]]</code> مثل <code>options_from_collection_for_select</code>، لكن يجمِّعهم في وسوم <code>[[HTML/optgroup|<optgroup>]]</code> استنادًا إلى علاقات الكائنات الخاصة بالوسائط.

مثال بنية الكائن للاستخدام مع هذا التابع:<syntaxhighlight lang="rails">
class Continent < ApplicationRecord
  has_many :countries
  # attribs: id, name
end
 
class Country < ApplicationRecord
  belongs_to :continent
  # attribs: id, name, continent_id
end
</syntaxhighlight>استخدام بسيط:<syntaxhighlight lang="rails">
option_groups_from_collection_for_select(@continents, :countries, :name, :id, :name, 3)
</syntaxhighlight>الناتج المحتمل:<syntaxhighlight lang="html">
<optgroup label="Africa">
  <option value="1">Egypt</option>
  <option value="4">Rwanda</option>
  ...
</optgroup>
<optgroup label="Asia">
  <option value="3" selected="selected">China</option>
  <option value="12">India</option>
  <option value="5">Japan</option>
  ...
</optgroup>

</syntaxhighlight>'''ملاحظة''': يعاد فقط وسوم <code>[[HTML/optgroup|<optgroup>]]</code> و <code>[[HTML/option|<option>]]</code>، لذلك لا يزال يتعين عليك تجميع الناتج في وسم <code>[[HTML/select|<select>]]</code> مناسب.

==== <code>options_for_select</code> ====
يقبل حاوية ([[Ruby/Hash|جدول Hash]]، [[Ruby/Array|مصفوفة]]، كائن من النوع <code>[[Ruby/Enumerable|enumerable]]</code>، نوعك) ويعيد سلسلة من وسوم <code>[[HTML/option|<option>]]</code>.<syntaxhighlight lang="rails">
options_for_select([ "VISA", "MasterCard" ])
# => <option>VISA</option> <option>MasterCard</option>
</syntaxhighlight>'''ملاحظة''': تُعَاد وسوم <code>[[HTML/option|<option>]]</code> فقط، لذا يجب عليك تجميع هذا الاستدعاء في وسم <code>[[HTML/select|<select>]]</code> العادي.

==== <code>options_from_collection_for_select</code> ====
يعيد سلسلة وسوم <code>[[HTML/option|<option>]]</code> فسِّرت بواسطة التكرار عبر المجموعة <code>collection</code> وعينت نتيجة استدعاء <code>value_method</code> كقيمة الخيار و <code>text_method</code> كنص الخيار.<syntaxhighlight lang="rails">
# options_from_collection_for_select(collection, value_method, text_method, selected = nil)
</syntaxhighlight>على سبيل المثال، تخيل حلقة تتكرر على كل شخص في ‎<code>@project.people</code> لتوليد [[HTML/input|وسم إدخال]]:<syntaxhighlight lang="rails">
options_from_collection_for_select(@project.people, "id", "name")
# => <option value="#{person.id}">#{person.name}</option>
</syntaxhighlight>'''ملاحظة''': تُعَاد وسوم <code>[[HTML/option|<option>]]</code> فقط، لذا يجب عليك تجميع هذا الاستدعاء في وسم <code>[[HTML/select|<select>]]</code> العادي.

==== <code>select</code> ====
يُنشئ وسم <code>[[HTML/select|<select>]]</code> وسلسلة من وسوم <code>[[HTML/option|<option>]]</code> للكائن والتابع المعطيين. إليك المثال التالي:<syntaxhighlight lang="rails">
select("article", "person_id", Person.all.collect { |p| [ p.name, p.id ] }, { include_blank: true })
</syntaxhighlight>إذا كانت قيمة <code>article.author_id@</code> هي 1، فسيصبح هذا:<syntaxhighlight lang="html">
<select name="article[person_id]">
  <option value=""></option>
  <option value="1" selected="selected">David</option>
  <option value="2">Eileen</option>
  <option value="3">Rafael</option>
</select>
</syntaxhighlight>

==== <code>time_zone_options_for_select</code> ====
يعيد سلسلة [[HTML/option|وسوم اختيار]] نصية إلى حد كبير في أي منطقة زمنية في العالم.

==== <code>time_zone_select</code> ====
يعيد وسوم تحديد <code>[[HTML/select|<select>]]</code> واختيار <code>[[HTML/option|<option>]]</code> للكائن والدالة المعينَين، باستخدام <code>time_zone_options_for_select</code> لإنشاء قائمة من وسوم <code>[[HTML/option|<option>]]</code>.<syntaxhighlight lang="rails">
time_zone_select("user", "time_zone")
</syntaxhighlight>

==== <code>date_field</code> ====
يعيد وسم إدخال <code>[[HTML/input|<input>]]</code> من النوع "[[HTML/input/date|تاريخ]]" مصمم للوصول إلى خاصية محددة.<syntaxhighlight lang="rails">
date_field("user", "dob")
</syntaxhighlight>

=== المساعد <code>FormTagHelper</code> ===
يوفر عددًا من التوابع لإنشاء وسوم [[HTML/form|النموذج]] التي لا تعتمد على كائن [[Rails/active record basics|Active Record]] المعين إلى القالب مثل <code>FormHelper</code>. بدلًا من ذلك، يمكنك تقديم الأسماء والقيم يدويًا.

==== <code>check_box_tag</code> ====
ينشئ وسوم [[HTML/input|إدخال]] [[HTML/form|نموذج]] من نوع [[HTML/input/checkbox|مربع اختيار]].<syntaxhighlight lang="rails">
check_box_tag 'accept'
# => <input id="accept" name="accept" type="checkbox" value="1" />
</syntaxhighlight>

==== <code>field_set_tag</code> ====
ينشئ مجموعة حقول لتجميع عناصر [[HTML/form|نموذج]] [[HTML]].<syntaxhighlight lang="html">
<%= field_set_tag do %>
  <p><%= text_field_tag 'name' %></p>
<% end %>
# => <fieldset><p><input id="name" name="name" type="text" /></p></fieldset>
</syntaxhighlight>

==== <code>file_field_tag</code> ====
يُنشئ حقل [[HTML/input/file|تحميل الملفات]].<syntaxhighlight lang="html">
<%= form_tag({ action: "post" }, multipart: true) do %>
  <label for="file">File to Upload</label> <%= file_field_tag "file" %>
  <%= submit_tag %>
<% end %>
</syntaxhighlight>مثال على الناتج:<syntaxhighlight lang="text">
file_field_tag 'attachment'
# => <input id="attachment" name="attachment" type="file" />

</syntaxhighlight>

==== <code>form_tag</code> ====
يبدأ وسم [[HTML/form|نموذج]] بتوجيه الإجراء إلى عنوان URL هُيِّئ باستخدام <code>url_for_options</code> تمامًا مثل <code>ActionController::Base.url_for</code>.<syntaxhighlight lang="html">
<%= form_tag '/articles' do %>
  <div><%= submit_tag 'Save' %></div>
<% end %>
# => <form action="/articles" method="post"><div><input type="submit" name="submit" value="Save" /></div></form>
</syntaxhighlight>

==== <code>hidden_field_tag</code> ====
ينشئ حقل [[HTML/input|إدخال]] [[HTML/form|نموذج]] مخفي يستخدم لنقل البيانات التي قد تفقد بسبب انعدام الثبات في HTTP أو البيانات التي يجب أن تكون مخفية عن المستخدم.<syntaxhighlight lang="rails">
hidden_field_tag 'token', 'VUBJKB23UIVI1UU1VOBVI@'
# => <input id="token" name="token" type="hidden" value="VUBJKB23UIVI1UU1VOBVI@" />
</syntaxhighlight>

==== <code>image_submit_tag</code> ====
يعرض صورة تعمل عند النقر عليها على إرسال النموذج.<syntaxhighlight lang="rails">
image_submit_tag("login.png")
# => <input src="/images/login.png" type="image" />

</syntaxhighlight>

==== <code>label_tag</code> ====
ينشئ [[HTML/label|حقل تسمية]].<syntaxhighlight lang="rails">
label_tag 'name'
# => <label for="name">Name</label>

</syntaxhighlight>

==== <code>password_field_tag</code> ====
ينشئ [[HTML/input/password|حقل كلمة مرور]]، وهو حقلٌ نصيٌّ مقنَّع يخفي إدخالات المستخدمين خلف قناع.<syntaxhighlight lang="rails">
password_field_tag 'pass'
# => <input id="pass" name="pass" type="password" />
</syntaxhighlight>

==== <code>radio_button_tag</code> ====
ينشئ [[HTML/button|زرًا]] من النوع [[HTML/input/radio|radio]]؛ استخدم مجموعات من أزرار هذا النوع للسماح للمستخدمين باختيار خيار وحيد من بين مجموعة من الخيارات.<syntaxhighlight lang="rails">
radio_button_tag 'gender', 'male'
# => <input id="gender_male" name="gender" type="radio" value="male" />
</syntaxhighlight>

==== <code>select_tag</code> ====
ينشئ [[HTML/select|مربع اختيار]] لقائمة منسدلة.<syntaxhighlight lang="rails">
select_tag "people", "<option>David</option>"
# => <select id="people" name="people"><option>David</option></select>
</syntaxhighlight>

==== <code>submit_tag</code> ====
ينشئ [[HTML/input/submit|زر إرسال]] مع استعمال النص المعطى كتسمية توضيحية.<syntaxhighlight lang="rails">
submit_tag "Publish this article"
# => <input name="commit" type="submit" value="Publish this article" />
</syntaxhighlight>

==== <code>text_area_tag</code> ====
ينشئ [[HTML/textarea|منطقة إدخال نصية]]؛ يستعمل الوسم <code>[[HTML/textarea|<textarea>]]</code> لإدخالات نصية متعددة الأسطر مثل مشاركات المدونات أو الشروحات.<syntaxhighlight lang="rails">
text_area_tag 'article'
# => <textarea id="article" name="article"></textarea>
</syntaxhighlight>

==== <code>text_field_tag</code> ====
ينشئ [[HTML/input/text|حقل نص قياسي]]؛ استخدم [[HTML/input/text|الحقول النصية]] هذه لإدخال أجزاء نصية صغيرة مثل اسم المستخدم أو استعلام البحث التي لا تتعدى السطر الواحد.<syntaxhighlight lang="rails">
text_field_tag 'name'
# => <input id="name" name="name" type="text" />
</syntaxhighlight>

==== <code>email_field_tag</code> ====
ينشئ [[HTML/input|حقل إدخال قياسي]] لإدخال [[HTML/input/email|عناوين البريد الإلكتروني]].<syntaxhighlight lang="rails">
email_field_tag 'email'
# => <input id="email" name="email" type="email" />
</syntaxhighlight>

==== <code>url_field_tag</code> ====
ينشئ [[HTML/input|حقل إدخال قياسي]] لإدخال [[HTML/input/url|عنوان url]].<syntaxhighlight lang="rails">
url_field_tag 'url'
# => <input id="url" name="url" type="url" />
</syntaxhighlight>

==== <code>date_field_tag</code> ====
ينشئ [[HTML/input|حقل إدخال قياسي]] لإدخال [[HTML/input/date|التاريخ]].<syntaxhighlight lang="rails">
date_field_tag "dob"
# => <input id="dob" name="dob" type="date" />
</syntaxhighlight>

=== المساعد <code>JavaScriptHelper</code> ===
يوفر العمل مع [[JavaScript|جافاسكربت]] في عروضك.

==== <code>escape_javascript</code> ====
يهرِّب محرف العودة (carrier returns) وعلامة الاقتباس الفردية والمزدوجة لأجزاء شيفرات [[JavaScript|جافاسكربت]].

==== <code>javascript_tag</code> ====
يعيد وسم [[JavaScript|جافاسكربت]] يحوي بداخله الشيفرة المعطاة.<syntaxhighlight lang="rails">
javascript_tag "alert('All is good')"
</syntaxhighlight><syntaxhighlight lang="html">
<script>
//<![CDATA[
alert('All is good')
//]]>
</script>
</syntaxhighlight>

=== المساعد <code>NumberHelper</code> ===
يوفر توابعًا لتحويل الأرقام إلى سلاسل نصية منسقة. تُوفَّر توفر هذه التوابع من أجل أرقام هاتف، والعملة، والنسبة المئوية، والدقة، والتدوين الموضعي (positional notation)، وحجم ملف.

==== <code>number_to_currency</code> ====
ينسق عددًا في صيغة عملة ثم يضعه في سلسلة نصية (مثل 13.65$).<syntaxhighlight lang="rails">
number_to_currency(1234567890.50) # => $1,234,567,890.50
</syntaxhighlight>

==== <code>number_to_human_size</code> ====
ينسق حجم البايتات المعطاة إلى قيمة أكثر قابلية للفهم. هذا مفيد في الإبلاغ عن أحجام الملفات للمستخدمين.<syntaxhighlight lang="rails">
number_to_human_size(1234)          # => 1.2 KB
number_to_human_size(1234567)       # => 1.2 MB

</syntaxhighlight>

==== <code>number_to_percentage</code> ====
ينسق عددًا في صيغة نسبة مئوية ويحوله إلى سلسلة نصية.<syntaxhighlight lang="rails">
number_to_percentage(100, precision: 0)        # => 100%
</syntaxhighlight>

==== <code>number_to_phone</code> ====
ينسق عددًا بصيغة رقم هاتف (بنمط الولايات المتحدة بشكل افتراضي).<syntaxhighlight lang="rails">
number_to_phone(1235551234) # => 123-555-1234
</syntaxhighlight>

==== <code>number_with_delimiter</code> ====
ينسق عددًا بتجميع منازل الآلاف فيه عبر فصلها عن بعضها بفاصل (فاصلة الآلاف).<syntaxhighlight lang="rails">
number_with_delimiter(12345678) # => 12,345,678
</syntaxhighlight>

==== <code>number_with_precision</code> ====
ينسق عددًا بمستوى الدقة المحدد، والذي يُعَيَّن افتراضيًا إلى 3 (عدد المنازل بعد الفاصلة).<syntaxhighlight lang="rails">
number_with_precision(111.2345)     # => 111.235
number_with_precision(111.2345, precision: 2)  # => 111.23
</syntaxhighlight>

=== المساعد <code>SanitizeHelper</code> ===
توفر الوحدة <code>SanitizeHelper</code> مجموعة من التوابع لإزالة عناصر HTML غير مرغوب فيها.

==== <code>sanitize</code> ====
يرمِّز المساعد <code>sanitize</code> هذا كل الوسوم ويزيل كل الخاصيات غير المسموح بها بشكل محدد.<syntaxhighlight lang="rails">
sanitize @article.body
</syntaxhighlight>إذا مُرر أحد الخيارين <code>attributes:</code> أو <code>tags:</code>، فلا يُسمح إلا بالخاصيات والوسوم المذكورة معه فقط وسيزال كل شيء آخر.<syntaxhighlight lang="rails">
sanitize @article.body, tags: %w(table tr td), attributes: %w(id class style)
</syntaxhighlight>لتغيير الإعدادات الافتراضية لاستخدامات متعددة مثل إضافة وسوم الجدول إلى الإعدادات الافتراضية:<syntaxhighlight lang="rails">
class Application < Rails::Application
  config.action_view.sanitized_allowed_tags = 'table', 'tr', 'td'
end
</syntaxhighlight>

==== <code>sanitize_css(style)‎</code> ====
ينظف كتلة من شيفرة [[CSS]].

==== <code>(strip_links(html‎</code> ====
يزيل [[HTML/a|وسوم الربط]] من النص المُمرَّر إليه ويترك المحتوى النصي فقط.

strip_links('<a href="http://rubyonrails.org">Ruby on ريلز</a>')<syntaxhighlight lang="rails">
strip_links('<a href="http://rubyonrails.org">Ruby on Rails</a>')
# => Ruby on Rails
</syntaxhighlight><syntaxhighlight lang="rails">
strip_links('emails to <a href="mailto:me@email.com">me@email.com</a>.')
# => emails to me@email.com.
</syntaxhighlight><syntaxhighlight lang="rails">
strip_links('Blog: <a href="http://myblog.com/">Visit</a>.')
# => Blog: Visit.
</syntaxhighlight>

==== <code>strip_tags(html)‎</code> ====
يزيل كل وسوم HTML من شيفرة html المُمررة إليه من ضمنها التعليقات. آلية عمل هذا التابع مدعومة بواسطة الجوهرة rails-html-sanitizer.<syntaxhighlight lang="rails">
strip_tags("Strip <i>these</i> tags!")
# => Strip these tags
</syntaxhighlight><syntaxhighlight lang="rails">
strip_tags("<b>Bold</b> no more!  <a href='more.html'>See more</a>")
# => Bold no more!  See more
</syntaxhighlight>'''ملاحظة''': قد لا يزال الناتج يحتوي على المحارف "<" و ">" و "&" غير المهربة ويربك المتصفحات.

=== المساعد <code>CsrfHelper</code> ===
يعيد [[HTML/meta|وسوم البيانات الوصفية]] "csrf-param" و"csrf-token" مع اسم معامل (parameter) ورمز (token) حماية طلب التزوير عبر الموقع على التوالي.<syntaxhighlight lang="html">
<%= csrf_meta_tags %>
</syntaxhighlight>'''ملاحظة''': تولد النماذج العادية حقولًا مخفية حتى لا تستخدم هذه الوسوم. يمكن التزود بتفاصيل أوسع في دليل [[Rails/security|تأمين تطبيقات ريلز]].

== عروض متعلقة بالمحليَّة ==
يحوي [[Rails/action view|Action View]] على قابلية عرض قوالب مختلفة استنادًا إلى الإعدادات المحلية (locale) الحالية.

على سبيل المثال، افترض أن لديك المتحكم <code>MaterialController</code> مع [[Rails/action view|Action View]]. بشكل افتراضي، استدعاء [[Rails/action view|Action View]] هذا سيصيِّر العرض app/views/articles/show.html.erb. ولكن إذا ضبطت المحلية بالشكل <code>I18n.locale = :de</code>، فسيصيِّر العرض app/views/articles/show.de.html.erb بدلًا من ذلك. إذا كان القالب الخاص بالمحلية (المحلية de هنا) غير موجود، فستُستخدًم النسخة غير المزخرفة. هذا يعني أنك لست مطالبًا بتقديم عروض متعلقة بالمحلية لجميع الحالات، ولكن ستُفضَّل وتُستخدَم إذا كانت متوافرة.

يمكنك استخدام نفس التقنية لتخصيص ملفات الإنقاذ (rescue files) في المجلد العام بناءً على قيمة المحلية. على سبيل المثال، ضبط <code>I18n.locale = :de</code> وإنشاء public/500.de.html و public/404.de.html يسمح لك بعرض صفحات الإنقاذ بما يتوافق مع قيمة المحلية المضبوطة، التي هي de في حالتنا هذه.

نظرًا لأن ريلز لا يقيد الرموز المستخدمة لتعيين المحلية <code>I18n.locale</code>، يمكنك الاستفادة من هذا الأمر لعرض محتوى مختلف اعتمادًا على أي شيء يعجبك. على سبيل المثال، لنفترض أن لديك بعض المستخدمين "الخبراء" الذين يمكنهم مشاهدة صفحات مختلفة من المستخدمين "العاديين". يمكنك إضافة ما يلي إلى الملف app/controllers/application.rb:<syntaxhighlight lang="rails">
before_action :set_expert_locale
 
def set_expert_locale
  I18n.locale = :expert if current_user.expert?
end
</syntaxhighlight>بعد ذلك، يمكنك إنشاء عروض خاصة مثل app/views/articles/show.expert.html.erb والتي تُعرَض فقط للمستخدمين الخبراء.

يمكنك قراءة المزيد عن تدويل في [[Rails/i18n|دليل الواجهة البرمجة لتدويل تطبيقات ريلز]].

== مصادر ==
* [https://guides.rubyonrails.org/action_view_overview.html صفحة Action View Overview في توثيق Ruby On Rails الرسمي.]