call external form in ajax callback

Question

I have two forms (A & B) in custom module. Form A containing three fields(each field is dependent drop down) and Form B containing only one field (markup field to show data). The problem is that when I change either field from Form A then its dependent fields within form A an also markup field from Form B should be updated via ajax.

Here is the callback function used in FORM A. After calling, it returns fields from Form A. But I want it also return field of FORM B. (One Callback to render two forms at a time)

<?php
 function mymodule_ajax_callback($form, $form_state) {
     return array(
        '#type' => 'ajax',
        '#commands' => array(
            ajax_command_replace("#key_wrapper", render($form['keys'])),
            ajax_command_replace("#display_wrapper", render($form['display'])),
        ),
     );
 }
?>

Answer 1

You can use..

function custom_conditional_form($form, &$form_state) {
  $form['form1']['drupal_love'] = array(
    '#title' => t('Do you love Drupal?'),
    '#type' => 'radios',
    '#options' => array('yes' => t('Yes'), 'no' => t('No')),
  );
  $form['form1']['how_much_love'] = array(
    '#title' => t('Great! Tell us more:'),
    '#type' => 'textfield',
    '#states' => array(
      'visible' => array(
        ':input[name="drupal_love"]' => array('value' => 'yes'),
      ),
      'required' => array(
        ':input[name="drupal_love"]' => array('value' => 'yes'),
      ),
    ),
  );
  $form['form1']['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Save'),
  );

  return $form;
}

Answer 2

you could look at implementing something like Block Refresh

Block Refresh allows an administrator to configure a block to refresh it's content via 3 different methods: automatically via a timer (eg every 30 seconds) , manually via a 'refresh' link, and once on page load.

Block Refresh uses jQuery/AJAX so the refresh happens "behind-the-scenes".

Block refresh can be handy to serve fresh content in certain blocks on otherwise cached pages. You can opt to bypass drupal's cache for the refresh callbacks for each block.

I have used this with a bit of jQuery like this:

• set it up to use a link

• a link will appear on the block which is ugly, use some css to hide it (display:none)

• use a simple jQuery onChange() to force the link to activate

  jQuery('#selector').onChange(function(){ jQuery('#refresh').click(); });
  

The specifics would depend on block names, etc.

Answer 3

I have solved the problem with help of little js snippet. I attached a js file to form and got my charming work.

(function($, Drupal)
 {
  function selectAListener()
   {
   // $("edit-term") is our select element in form A
    $("#edit-term").once("select-a-listener", function()
     {
     // $(this) refers to $("edit-term")
      $(this).change(function()
       {
        // $("edit-termh") is our select element in form B
        // $(this) refers to $("edit-term")
        // We need to set the value of the select element in
        // form B, then call $.change() which will trigger the #ajax
        $("#edit-termh").val($(this).val()).change();
       });
     });
   }

   function selectBListener()
   {
    $("#edit-chld").once("select-b-listener", function()
     {
      // $(this) refers to $("edit-select-a")
      $(this).change(function()
       {
        // $("edit-chldh") is our select element in form B
        // $(this) refers to $("edit-chld")
        // We need to set the value of the select element in
        // form B, then call $.change() which will trigger the #ajax
        $("#edit-chldh").val($(this).val()).change();
       });
     });
    }
Drupal.behaviors.formExample = {
      attach:function()
      {
       selectAListener();
       selectBListener();
       }

}}(jQuery, Drupal));