{AJAXCONTENT}
	<!-- Java script for Tabs -->
		<script src="{JSDIR}tabs/jquery-ui.min.js" type="text/javascript"></script>
		<link href="{SKINS}css/tabs/jquery-ui.css" type="text/css" rel="stylesheet"/>

		<script>
		$(document).ready(function() {
		$("#tabs").tabs();
		});
		</script>
	<!-- Java script for Tabs  -->
 <div id="tabs">
    <ul>        
        <li><a href="#fragment-3"><span>Monthly Milestone</span></a></li>		
	</ul>
	</div>	  
	  <div id="fragment-3">
	  <table border="0" bgcolor="#C6DEFF" class="" align="center" cellpadding="2" cellspacing="1" width="100%" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}">
		<tr>
			<td width="100%" > 
			<table border="0" width="100%" align="center" cellpadding="0" cellspacing="0">
				<tr>
				 <td align="center" width="60%">
					<table border="0" width="99%" cellpadding="0" cellspacing="0">
						<tr>
						 <td width="70%">
							<fieldset style="width:97%">
							 <table border="0" width="100%" cellpadding="0" cellspacing="0">
									<tr>
										<td width="90%">													
											<table border="0" cellpadding="1" cellspacing="0" width="100%">											    	
												 <tr>
													<td>
														<label><font style="font-size:13px" >Project Name: {PROJECTNAME}</font></label>
													</td>
												</tr>												
											</table>
										</td>
									</tr>
								</table>
							</fieldset>
						 </td>
							
						</tr>
					</table>
				 </td>
				</tr>
			</table>			
		</td>
		</tr>	
	</table>

	
	<TABLE  border="1" bgcolor="#C6DEFF" width="100%" cellpadding="0" cellspacing="0">
	<TR>
	<TD>

        <table align = "center" border="0" width="70%" cellpadding="7" cellspacing="4">
								<tr>
									<td width="40%">Milestone Name:<font color="RED">*</font></td>
									  <td align="left"> <input name="milestonename" class="texts" style="width:200px" value="{MILESTONENAME}"></td>
								</tr>				
																
								<tr>
								    <td align="left"><font size="2">Scheduled Start Date:</font><font color="RED">*</font></td>
									  <td align="left"><input  type="text" name="schstartdt" value="{SCHSTARTDT}" class="texts" style="width:200px" id="schstartdt">
									  </td>
									 
								</tr>
								<tr>
									<td align="left"><font size="2">Scheduled End Date:</font><font color="RED">*</font></td>
									<td align="left"><input  type="text" name="schenddt" value="{SCHENDDT}" class="texts" style="width:200px" id="schenddt"></td>
								</tr>

								<tr>
									<td align="left"><font size="2">Actual Start Date:</font></td>
									<td align="left"><input  type="text" name="actstartdt" value="{ACTSTARTDT}" class="texts" style="width:200px" id="actstartdt"></td>
								</tr>

								<tr>
									<td align="left"><font size="2">Actual Finish Date:</font></td>
									<td align="left"><input  type="text" name="actenddt" value="{ACTENDDT}" class="texts" style="width:200px" id="actenddt"></td>
								</tr>

								<tr>
									<td align="left"><font size="2">Work Description:</font></td>
									<td align="left"><textarea rows="5" cols="40" name="workdesc" value="{WORKDESC}">{WORKDESC}</textarea></td>
								</tr>

								<tr>
								     <td align="left"><font size="2">Status</font></td>
                                     <!-- <td align="left">
										<select style="width:200px" name="workstatusid" value="{WORKSTATUSID}">
								           {WORKSTATUS}
								         </select>
									 </td> -->
									 <td>
									<select name="workstatusid" style="width:184px">
										<option value=''>Select One</option>
										<option value='1' <!-- IF WORKSTATUSID = "1" --> selected <!-- ENDIF -->>Yet to Start</option>
										<option value='2' <!-- IF WORKSTATUSID = "2" --> selected <!-- ENDIF -->>Started</option>
										<option value='3' <!-- IF WORKSTATUSID = "3" --> selected <!-- ENDIF -->>Work in Progress</option>
										<option value='4' <!-- IF WORKSTATUSID = "4" --> selected <!-- ENDIF -->>Completed</option>
										<option value='5' <!-- IF WORKSTATUSID = "5" --> selected <!-- ENDIF -->>Suspended</option>
										<option value='6' <!-- IF WORKSTATUSID = "6" --> selected <!-- ENDIF -->>File in Progress</option>
									</select>
								</td>
								</tr>

								<tr>
									<td align="left"></td>
									  <td align="left"> <input class="button" type="submit" value="Submit" onclick="return formCheck(theform);"/>
									  <a href="?module=projectlist&action=monthlymilestone&projectid={PROJECTID}&workcodeid={WORKCODEID}" class="button"> <font Color="white"/>Back</font></a>
									  </td>
								</tr>								
								<tr>
								<td></td><td>
								
								</td>
								</tr>

                              </table>
						</TD>
	</TR>	
	</TABLE>	
	<input type="hidden" name="projectid" value="{PROJECTID}"/>
	<input type="hidden" name="workcodeid" value="{WORKCODEID}"/>
	<input type="hidden" name="mnthmilestoneid" value="{MNTHMILESTONEID}"/>
	<input type="hidden" name="action" value="{FORMACTION}"/>
	<input type="hidden" name="module" value="{MODULE}"/>
	 </div>
<script LANGUAGE="JavaScript">

		function formCheck(theform) {
			
		if(!validRequired(theform.milestonename,"Milestone Name"))
			return false;
		if(!validRequired(theform.schstartdt,"Scheduled Start Date"))
			return false;
		if(!validRequired(theform.schenddt,"Scheduled End Date"))
			return false;				
		updateAddmnthmilestone();
		return false;
		}		
</script>	    
<script>
	$(function() {
		var dates = $( "#schstartdt, #schenddt" ).datepicker({
			defaultDate: "+1w",
			changeMonth: true,
			numberOfMonths: 3,
			onSelect: function( selectedDate ) {
				var option = this.id == "schstartdt" ? "minDate" : "maxDate",
					instance = $( this ).data( "datepicker" ),
					date = $.datepicker.parseDate(
						instance.settings.dateFormat ||
						$.datepicker._defaults.dateFormat,
						selectedDate, instance.settings );
				dates.not( this ).datepicker( "option", option, date );
			}
		});
	});

	$(function() {
		var dates = $( "#actstartdt, #actenddt" ).datepicker({
			defaultDate: "+1w",
			changeMonth: true,
			numberOfMonths: 3,
			onSelect: function( selectedDate ) {
				var option = this.id == "actstartdt" ? "minDate" : "maxDate",
					instance = $( this ).data( "datepicker" ),
					date = $.datepicker.parseDate(
						instance.settings.dateFormat ||
						$.datepicker._defaults.dateFormat,
						selectedDate, instance.settings );
				dates.not( this ).datepicker( "option", option, date );
			}
		});
	});
</script>