SlideShare una empresa de Scribd logo
1 de 14
Descargar para leer sin conexión
Business Apps with
Drupal's webform module
  DrupalCamp Atlanta - Oct 27, 2012


  Jitesh Doshi - jitesh@spinspire.com
      SpinSpire: Enterprise Drupal!
          http://spinspire.com/
What is webform module?
Webform module lets you ...
● Design custom forms and save submissions.
● Use most of the standard components such
  as textfield, select, textarea,
  checkbox/radios, even file uploads.
● Send emails driven by submitted data.
● Let Anonymous users create submissions.
● Download submission reports.
● Lightweight: Each submission is just a
  record in a table, not a whole new node.
● Very flexible data model.
Use Cases
Increasing order of complexity
● Contact form
● Survey / Poll
● Content submission
● Event registration
● Case tracking system
● Order entry system
● E-commerce: ordering, payment, delivery ...
● Or whatever you can dream up!
Helper Modules
● webform_conditional - show a component
  based on value of another (built in with v4)
● webform_rules - react to submissions
● webform_tokens - use webform submitted
  data as token values (built in with v4)
● fillpdf - populate PDF form templates with
  webform submitted data
● Attach webform forms to non-webform
  content types
Beyond Configuration
● Add BCC field to any email component.
● Single-use options: options used by a
  submission become unavailable.
● Dynamic option lists: options generated by
  code (e.g. fetch from DB or webservice)
● Replace listboxes with multiselect widget.
● Store/load webform data to/from your own
  custom tables.
● Suppress submission email until payment
  arrives.
Webform Data Structures
$node = $form['#node'];
$webform = $node->webform;
$components = $webform['components'];
$component['cid'], $component['name'],
$component['type'], etc.;
// The one place to store all extension data.
$component['extra']; // serialized metadata
Webform API Hooks
● hook_form_webform_client_form_alter
● hook_form_webform_component_edit_form_
  alter
● hook_webform_submission_*: load, presave,
  insert, update, delete
● hook_webform_select_options_info & _alter
● hook_webform_submission_actions
● hook_webform_component_info & _alter
Silver Bullet: $component['extra']
● Hierarchical tree of metadata(array of
  arrays)
● $component['extra'], form alter hooks and
  '#parents' attribute make a killer
  combination!
● Alter component edit forms to bind to
  $component['extra'] at design time.
● Alter client forms to use $component['extra']
  at runtime and drive your custom code.
Generalized approach to
Customizing Webforms
1. Create custom module: mymod.info &
   mymod.module.
2. List 'webform' as dependency in mymod.info.
3. Implement two hooks as below.
 function mymod_form_webform_component_edit_form_alter
      (&$form, &$form_state) {
   $form['mydata'] = array(
      '#type' => 'textfield',
      '#parents' => array('extra', 'mydata'),
   );
 }
 function mymod_form_webform_client_form_alter
      (&$form, &$form_state) {
   // use $component['extra']['mydata'] ...
 }
JavaScript behaviors
// In mymod.module
function mymod_form_webform_client_form_alter
    (&$form, &$form_state) {
  drupal_add_js('mymod.js');
  $data['mymod']['mydata'] = $component['extra']
['mydata'];
  drupal_add_js($data, 'setting');
}
// In mymod.js
(function($){
  Drupal.behaviors.mymod {
    attach: function(context, settings) {
       // use settings.mymod.mydata ...
       context.find('comp..').val(settings.mymod.mydata
[..]);
    }
  }
})(jQuery);
Example: Email component BCC
function wfdemo_form_webform_component_edit_form_alter(..)
{
  $component_type = $form['type']['#value'];
  $component = @$form_state['build_info']['args'][1];
  if($component_type == 'email') {
    $form['extra']['bcc'] = array(
       '#type' => 'textfield',
       '#title' => t('Additional BCC'),
       '#default_value' => @$component['extra']['bcc'],
    );
  }
}
function wfdemo_mail_alter(&$message) {
  $node = $message['params']['node'];
  $cid = (int)$message['params']['email']['email'];
  $component = $node->webform['components'][$cid];
  $bcc = $component['extra']['bcc'];
  if($bcc) {
    $message['headers']['Bcc'] = $bcc;
  }
Screenshot: Component Edit Form




If you want to place the input textbox
elsewhere, then change $form['extra']['bcc'] to
some other path. But then you'll also have to
set '#parents' attribute to array('extra', 'bcc') ...
What else is possible?
● save webform submission data to custom
  tables while using webform UI.
● webform_remote_post - post the webform
  submission data to a remote webservice.
  See http://drupal.org/sandbox/enrique.
  delgado/1786762
● Also checkout webform UI builder - http:
  //drupal.org/project/form_builder
● Tell me what you might do with
  webforms?!?!
Q&A
               Ask any questions.
         Or email jitesh@spinspire.com.
          Download source code from
http://drupal.org/sandbox/jitesh_doshi/1811566


Download this presentation from http://spinspire.
                    com/

Más contenido relacionado

Más de DrupalcampAtlanta2012

Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012
Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012
Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012DrupalcampAtlanta2012
 
Drupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_printDrupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_printDrupalcampAtlanta2012
 
What to do when things go wrong with Drupal
What to do when things go wrong with DrupalWhat to do when things go wrong with Drupal
What to do when things go wrong with DrupalDrupalcampAtlanta2012
 
Drupal + HTML5 + CSS3 + JS = Rich Internet Application
Drupal + HTML5 + CSS3 + JS = Rich Internet ApplicationDrupal + HTML5 + CSS3 + JS = Rich Internet Application
Drupal + HTML5 + CSS3 + JS = Rich Internet ApplicationDrupalcampAtlanta2012
 

Más de DrupalcampAtlanta2012 (6)

Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012
Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012
Getting Started with Drupal Services with Randall Kent @ DrupalCamp Atlanta 2012
 
Advanced theming
Advanced themingAdvanced theming
Advanced theming
 
Drupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_printDrupalcamp armedia phonegap_oct2012_print
Drupalcamp armedia phonegap_oct2012_print
 
What to do when things go wrong with Drupal
What to do when things go wrong with DrupalWhat to do when things go wrong with Drupal
What to do when things go wrong with Drupal
 
Getting started with Drush
Getting started with DrushGetting started with Drush
Getting started with Drush
 
Drupal + HTML5 + CSS3 + JS = Rich Internet Application
Drupal + HTML5 + CSS3 + JS = Rich Internet ApplicationDrupal + HTML5 + CSS3 + JS = Rich Internet Application
Drupal + HTML5 + CSS3 + JS = Rich Internet Application
 

Último

Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Enterprise Knowledge
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfPrecisely
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DaySri Ambati
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren
 

Último (20)

Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024
 

Business Apps with Drupal's webform module

  • 1. Business Apps with Drupal's webform module DrupalCamp Atlanta - Oct 27, 2012 Jitesh Doshi - jitesh@spinspire.com SpinSpire: Enterprise Drupal! http://spinspire.com/
  • 2. What is webform module? Webform module lets you ... ● Design custom forms and save submissions. ● Use most of the standard components such as textfield, select, textarea, checkbox/radios, even file uploads. ● Send emails driven by submitted data. ● Let Anonymous users create submissions. ● Download submission reports. ● Lightweight: Each submission is just a record in a table, not a whole new node. ● Very flexible data model.
  • 3. Use Cases Increasing order of complexity ● Contact form ● Survey / Poll ● Content submission ● Event registration ● Case tracking system ● Order entry system ● E-commerce: ordering, payment, delivery ... ● Or whatever you can dream up!
  • 4. Helper Modules ● webform_conditional - show a component based on value of another (built in with v4) ● webform_rules - react to submissions ● webform_tokens - use webform submitted data as token values (built in with v4) ● fillpdf - populate PDF form templates with webform submitted data ● Attach webform forms to non-webform content types
  • 5. Beyond Configuration ● Add BCC field to any email component. ● Single-use options: options used by a submission become unavailable. ● Dynamic option lists: options generated by code (e.g. fetch from DB or webservice) ● Replace listboxes with multiselect widget. ● Store/load webform data to/from your own custom tables. ● Suppress submission email until payment arrives.
  • 6. Webform Data Structures $node = $form['#node']; $webform = $node->webform; $components = $webform['components']; $component['cid'], $component['name'], $component['type'], etc.; // The one place to store all extension data. $component['extra']; // serialized metadata
  • 7. Webform API Hooks ● hook_form_webform_client_form_alter ● hook_form_webform_component_edit_form_ alter ● hook_webform_submission_*: load, presave, insert, update, delete ● hook_webform_select_options_info & _alter ● hook_webform_submission_actions ● hook_webform_component_info & _alter
  • 8. Silver Bullet: $component['extra'] ● Hierarchical tree of metadata(array of arrays) ● $component['extra'], form alter hooks and '#parents' attribute make a killer combination! ● Alter component edit forms to bind to $component['extra'] at design time. ● Alter client forms to use $component['extra'] at runtime and drive your custom code.
  • 9. Generalized approach to Customizing Webforms 1. Create custom module: mymod.info & mymod.module. 2. List 'webform' as dependency in mymod.info. 3. Implement two hooks as below. function mymod_form_webform_component_edit_form_alter (&$form, &$form_state) { $form['mydata'] = array( '#type' => 'textfield', '#parents' => array('extra', 'mydata'), ); } function mymod_form_webform_client_form_alter (&$form, &$form_state) { // use $component['extra']['mydata'] ... }
  • 10. JavaScript behaviors // In mymod.module function mymod_form_webform_client_form_alter (&$form, &$form_state) { drupal_add_js('mymod.js'); $data['mymod']['mydata'] = $component['extra'] ['mydata']; drupal_add_js($data, 'setting'); } // In mymod.js (function($){ Drupal.behaviors.mymod { attach: function(context, settings) { // use settings.mymod.mydata ... context.find('comp..').val(settings.mymod.mydata [..]); } } })(jQuery);
  • 11. Example: Email component BCC function wfdemo_form_webform_component_edit_form_alter(..) { $component_type = $form['type']['#value']; $component = @$form_state['build_info']['args'][1]; if($component_type == 'email') { $form['extra']['bcc'] = array( '#type' => 'textfield', '#title' => t('Additional BCC'), '#default_value' => @$component['extra']['bcc'], ); } } function wfdemo_mail_alter(&$message) { $node = $message['params']['node']; $cid = (int)$message['params']['email']['email']; $component = $node->webform['components'][$cid]; $bcc = $component['extra']['bcc']; if($bcc) { $message['headers']['Bcc'] = $bcc; }
  • 12. Screenshot: Component Edit Form If you want to place the input textbox elsewhere, then change $form['extra']['bcc'] to some other path. But then you'll also have to set '#parents' attribute to array('extra', 'bcc') ...
  • 13. What else is possible? ● save webform submission data to custom tables while using webform UI. ● webform_remote_post - post the webform submission data to a remote webservice. See http://drupal.org/sandbox/enrique. delgado/1786762 ● Also checkout webform UI builder - http: //drupal.org/project/form_builder ● Tell me what you might do with webforms?!?!
  • 14. Q&A Ask any questions. Or email jitesh@spinspire.com. Download source code from http://drupal.org/sandbox/jitesh_doshi/1811566 Download this presentation from http://spinspire. com/