Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Drupal モジュール開発入門講座 第4回 フォーム

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.

Drupal モジュール開発入門講座 第4回 フォーム

More Decks by アクイアジャパン Acquia Japan

Other Decks in Programming

Transcript

  1. DrupalͷForm API – DrupalͷForm API͸ɺHTMLϑΥʔϜΛૢ࡞͢ΔͨΊͷந৅ԽϨΠϠͰ͢ɻ – ϑΥʔϜͷఆٛɺදࣔɺݕূɺૹ৴ɺͱ͍͏ϥΠϑαΠΫϧΛ੍ޚ͠·͢ɻ – \Drupal\Core\Form\FormInterfaceΛ࣮૷ͯ͠ϑΥʔϜΫϥεΛ࡞੒͢Δ͜ͱͰɺΧελ ϜϞδϡʔϧͰϑΥʔϜΛ੍ޚͰ͖·͢ɻ

    – ϑΥʔϜ͕ཁٻ͞ΕΔͱɺϑΥʔϜ͸ϨϯμϦϯάՄೳͳ$form഑ྻͱͯ͠ఆٛ͞Ε· ͢ɻ – $form഑ྻ͸ϨϯμϦϯάͷաఔͰHTMLʹม׵͞ΕɺΤϯυϢʔβʔʹදࣔ͞Ε·͢ɻ https://www.drupal.org/docs/drupal-apis/form- api/introduction-to-form-api
  2. FormInterfaceͰ͸࣍ͷ4ͭͷந৅ϝιου͕ఆٛ͞Ε͍ͯ·͢ɻ FormInterfaceΛ࣮૷͢ΔϑΥʔϜΫϥεͰ͸͜ΕΒͷϝιουͷ࣮૷͕ ඞਢͰ͢ɻ – getFormId( ) – buildForm( ) –

    validateForm() 
 ※FormBaseΫϥεΛ֦ு͢ΔΫϥεͰ͸೚ҙ࣮૷ – submitForm() FormInterfaceͰ༻ҙ͞Ε͍ͯΔϝιου ͜ΕΒͷϝιουͷ࣮૷͕ඞ ਢͰ͕͢ɾɾɾ FormBaseΫϥεͰ͸ validateForm()ͷΈ࣮૷͞Εͯ ͍·͢ɻͳͷͰFormBaseΛ֦ ு͢ΔΫϥεͰ͸ validateForm()ͷΈ೚ҙͰ͢ɻ
  3. buildForm() – $form഑ྻͰHTMLϑΥʔϜΛߏங͠·͢ɻ public function buildForm(array $form, FormStateInterface $form_state) {

    $form['name'] = [ '#type' => 'textfield', '#title' => '໊લ', ]; $form['phone'] = [ '#type' => 'tel', '#title' => 'ి࿩൪߸', ]; $form['submit'] = [ '#type' => 'submit', '#value' => 'อଘ', ]; return $form; }
  4. validateForm() – ஋ͷ௕͞ɺϝʔϧΞυϨεݕূͳͲೖྗ͕ཁ݅Λຬ͍ͨͯ͠Δ͜ͱΛݕূͰ͖·͢ɻ – EmailValidatorαʔϏεͷisValidؔ਺ͰϝʔϧΞυϨεͷݕূ͕ߦ͑·͢ɻ public function validateForm(array &$form, FormStateInterface

    $form_state) { if (strlen($form_state->getValue('phone')) < 3) { $form_state->setErrorByName('phone', '3จࣈҎ্ʹ͍ͯͩ͘͠͞ɻ'); } } Τϥʔϝοηʔδ͕ද ࣔ͞Εɺ֘౰ϑΟʔϧ υ͕੺͘ͳΓ·͢ɻ Ϣʔβʔ͕ૹ৴ͨ͠ϑΥʔϜͷ஋ ͸$form_stateΦϒδΣΫτ͔Β औಘͰ͖·͢ɻ
  5. ϑΥʔϜ഑ྻͱ͸ – ϑΥʔϜ഑ྻ͸ɺHTMLϑΥʔϜΛߏங͢ΔͨΊͷ࿈૝഑ྻͰ͢ɻ – ཁૉͱଐੑΛ࿈૝഑ྻͰࢦఆ͢Δ͜ͱͰHTMLϑΥʔϜͱͯ͠ϨϯμϦϯά͞Ε·͢ɻ – ϑΥʔϜ഑ྻ͸ཁૉͱଐੑͰߏ੒͞Ε·͢ɻ $form['name'] = [

    '#type' => 'textfield', '#title' => '໊લ', ]; $form['phone'] = [ '#type' => 'tel', '#title' => 'ి࿩൪߸', ]; $form['submit'] = [ '#type' => 'submit', '#value' => 'อଘ', ]; return $form; <form action=.. . <input type=”text” … <input type=”tel” … <input type=”submit”...
  6. ཁૉͱଐੑͷݟ෼͚ํ ཁૉɿ#Ͱ࢝·Βͳ͍ ଐੑɿ#Ͱ࢝·Δ $form['name'] = [ '#type' => 'textfield', '#title'

    => '໊લ', ]; $form['phone'] = [ '#type' => 'tel', '#title' => 'ి࿩൪߸', ]; $form['submit'] = [ '#type' => 'submit', '#value' => 'อଘ', ];
  7. ࢦఆՄೳͳଐੑͷྫ ଐੑ આ໌ ࢦఆྫ #type ཁૉͷλΠϓ '#type' => 'textfield' #title

    ཁૉͷλΠτϧ '#title' => '໊લ' #description ཁૉΛઆ໌͢ΔͨΊͷςΩετ '#description' => '໊લΛೖྗͯ͘͠ ͍ͩ͞ɻ' #required ཁૉ͕ೖྗඞਢ͔Ͳ͏͔ '#required' => TRUE ଞʹ΋୔ࢁ͋Γ·͢ɻৄࡉ͸ͪ͜ΒΛ͝ཡ͍ͩ͘͞ɻ https://www.drupal.org/docs/drupal-apis/form-api/form-render-elements
  8. ࢦఆՄೳͳtypeଐੑͷ஋ ஋ આ໌ ϨϯμϦϯάྫ textfield 1ߦͷςΩετϑΟʔϧυ <input type=”text”... number ਺஋ೖྗͷͨΊͷϑΟʔϧυ

    <input type=”number”... radio / radios ୯Ұ or ෳ਺ͷϥδΦϘλϯ <input type=”radio”... email ϝʔϧΞυϨεೖྗͷͨΊͷϑΟʔϧυ <input type=”email”... tel ి࿩൪߸ೖྗͷͨΊͷϑΟʔϧυ <input type=”tel”... hidden ը໘্ʹ͸දࣔ͞Εͳ͍Ӆ͠σʔλ <input type=”hidden”... submit ϑΥʔϜͷૹ৴Ϙλϯ <input type=”submit”... ଞʹ΋୔ࢁ͋Γ·͢ɻৄࡉ͸ͪ͜ΒΛ͝ཡ͍ͩ͘͞ɻ https://api.drupal.org/api/drupal/elements https://drupalize.me/tutorial/form-element-reference
  9. ԋश ϑΥʔϜ഑ྻΛۦ࢖ͯ͠৭ΜͳϑΟʔϧυΛ࡞ͬͯΈΑ͏ʂ – ϝʔϧΞυϨεϑΟʔϧυ – ి࿩൪߸ϑΟʔϧυ – ϥδΦϘλϯϑΟʔϧυ – νΣοΫϘοΫεϑΟʔϧυ

    – બ୒ϑΟʔϧυ – ΧϥʔϑΟʔϧυ ίʔυ͸ͪ͜Βˠ https://github.com/hmaruyama/my-drupal9-module/compare/vol4
  10. ϑΥʔϜΫϥεΛϧʔςΟϯάγεςϜʹొ࿥͢Δ _formΩʔʹϑΥʔϜΫϥεΛࢦఆ͢Δ͜ͱͰɺϧʔςΟϯάγεςϜʹొ࿥Ͱ͖ ·͢ɻ͜ΕʹΑͬͯɺࢦఆͨ͠URLύεʹԠͯ͡ϑΥʔϜΛऔಘɺදࣔͰ͖·͢ɻ marucha.form: path: '/marucha/form' defaults: _title: 'Marucha form'

    _form: '\Drupal\marucha\Form\MaruchaForm' requirements: _permission: 'access content' ίϯτϩʔϥʔΫϥεͷ৔ ߹͸ Class::methodͷܗࣜ Ͱهड़͠·͕ͨ͠ɺϑΥʔ ϜΫϥε͸Ϋϥε໊ͷΈΛ ࢦఆ͠·͢ɻ
  11. ࿅श໰୊1 ࣍ͷΑ͏ͳϑΥʔϜΫϥεΛ࡞੒ͨ͠ͱ͜Ζɺ Fatal error͕ൃੜ͠·ͨ͠ɻߟ͑ΒΕΔݪҼ͸Ͳ ΕͰ͔͢ʁ 1. ࣮૷͢΂͖ϝιου͕࣮૷͞Ε͍ͯͳ͍ɻ 2. ະ࢖༻ͷม਺͕͋Δɻ 3.

    αʔϏε΁ͷΞΫηεʹάϩʔόϧؔ਺͕ ࢖༻͞Ε͍ͯΔɻ 4. ഑ྻͷࢦఆʹ [ ] Ͱ͸ͳ͘ array() ͕࢖༻͞ Ε͍ͯΔɻ class MaruchaForm extends FormBase { public function buildForm(array $form, FormStateInterface $form_state) { $form['name'] = array( '#type' => 'textfield', '#title' => '໊લ', ); $form['submit'] = array( '#type' => 'submit', '#value' => 'อଘ', ); return $form; } public function validateForm(array &$form, FormStateInterface $form_state) { if (mb_strlen($form_state->getValue('name')) < 3) { $form_state->setErrorByName('name', '3จࣈҎ্ʹ͍ͯͩ͘͠͞ɻ'); } } public function submitForm(array &$form, FormStateInterface $form_state) { \Drupal::messenger()->addStatus('͝هೖ͋Γ͕ͱ͏͍͟͝·͢ʂ'); } }
  12. ࿅श໰୊1 ࣍ͷΑ͏ͳϑΥʔϜΫϥεΛ࡞੒ͨ͠ͱ͜Ζɺ Fatal error͕ൃੜ͠·ͨ͠ɻߟ͑ΒΕΔݪҼ͸Ͳ ΕͰ͔͢ʁ 1. ࣮૷͢΂͖ϝιου͕࣮૷͞Ε͍ͯͳ͍ɻ 2. ະ࢖༻ͷม਺͕͋Δɻ 3.

    αʔϏε΁ͷΞΫηεʹάϩʔόϧؔ਺͕ ࢖༻͞Ε͍ͯΔɻ 4. ഑ྻͷࢦఆʹ [ ] Ͱ͸ͳ͘ array() ͕࢖༻͞ Ε͍ͯΔɻ class MaruchaForm extends FormBase { public function buildForm(array $form, FormStateInterface $form_state) { $form['name'] = array( '#type' => 'textfield', '#title' => '໊લ', ); $form['submit'] = array( '#type' => 'submit', '#value' => 'อଘ', ); return $form; } public function validateForm(array &$form, FormStateInterface $form_state) { if (mb_strlen($form_state->getValue('name')) < 3) { $form_state->setErrorByName('name', '3จࣈҎ্ʹ͍ͯͩ͘͠͞ɻ'); } } public function submitForm(array &$form, FormStateInterface $form_state) { \Drupal::messenger()->addStatus('͝هೖ͋Γ͕ͱ͏͍͟͝·͢ʂ'); } }