[% META
    title  = 'Haematological Malignancy Research Network » Edit Treatment Data'    
%]

<!-- BEGIN hmrn/data/edit_treatment_data.tt  -->
    [% # PROCESS dumper.tt dump = data %]
    
	[% addcss =	[
			'validationEngine.jquery.css' # for validationEngine
			'smoothness/jquery-ui-1.8.4.custom.css' # for DatePicker
		]
	%]
	
	[% # PROCESS site/js/jquery.tt # already loaded in html_wrapper %]
	<script type="text/javascript" src="/js/jquery-ui-1.8.4.custom.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $('.datepicker').datepicker({
                changeMonth: true,
                changeYear: true,
                dateFormat: 'dd/mm/yy',
            });
        });
	</script>

    [% IF not_using_validationEngine_jquery # then use 'basic' jquery val %]
    <script type="text/javascript" src="/js/jquery.validate.js"></script>
    <script type="text/javascript"> 
	    $(document).ready(function() { 
	      $("#treatment").validate({ 
            rules: {
				[% c.jquery_validation_profile("${profile_name}").join(',') %]
            },
          });
        });
    </script>
    <script type="text/javascript">
        // override default message:
        jQuery.extend(jQuery.validator.messages, {
            remote:   "&#171; invalid entry",
            required: "&#171; required field",
        });
    </script>
    [% ELSE; INCLUDE site/js/validationEngine.tt %]
	<script type="text/javascript">
		$(document).ready(function() {
			$("#treatment").validationEngine()
		})
	</script>
    [% END %]
   
	<script language="javascript" type="text/javascript">
	<!--
		function showhide_tx_detail(f,v) {
			var t = f.tx_detail_id;
			var tx_type_ids = [ [% data.maps.tx_type_ids.join(',') %] ];
			
			// does value of 'v' match any of tx_type_ids array:
			match = jQuery.grep(tx_type_ids, function (a) { return a == v; }); // alert(match);

			/* alternative:
			var match = 0;
			for (i=0; i<tx_type_ids.length; i++) {
				if (tx_type_ids[i] == v) {
					match = 1;
					break;
				}
			}
			if (match) { .. }
			*/
			
			if (match.length) { // ie contains the value of tx_type_id
				t.style.visibility='visible';
			}
			else {
				t.style.visibility='hidden';
			}			
		}

		// use addLoadEvent function in common.js for onload:
		[% visibility = data.maps.tx_details.size ? 'visible' : 'hidden' %]
		addLoadEvent(
			function() { 
				document.treatment.tx_detail_id.style.visibility='[% visibility %]';
			}
		);

		// tx_type_id onChange event for tx_detail_id select menu
		$(document).ready(function () {
			$('#tx_type_id').change( function() {
				$('#tx_detail').load('[% app_url %]/hmrn_data/treatment_options', {
					tx_type_id: $('#tx_type_id').val()	
				})
			})
		});		
	-->
	</script>
	
    <h3>Edit treatment data:</h3>    

    [% IF dfv_errors %]
        <p class="error">[% c.cfg('msg').dfv_errors %]</p>
	[% ELSE %]
		<p class="indent warning">Minimum data entry: centre &amp; type</p>
    [% END %]

    <form method="post" name="treatment" id="treatment" [% # hmrn_treatment_onsubmit # using jQuery val %]
        action="[% app_url %]/hmrn_data/do_edit_treatment/[% data.request_id %]/[% data.id %]">

	  <table class="indent">	
		<tr>
			<td class="label">Centre:</td>
			<td class="content">
				<select name="location_id" class="validate[required]" id="location_id">
					<option value=""></option>
					[% FOREACH key IN data.maps.location.keys.sort %]
                    <option value="[% data.maps.location.$key %]"
						[% 'selected' IF data.maps.location.$key == data.location_id %]>
                        [% key %]
					</option>
					[% END %]
				</select>
				[% error_location_id %]
			</td>
		</tr>
		<tr>
			<td class="label">Type:</td>
			<td class="content">
				<select name="tx_type_id" id="tx_type_id" class="validate[required]"
						onchange="showhide_tx_detail(this.form,this.value)" id="tx_type_id">
					<option value=""></option>
					[% FOREACH key IN data.maps.tx_type.keys.sort %]
                    <option value="[% data.maps.tx_type.$key %]"
					[% 'selected' IF data.maps.tx_type.$key == data.tx_type_id %]>
                        [% key %]
					</option>
					[% END %]
				</select>
				[% error_tx_type_id %]
			</td>
		</tr>
		<tr>				
			<td class="label">Detail:</td>
			<td class="content">
				<!-- // replaced by ajax output after selection of tx_type_id: -->
				<select name="tx_detail_id" id="tx_detail">					
					[% IF data.maps.tx_details.size %]
					<option value=""></option>
					[% FOREACH opt IN data.maps.tx_details %]
						<option value="[% opt.key %]"
						[% 'selected' IF opt.key == data.tx_detail_id %]>
							[% opt.value %]
						</option>
					[% END; END %]
				</select>
				[% error_tx_detail_id %]
			</td>
		</tr>
		<tr>
			<td class="label">Start:</td>
			<td class="content">
				<input type="text" name="start_date" class="validate[ajax[ajaxDate]] datepicker"
					id="start_date" value="[% data.start_date.strftime('%d.%b.%Y') %]" size="10" />
				[% error_start_date %]
			</td>
		</tr>
		<tr>
			<td class="label">End:</td>
			<td class="content">
				<input type="text" name="end_date" class="validate[ajax[ajaxDate]] datepicker"
					id="end_date" value="[% data.end_date.strftime('%d.%b.%Y') %]" size="10" />
				[% error_end_date %]
			</td>
		</tr>
		<tr>
			<td class="label">Response:</td>
			<td class="content">
				<select name="response_id">
					<option value=""></option>
					[% FOREACH option IN data.maps.response %]
                    <option value="[% option.value %]"
						[% 'selected' IF option.value == data.response_id %]>
						[% option.key %]
					</option>
					[% END %]
				</select>
				[% error_response %]
			</td>
		</tr>		
	
		<tr class="borderless">
			<td>[% site.html.back_button %]</td>
			<td align="right">
			[% IF c.query.param('delete') %]
				<span class="title">confirm deletion (no undo possible):</span>
				<input type="checkbox" name="confirm_delete" value="1" />
				<input type="hidden" name="delete" value="1" />
				[% site.html.submit %]
			[% ELSE %]
				[% site.html.submit %]
				[% site.html.reset %]
				<a href="[% app_url %]/hmrn_data/edit_treatment/[% c.param('id')
						%]/[% c.param('Id') %]?delete=1">
					<span class="highlight">delete</span>
				</a>
			[% END %]
			</td>
		</tr>
      </table>
    </form>
<!-- END hmrn/data/edit_treatment_data.tt  -->