Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax...

13

Transcript of Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax...

Page 1: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.
Page 2: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

Writing various AJAX forms in Drupal 7

Page 3: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

1. Overview of Form API2. Ctools2.1 Ctools features3. Ajax3.1 Ajax Forms in Drupal4. Putting it all together (demo)

Page 4: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

1. Overview of Form API

- provides a collection of functions to enable the processing and display of HTML forms

- these functions are used to achieve consistencyin the form processing and presentation

Page 5: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

1. Overview of Form API

- define : - my_module_example_form()- alter : - my_module_example_form_alter()- validate : - my_module_example_form_validate()- submit : - my_module_example_form_submit()

Page 6: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

1. Overview of Form API

- basic function is drupal_get_form($form_id) which handles retrieving, processing, and displaying a rendered HTML form for modules automatically

- drupal_form_submit($form_id, &$form_state)used to build and submit forms programmatically,without any user input

Page 7: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

2. Ctools

- a suit of APIs and tools to improve the developerExperience

- it includes : - form tools - form wizard - modal dialog - plugins - exportables

Page 8: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

2.1 Ctools features

- Form tools : - tools to make it easier for forms to deal with Ajax

- Form wizard : - an API to make multi-step forms much easier

Page 9: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

2.1 Ctools features

- Modal dialog : - tools to make it simple to put a form in a popup

- Plugins : - tools to make it easy for modules to let other modules implement plugins from .inc files

Page 10: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

3. Ajax

- stands for Asynchronous JavaScript and XML

- group of interrelated web development techniquesused on the client side to create asynchronous webapplications

- result : web applications can send data in background without interfering with the display orbehavior of the current page

Page 11: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

3.1 Ajax Forms in Drupal

- offer dynamic behavior with no page reloads

- no Javascript code needs to be written

- use the '#ajax' property on a form element tomake it Ajax-enabled

Page 12: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.

3.1 Ajax Forms in Drupal

- '#ajax' property has arguments :

- 'callback' => function to call

- 'wrapper' => element on which to operate

- 'method' => what to do with the result

- 'effect' => how to do the operation

Page 13: Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.