Hi,

I want to apply ajax on buttons, I used "textfield" to enter number of checkboxes, so that user can enter any number in the textfield.

I want to use the value of the textfield to regenerate the checkboxes in the same form, hence refreshing the whole form.

but nothing happens when I click on "showbox" button.

please point out any wrong in the code.. or is there any example which implements this ?.

code:

function howmany_form($form, &$form_state) {


$form['howmany']['text'] = array(
        '#title' => t('Enter text'),
        '#type' => 'textfield',
        '#size' => '1',
    '#tree' => TRUE, 
        );

  $form ['button']    = array(
      '#type' => 'button',
      '#value' => t('showbox'),
      '#ajax' => array(
        'event' => 'click',
        'callback' => 'ajax_autocheckboxes_callback',
        'wrapper' => 'checkboxes-div',
        'method' => 'replace',
       ),
    
     );


  $form['howmany_select'] = array(
    '#type' => 'fieldset',
    '#title' => t("Generated Checkboxes"),
    '#prefix' => '<div id="checkboxes-div">',
    '#suffix' => '</div>',
    '#description' => t('This is where we get automatically generated checkboxes'),
  );



  $num_checkboxes = !empty($form_state['values']['howmany']['text']) ? $form_state['values']['howmany']['text'] : 1;
  for ($i=1; $i<=$num_checkboxes; $i++) {
    $form['howmany_select']['checkboxes_fieldset']["checkbox$i"] = array(
      '#type' => 'checkbox',
      '#title' => "Checkbox $i",
    );
  }

  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );

  return $form;
}


//ajax form call back function
function ajax_autocheckboxes_callback($form, $form_state) {
  return $form['howmany_select'];
}

Comments

sebto’s picture

Check out Examples module. It has an example of how to generate check boxes using ajax.

madhusudan’s picture

@sebto,

Thanks for replying.. I have seen those examples... but in my case its little advanced.. and its not working..

Change is the only Constant

maartenstorm’s picture

Try changing

$num_checkboxes = !empty($form_state['values']['howmany']['text']) ? $form_state['values']['howmany']['text'] : 1;

to

$num_checkboxes = !empty($form_state['values']['text']) ? $form_state['values']['text'] : 1;
madhusudan’s picture

@maartenstorm

I have set '#tree' => TRUE, there is no point in changing that. but strange things happening.

I am not getting the value in callback function if '#tree' => TRUE, if i don't specify '#tree' => TRUE, and if I use $form_state['values']['text'] in callback function I will get the value whatever user entered.

any other suggestions..?

Change is the only Constant

maartenstorm’s picture

I overlooked you were using a tree.
Setting '#tree' => TRUE in $form['howmany'] will give you the $form_state['values']['howmany']['text'] you need.

madhusudan’s picture

anyone tried this code..?

how to debug and make this work..?

Change is the only Constant

maartenstorm’s picture

I did try your code and I did test my solution. What happens when you set the #tree attribute not in $form['howmany']['text'] but in its parent $form['howmany']?

madhusudan’s picture

Same nothing happens!, I modified the code, and made all fields into one form.


$form['howmany']= array(
    '#type' => 'fieldset',
    '#id'=>'howmany',
    '#title' => t("Generated Checkboxes"),
    '#prefix' => '<div id="checkboxes-div">',
    '#suffix' => '</div>',
    '#description' => t('This is where we get automatically generated checkboxes'),
  );


$form['howmany']['text'] = array(
        '#title' => t('Enter text'),
        '#type' => 'textfield',
        '#size' => '1',
	'#default_value'=>'', 
        );

  $form ['howmany']['button']	= array(
      '#type' => 'button',
      '#value' => t('showbox'),
      '#id'=>'showbox',
      '#ajax' => array(
        'event'=>'click',	
        'callback' => 'ajax_autocheckboxes_callback',
        'wrapper' => 'checkboxes-div',
        'method' => 'replace',
	'name' => 'submit1',
       ),
	
     );


  $num_checkboxes = !empty($form_state['values']['entered_text']) ? $form_state['values']['entered_text'] : 1;
  for ($i=1; $i<=$num_checkboxes; $i++) {
    $form['howmany']['checkboxes_fieldset']["checkbox$i"] = array(
      '#type' => 'checkbox',
      '#title' => "Checkbox $i",
    );
  }

  $form['howmany']['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );

  return $form;

function ajax_autocheckboxes_callback($form, $form_state) {

return $form['howmany'];

}

Change is the only Constant

maartenstorm’s picture

Did you mean $form_state['values']['text'] instead of $form_state['values']['entered_text']?

madhusudan’s picture

oh yes.. its $form_state['values']['text'] . sorry for the typo....

Change is the only Constant

hemant_gautam’s picture

Hi,

I took you code any tried in my local on D7. I have made some correction in your code. It is working fine.

Please use the following code.

function howmany_form($form, &$form_state) {
$form ['text'] = array(
        '#title' => t('Enter text'),
        '#type' => 'textfield',
        '#size' => '1',
	'#tree' => TRUE,
        );
  $form ['button'] = array(
      '#type' => 'button',
      '#value' => t('showbox'),
      '#ajax' => array(
        'event' => 'click',
        'callback' => 'ajax_autocheckboxes_callback',
        'wrapper' => 'checkboxes-div',
        'method' => 'replace',
       ),
   
     );
  $form['howmany_select'] = array(
    '#type' => 'fieldset',
    '#title' => t("Generated Checkboxes"),
    '#prefix' => '<div id="checkboxes-div">',
    '#suffix' => '</div>',
    '#description' => t('This is where we get automatically generated checkboxes'),
  );

  $num_checkboxes = !empty($form_state['values']['text']) ? $form_state['values']['text'] : 1;
  for ($i=1; $i<=$num_checkboxes; $i++) {
    $form['howmany_select']['checkboxes_fieldset']["checkbox$i"] = array(
      '#type' => 'checkbox',
      '#title' => "Checkbox $i",
    );
  }
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );
   return $form;
}

//ajax form call back function
function ajax_autocheckboxes_callback($form, &$form_state) {
  return $form['howmany_select'];
}
madhusudan’s picture

Thanks hemanth, its working.. strange, my first posted code and yours are almost similar. you just changed names.. and it worked..!?

the '&' in callback is not needed it works with or without that..

Change is the only Constant

andiart’s picture

For me it was not working. The button press always ended in a submit of the form reloading the page.
But I could solve it by firing a change event via jQuery on a checkbox. For the code I use a #markup form element:

 $form['actions']['submitReplacement'] = array(
        '#type' => 'markup',
        '#markup' =>  '<a onclick="javascript:jQuery(\'.form-item-send-form input\').change();return false;" style="outline:none;" title="Submit"><img src="/sites/default/files/submit_button_de.png" onclick="jQuery(\'.form-type-checkbox input[type=checkbox] \').trigger(\'click\');" /></a>',
      );

      $form['send_form'] = array(
        '#type' => 'checkbox',
        '#ajax' => array(
          'path' => 'MYMODULE_field_collection/send_form',
          'wrapper' => array(
            'registration_form_div',
          ),
          'method' => 'replace',
          'effect' => 'fade',
        ),
        '#executes_submit_callback' => true,
        '#weight' => 100,
        '#title' => 'form senden!',
        '#value' => 'sending',
      );
quicksort’s picture

Posting this here to help future Googlers:

You can have Drupal fire a AJAX callback on a button click by mapping '#type' to 'submit ajax-trigger' and 'submitter' to FALSE (in the '#ajax' array). If the callback still doesn't load, try calling unset on the element in $form_state['values']. The code below worked for me:

$form['mybutton'] = array(
	'#type' => 'button',
	'#value' => t('button_name'),
	'#button_type' => 'submit ajax-trigger',
	'#ajax' => array(
		'submitter' => FALSE,
		'callback' => 'my_ajax_callback',
		'event' => 'mousedown',
		'wrapper' => 'target-wrapper,'
		'method' => 'replace',
		'effect' => 'fade',
	),
);

function my_ajax_callback(&$form, &$form_state) {
         unset($form_state['values']['target_element']);
         return $form['target_element'];
);