how to use ajax on magento's default adminhtml form.php?

Question

$event = $fieldset->addField('parent_id', 'select', array(
    'label' => Mage::helper('gallery')->__('Parent'),
    'required' => true,
    'name'=>'parent_id',
    'values'=>$ac,
    'onchange'=>'CheckSelectedItem()',
  )); 
  $event->setAfterElementHtml('<script>
       function CheckSelectedItem()
       {
       var ddllist= window.document.getElementById("parent_id");
       var itemName= ddllist.options[ddllist.selectedIndex].value;

how to make an ajax call on form.php for the file that resides in root folder called "gallerydata.php". i have an extension called "gallery" for uploading image from backend. so i want to get an id of artist from dropdown by using ajax which makes call to that file "gallerydata.php".

       if(window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          xmlhttp1=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          xmlhttp1=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {

             alert(xmlhttp.responseText);

            }
          }

        xmlhttp.open("GET","http://122.170.97.189:81/electriccityusa/gallerydata.php?q="+itemName,true);

       }

    </script>');     

Answer 1

You can simply use ajax in adminhtml form as:

$event = $fieldset->addField('parent_id', 'select', array(
    'label'     => Mage::helper('gallery')->__('Parent'),
    'required'  => true,
    'name'      => 'parent_id',
    'values'    => $ac,
    'onchange'  => 'checkSelectedItem(this)',
  )); 
$event->setAfterElementHtml("<script type=\"text/javascript\">
    function checkSelectedItem(selectElement){
        var reloadurl = '". $this->getUrl('your-module-controller-action')."parent_id/' + selectElement.value;
        new Ajax.Request(reloadurl, {
            method: 'get',
            onLoading: function (transport) {
                $('parent_id').update('Searching...');
            },
            onComplete: function(transport) {
                    $('parent_id').update(transport.responseText);
            }
        });
    }
</script>");

Now you can fetch the select value and do operation as per required in your custom module controller action (mentioned in reloadurl).

Hope this helps.