Dynamic display using javascript?

I'm sure this must be possible, but I don't know anything about how js works with Drupal and I can't seem to find any; a) instructions or, b) examples that I can follow easily... Here's what I'd like to do:

I have several .inc files which contain (for example);

function tablemanager_field_barchart_name($field) {
  return t('Bar Chart');
} // tablemanager_field_barchart_name

function tablemanager_field_barchart_table_form(&$form, $col, $default = "0\n500") {
  $default = explode("\n", $default);
  $form['dynamic']['low'.$col] = array(
    '#type' => 'textfield',
    '#title' => t('Enter lowest value enterable for bar charts'),
    '#size' => 4,
    '#maxlength' => 4,
    '#default_value' => $default[0],
    '#required' => TRUE,
  );
  $form['dynamic']['high'.$col] = array(
    '#type' => 'textfield',
    '#title' => t('Enter highest value enterable for bar charts'),
    '#size' => 4,
    '#maxlength' => 4,
    '#default_value' => $default[1],
    '#required' => TRUE,
  );
} // tablemanager_field_barchart_table_form

I have a form hook which adds the form data to the form if the _table_form hook is selected from an array of the field names. At the moment the whole page needs to refresh when a new field type is selected to alter the extra settings which are displayed. (Just via an onClick... node-form.submit js call).

  $form['add']['newheader'] = array(
    '#type' => 'textfield',
    '#title' => t('Enter new header title'),
    '#size' => 30,
  );
  $form['add']['newtype'] = array(
    '#type' => 'select',
    '#title' => t('Of Type'),
    '#options' => $types,
    '#default_value' => 'textfield',
    '#attributes' => array('onChange' => 'Drupal.newtype_changed()'),
  );
  $dynamic = $_POST['add']['newtype'] ? $_POST['add']['newtype'] : 'textfield';
  $function = 'tablemanager_field_'.$dynamic.'_table_form';
  if (function_exists($function)) $function(&$form, $col ? $col : 1);
  return $form;

I'd really like to be able to do this dynamically to save on page refreshes. Of course, that's fine when you're running off a server which is next to you - but not when you're on 56k dial up like some of my users may be.

Any help or pointers will be greatly appreciated, thank you.

Pobster
PS. The resulting form is neatly themed like this;

/**
* Renders hook_form as tables
*/
function theme_tablemanager_form($form) {
  tablemanager_css();
  $output = drupal_render($form['title']);
  $output .= drupal_render($form['desc']);
  $output .= drupal_render($form['order']);
  $output .= drupal_render($form['default']);
  if ($form['header']) {
    foreach (element_children($form['header']) as $key) {
      $header[] = array('data' => drupal_render($form['header'][$key]['heading']), 'class' => 'table-name');
    }
    for ($i = 1; $i <= $key; $i++) {
      $row1[] = drupal_render($form['header'][$i]['type']);
      $row2[] = drupal_render($form['header'][$i]['required']);
      $row3[] = drupal_render($form['header'][$i]['sorting']);
      $row4[] = drupal_render($form['header'][$i]['default']);
    }
    $output .= theme('table', $header, array(array('data' => $row1, 'class' => 'table-row'), array('data' => $row2, 'class' => 'table-row'), array('data' => $row3, 'class' => 'table-row'),
      array('data' => $row4, 'class' => 'table-row')), array('class' => 'table-table'));
  }
  $row5[] = '<div class="container-inline">'.drupal_render($form['add']['newheader']).drupal_render($form['add']['newtype']).'</div>';
  $row6[] = drupal_render($form['add']['newrequired']);
  $row7[] = drupal_render($form['add']['newsorting']);
  $row8[] = drupal_render($form['add']['newdefault']);
  $row9[] = drupal_render($form['add']['addcol']);
  $row5[] = array('data' => drupal_render($form['dynamic']), 'rowspan' => 5);
  $output .= theme('table', array(array('data' => t('Create a new column:'), 'colspan' => 2, 'class' => 'table-name')), array(array('data' => $row5, 'class' => 'table-row'), array('data' => $row6, 'class' => 'table-row'),
    array('data' => $row7, 'class' => 'table-row'), array('data' => $row8, 'class' => 'table-row'), array('data' => $row9, 'class' => 'table-row')), array('class' => 'table-table'));
  $output .= drupal_render($form);
  return $output;
} // theme_tablemanager_form