Monday, July 21, 2014

Drupal 7 ajax without jquery using use-ajax

Using "use-ajax" attribute, we can achieve ajax in Drupal.
Follow below steps to do it.

Steps :
1) hook_menu entry
2) function definition to declare ajax element (Hyperlink)
3) Ajax definition

1) hook_menu entry.
function yourModuleName_menu() {
  $items = array();
  $items['Mymodule/ajax'] = array(
    'page callback' => 'Mymodule_ajax_test',
    'access callback' => TRUE,
    'type' => MENU_CALLBACK,
  );
  $items['Mymodule/ajax/%/%'] = array(
    'page callback' => 'Mymodule_ajax_callback',
    'page arguments' => array(2, 3),
    'access callback' => TRUE,
    'type' => MENU_CALLBACK,
  );
  return $items;
}

2) function definition to declare ajax element (Hyperlink).
function Mymodule_ajax_test() {
  drupal_add_library('system', 'drupal.ajax');
  drupal_add_library('system', 'jquery.form');
  $arg = 'arg';
  $output = l(t('AJAX'), 'pm/ajax/nojs/' . $arg, array('attributes' => array('class' => array('use-ajax'))));
  $output .='<div id="some-wrapper"></div>'; // udadate result here.
  return $output;
}
// Another method.
function Mymodule_ajax_test() {
  drupal_add_library('system', 'drupal.ajax');
  drupal_add_library('system', 'jquery.form');
  $some_argument = 'arg';
  $output = l(t('AJAX'), 'Mymodule/ajax/nojs/' . $arg, array('attributes' => array('class' => array('use-ajax'), 'id' => array('some-wrapper')))); // overwrite result here.
  return $output;
}

3)  Ajax definition.
function Mymodule_ajax_callback($type = 'ajax', $arg) {

 if ($type == 'ajax') {
    $commands[] = ajax_command_replace('#some-wrapper', 'Ajax result '  );
    $page = array('#type' => 'ajax', '#commands' => $commands);
    ajax_deliver($page);
  }
  else {
    $output = t("Ajax fail or page load contents.");
    return $output;
  }
}

No comments:

Post a Comment