anchor.diff:  			}
           }
           
  -         AutocompleterManager.addAutocompleter(sponsorSiteAutocompleterProps);
  -         
  -         
  -       var instanceRowInserterProps = {
  +    var instanceRowInserterProps = {
          add_row_division_id: "investigatorsTable", 	        /* this id belongs to element where the row would be appended to */
          skeleton_row_division_id: "dummy-row",
  -       initialIndex: ${fn:length(command.healthcareSite.investigatorGroups[selected_site].siteInvestigatorGroupAffiliations)},   /* this is the initial count of the rows when the page is loaded  */
  +       initialIndex: ${newGroup?0:fn:length(command.healthcareSite.investigatorGroups[groupIndex].siteInvestigatorGroupAffiliations)},   /* this is the initial count of the rows when the page is loaded  */
          softDelete: ${softDelete == 'true'},
  -	   path: "healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations",                            /* this is the path of the collection that holds the rows  */
  +	   path: "healthcareSite.investigatorGroups[${groupIndex}].siteInvestigatorGroupAffiliations",                            /* this is the path of the collection that holds the rows  */
          postProcessRowInsertion: function(object){
  -        clonedRowInserter=Object.clone(principalInvestigatorAutocompleterProps);
  -		clonedRowInserter.basename=clonedRowInserter.basename+object.localIndex;
  -		AutocompleterManager.registerAutoCompleter(clonedRowInserter);
  -    },
  -    onLoadRowInitialize: function(object, currentRowIndex){
  -		clonedRowInserter=Object.clone(principalInvestigatorAutocompleterProps);
  -		clonedRowInserter.basename=clonedRowInserter.basename+currentRowIndex;
  -		AutocompleterManager.registerAutoCompleter(clonedRowInserter);
  -    }
  -};
  -
  -var instanceGroupRowInserterProps = {
  -       add_row_division_id: "groupsTable", 	        /* this id belongs to element where the row would be appended to */
  -       skeleton_row_division_id: "dummy-group",
  -       initialIndex: ${fn:length(command.healthcareSite.investigatorGroups)},   /* this is the initial count of the rows when the page is loaded  */
  -       softDelete: ${softDelete == 'true'},
  -	   path: "healthcareSite.investigatorGroups",                            /* this is the path of the collection that holds the rows  */
  -};
  -RowManager.addRowInseter(instanceGroupRowInserterProps);
  +	       	inputDateElementLocal="investigators["+object.localIndex+"].startDate";
  +	        inputDateElementLink="investigators["+object.localIndex+"].startDate-calbutton";
  +	        Calendar.setup(
  +	        {
  +	            inputField  : inputDateElementLocal,         // ID of the input field
  +	            ifFormat    : "%m/%d/%Y",    // the date format
  +	            button      : inputDateElementLink       // ID of the button
  +	        }
  +	                );
  +	        inputDateElementLocal="investigators["+object.localIndex+"].endDate";
  +	        inputDateElementLink="investigators["+object.localIndex+"].endDate-calbutton";
  +	        Calendar.setup(
  +	        {
  +	            inputField  : inputDateElementLocal,         // ID of the input field
  +	            ifFormat    : "%m/%d/%Y",    // the date format
  +	            button      : inputDateElementLink       // ID of the button
  +	        }
  +	                );
  +	        clonedRowInserter=Object.clone(principalInvestigatorAutocompleterProps);
  +			clonedRowInserter.basename=clonedRowInserter.basename+object.localIndex;
  +			AutocompleterManager.registerAutoCompleter(clonedRowInserter);
  +					}
  +	};
   RowManager.addRowInseter(instanceRowInserterProps);  
  -         
  -         function handleShowGroups(){
  -         	var organizationId = document.getElementById("healthcareSite-hidden").value;
  -         	<tags:tabMethod method="getInvestigatorGroups"  divElement="'groupsList'" 
  -						javaScriptParam="'organizationId='+organizationId" params="'showGroups='+showGroups" formName="'tabMethodForm'"/>
  -         };
  -         function handleShowSiteAffiliations(){
  -         	var selected_site = document.getElementById("selected_site").value;
  -         	<tags:tabMethod method="getSiteAffiliations"  divElement="'investigators'" 
  -						javaScriptParam="'selected_site='+selected_site" params="'showGroups='+showGroups" formName="'tabMethodForm'"/>
  -         };
  -         function handleAddGroup(){
  -         	document.getElementById("_addGroup").value="true";
  -			document.getElementById("command").submit();
  -         };
  -         function chooseSites() {
  -		    document.getElementById("_action").value="siteChange";
  -		    document.getElementById("_selectedSite").value=document.getElementById('site').value;
  -		    document.getElementById("command").submit();
  +  AutocompleterManager.addAutocompleter(sponsorSiteAutocompleterProps);
  +
  +		function hover()
  +		{
  +		    //var sel = $("disease-sub-category")
  +		    //alert (sel.value)
  +		
   		};
  +		function updateGroups(id,selectedId,saveEvent){
  +		
  +			OrganizationAjaxFacade.getInvestigatorGroups(id, function(categories) {
  +		        var sel = $("disease-sub-category")
  +		        sel.size = categories.length < 10 ? categories.length + 2 : 10;
  +		        //sel.size= 10
  +		        sel.options.length = 0
  +		        categories.each(function(cat) {
  +		            var opt = new Option(cat.name, cat.id)
  +		            opt.groupName=cat.name
  +		            opt.groupDesc=cat.descriptionText
  +		            opt.startDate=cat.startDate;
  +		            opt.endDate=cat.endDate;
  +		            sel.options.add(opt)
  +		            if(selectedId!="" && cat.id==selectedId)
  +		            opt.selected=true;
  +		        })
  +		        if(sel.options[0]!=null && selectedId==""){
  +		         	sel.options[0].selected = true;
  +		         }
  +		        showAffiliations(saveEvent)
  +	    	})
  +		};
  +		
  +		function showAffiliations(saveEvent) {
  +		    var categoryId = $("disease-sub-category").value
  +		    var opts=$("disease-sub-category").options
  +		    var subCategorySelect = $("disease-sub-category")
  +		    // If all is selected
  +		    
  +	    	new Ajax.Updater('groupDisplay', 'getGroup', {method:"get", asynchronous:true, evalScripts:true, onComplete:function(){ new Effect.Highlight('groupDisplay');}, 
  +		    												parameters: { decorator:"nullDecorator", groupId: categoryId, healthcareSite: $(sponsorSiteAutocompleterProps.basename+"-hidden").value}
  +		    											});
  +		}
  +		
  +	function handleAddGroup(){
  +		new Ajax.Updater('groupDisplay', 'getGroup', {method:"get", asynchronous:true, evalScripts:true, onComplete:function(){ new Effect.Highlight('groupDisplay');}, 
  +		    												parameters: { decorator:"nullDecorator", healthcareSite: $(sponsorSiteAutocompleterProps.basename+"-hidden").value}
  +		    											});
  +	}
  +
  +	Event.observe(window, "load", function() {
  +	    Event.observe("disease-sub-category", "change", function() {
  +	        showAffiliations('true');
  +	    })
  +	//    populateSelectsOnLoad();
  +	
  +	    // Element.update("flow-next", "Continue &raquo;")
  +	})
  +	function submitGroupForm(){
  +		new Element.show("savingIndicator");
  +		new Ajax.Request($('groupForm').action, {method:'post', asynchronous:true, parameters:Form.serialize('groupForm'),  evalScripts:true,
  +																	onSuccess:function(t)
  +																		{ 
  +																			new Element.hide("savingIndicator")
  +																			new Element.show("savedIndicator");
  +																			updateGroups($(sponsorSiteAutocompleterProps.basename+'-hidden').value, t.responseText, true);
  +																		}
  +															});
  +								 return false;
  +	}
   </script>
  +<script type="text/javascript" src="/c3pr/js/CalendarPopup.js"></script>	
   </head>
   <body>
   <div class="tabpane">
  
positive.code: 		    <input type="hidden" name="_siteChanged" id="_siteChanged" value="false">
  		</div>
  		<tags:errors path="*" />
  
  <chrome:division id="organization" title="Organization">
  		<div class="leftpanel">
  			<div class="row">
  				<div class="label required-indicator">Organization:</div>
  				<div class="value"><input type="hidden" id="healthcareSite-hidden"
  					name="healthcareSite" value="${command.healthcareSite.id}" /> <input
  					id="healthcareSite-input" size="50" type="text" name="xyz"
  					value="${command.healthcareSite.name}"
  					class="autocomplete validate-notEmpty" /> <tags:indicator
  					id="healthcareSite-indicator" />
  				<div id="healthcareSite-choices" class="autocomplete"></div>
  				</div>
  			</div>
  		</div>
  </chrome:division>
  
  <div align="right"><input id="viewGroups" type="button"
  	value="View Groups" onclick="handleShowGroups()" /></div>
  
  <chrome:division id="groups" title="Groups">
  
  	<div id="groupsList">
  		<table border="0" cellspacing="0" cellpadding="0" class="tablecontent" id="groupsTable"
  			width="50%">
  			<tr>
  	            <th width="40%"scope="col" align="left">Name</th>
  	            <th width="60%"scope="col" align="left">Description</th>
  	        </tr>
  			<c:forEach items="${command.healthcareSite.investigatorGroups}"
  				var="treatmentEpoch" varStatus="treatmentEpochCount">
  					<tr id="groupsTable-${treatmentEpochCount.index}">
  						<td align="left"><form:input
  							path="healthcareSite.investigatorGroups[${treatmentEpochCount.index}].name"
  							size="41" cssClass="validate-notEmpty" /></td>
  					</tr>
  			</c:forEach>
  		</table>
  	</div>
  		
  		<div align="right"><input type="button" onclick="RowManager.addRow(instanceGroupRowInserterProps);" value="Add Group"/></div>
  </chrome:division>
  
  <chrome:division title="Site Affiliations">
      <table border="0" id="table1" cellspacing="0">
      <tr>
  	    <td width="51%" align="right">
  	    </td>
     </tr>
          <tr>
              <td align="right"><span class="required-indicator"><b>Group:</b></span></td>
              <td align="left">
                  <select id="site" name="site" onchange="javascript:chooseSites();">
                  	<option value="">Please Select</option>
                      <c:forEach items="${command.healthcareSite.investigatorGroups}" var="group" varStatus="status">
                          <c:if test="${selected_site == status.index }">
                              <option selected="true" value=${status.index}>${group.name}</option>
                              <c:set var="selectedStudySite" value="${group.id}"></c:set>
                          </c:if>
                          <c:if test="${selected_site != status.index }">
                              <option value=${status.index}>${group.name}</option>
                          </c:if>
                      </c:forEach>
                  </select>
              </td>
          </tr>
      </table>
        <input type="hidden" id="selectedStudySite" value="${selectedStudySite }"/>
        
        <div align="right"><input id="viewAffiliations" type="button"
  	value="View Affiliations" onclick="handleShowSiteAffiliations()" /></div>
      <br>
      <hr>
      
      <div id="investigators">
       <table border="0" id="investigatorsTable" cellspacing="0" class="tablecontent">
          <tr>
              <th><span class="required-indicator">Investigator</span></th>
              <th><span class="required-indicator">Start Date</span></th>
              <th></th>
          </tr>
  
         <c:forEach varStatus="status" var="studyInvestigator" items="${command.healthcareSite.investigatorGroups[selected_site].siteInvestigatorGroupAffiliations}">
              <tr id="investigatorsTable-${status.index}">
                  <td>
                      <form:hidden id="investigator${status.index}-hidden"
                                   path="healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations[${status.index}].healthcareSiteInvestigator"/>
                      <input class="autocomplete validate-notEmpty" type="text" id="investigator${status.index}-input" size="30"
                             value="${command.healthcareSite.investigatorGroups[selected_site].siteInvestigatorGroupAffiliations[status.index].healthcareSiteInvestigator.investigator.fullName}"/>
                      <input type="button" id="investigator${status.index}-clear" value="Clear"/>
                      <tags:indicator id="investigator${status.index}-indicator"/>
                      <div id="investigator${status.index}-choices" class="autocomplete"></div>
                  </td>
                  <td>
                      <form:input path="healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations[${status.index}].startDate"
                                   cssClass="validate-notEmpty"/>
                      </td>
                  <td>
                      <a href="javascript:RowManager.deleteRow(instanceRowInserterProps,${status.index},${studyInvestigator.hashCode});"><img
                              src="<tags:imageUrl name="checkno.gif"/>" border="0" alt="delete"></a></td>
              </tr>
          </c:forEach>
  
      </table>
      </div>
      <div align="right">
          <input type="button" onclick="RowManager.addRow(instanceRowInserterProps);" value="Add Investigator"/>
      </div>
  			
  </chrome:division>
  
  </jsp:attribute>
  </tags:tabForm></div>
  
  <div id="dummy-arm" style="display:none">
  <table id="arm" class="tablecontent" width="50%">
  	<tr>
  		<td valign="top"><input type="hidden"
  			id="investigatorPAGE.ROW.INDEXNESTED.PAGE.ROW.INDEX-hidden"
  			name="healthcareSite.investigatorGroups[PAGE.ROW.INDEX].siteInvestigatorGroupAffiliations[NESTED.PAGE.ROW.INDEX].healthcareSiteInvestigator" />
  		<input class="autocomplete validate-notEmpty" type="text"
  			id="investigatorPAGE.ROW.INDEXNESTED.PAGE.ROW.INDEX-input" size="50"
  			value="${command.healthcareSite.investigatorGroups[PAGE.ROW.INDEX].siteInvestigatorGroupAffiliations[NESTED.PAGE.ROW.INDEX].healthcareSiteInvestigator.investigator.fullName}" />
  		<input type="button"
  			id="investigatorPAGE.ROW.INDEXNESTED.PAGE.ROW.INDEX-clear"
  			value="Clear" /> <tags:indicator
  			id="investigatorPAGE.ROW.INDEXNESTED.PAGE.ROW.INDEX-indicator" />
  		<div id="investigatorPAGE.ROW.INDEXNESTED.PAGE.ROW.INDEX-choices"
  			class="autocomplete">
  		</td>
  	</tr>
  </table>
  </div>
  
   <div id="dummy-row" style="display:none;">
      <table width="50%" class="tablecontent">
          <tr  id="investigatorsTable-PAGE.ROW.INDEX">
              <td>
                  <input type="hidden" id="investigatorPAGE.ROW.INDEX-hidden"
                          name="healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations[PAGE.ROW.INDEX].healthcareSiteInvestigator"
                         value="healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations[PAGE.ROW.INDEX].healthcareSiteInvestigator"/>
                  <input class="autocomplete validate-notEmpty" type="text" id="investigatorPAGE.ROW.INDEX-input"
                         size="30"
                         value="${command.healthcareSite.investigatorGroups[selected_site].siteInvestigatorGroupAffiliations[PAGE.ROW.INDEX].healthcareSiteInvestigator.investigator.fullName}"/>
                  <input type="button" id="investigatorPAGE.ROW.INDEX-clear"
                          value="Clear"/>
                     <tags:indicator id="investigatorPAGE.ROW.INDEX-indicator"/>
                    <div id="investigatorPAGE.ROW.INDEX-choices" class="autocomplete"></div>
              </td>
              <td>
                  <input type="text" id="healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations[PAGE.ROW.INDEX].startDate"
                          name="healthcareSite.investigatorGroups[${selected_site}].siteInvestigatorGroupAffiliations[PAGE.ROW.INDEX].startDate"
                          class="validate-notEmpty">
              </td>
              <td>
                  <a href="javascript:RowManager.deleteRow(instanceRowInserterProps,PAGE.ROW.INDEX, -1);"><img
                          src="<tags:imageUrl name="checkno.gif"/>" border="0" alt="delete"></a></td> 
          </tr>
      </table>
  </div> 
  
  <div id="dummy-group" style="display:none">
  <table class="tablecontent" width="100%">
          <tr  id="groupsTable-PAGE.ROW.INDEX">
              <td width="20%">
                  <input type="text" valign="top" id="healthcareSite.investigatorGroups[PAGE.ROW.INDEX].name" size="42"
                          name="healthcareSite.investigatorGroups[PAGE.ROW.INDEX].name"
                          class="validate-notEmpty">
              </td>
              <td>
                  <textarea id="healthcareSite.investigatorGroups[PAGE.ROW.INDEX].descriptionText"
                          name="healthcareSite.investigatorGroups[PAGE.ROW.INDEX].descriptionText" rows="5" cols="40"></textarea>
              </td>
              <td>
                  <a href="javascript:RowManager.deleteRow(instanceGroupRowInserterProps,PAGE.ROW.INDEX, -1);"><img
                          src="<tags:imageUrl name="checkno.gif"/>" border="0" alt="delete"></a></td>
          </tr>
      </table>
  </div>
  </body>
  </html>
  
  
negative.code: 
  <div id="main"><br />
  
  <tags:panelBox title="Investigator Groups">
  		<div>
  			<input type="hidden" name="_finish" value="true"> 
  			<input type="hidden" name="type1" value=""> 
  