{AJAXCONTENT}
<script type="text/javascript" src="{JSDIR}AmountInWords/estimated.js"></script>
<script type="text/javascript" src="{JSDIR}AmountInWords/approvedcost.js"></script>
<script type="text/javascript" src="{JSDIR}AmountInWords/expenditureincurred.js"></script>
<script type="text/javascript" src="{JSDIR}AmountInWords/Tendercost.js"></script>
<script type="text/javascript" src="{JSDIR}AmountInWords/FundRelesed.js"></script>
<script type="text/javascript" src="{JSDIR}AmountInWords/TotalCost.js"></script>
<script src="{JSDIR}Easing/jquery.easing.1.3.js" type="text/javascript"></script>  

<table border="1" cellpadding="10" cellspacing="9" width="100%" align="center" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR};">
	<tr>
		<td width="100%" align="center">
			<table  align = "center" border="0" width="90%" cellpadding="5" cellspacing="4" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR};">
				<TR  bgcolor="#2792B4" align="center" height="20px">
					<TD width="100%"><FONT COLOR ="white" SIZE="3" ><B>Add Project Details</FONT><BR><FONT SIZE="2" COLOR="white">Work Code Number:&nbsp;{WORKCODE}</FONT></B></TD>
				</TR>
				<tr>
					<td>
						<table  cellspacing="2"  align="center" width="100%" cellpadding="3" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}" >
							<TR>
								<td colspan="2" bgcolor="#2792B4"  height="07%" align="center" width="100%"><font color="white" style="class:headings;"><B>WorkCode Details</B></font><br/>
								</td>
							</TR>
							<tr valign="top" >
								<td>
									<fieldset style="width:98%; align:center">
										<table align="center" cellpadding="5" cellspacing="5" width="100%" style="border-collapse:collapse;border:0px solid {TABLEBORDERCOLOR};">								
											<tr width="100%">
												<td align="left" width="20%"><font color="Black">Main Project Name</font></td>
												<td align="left" width="25%">{NHDP}</td>
											
												<td align="left" width="20%"><font color="Black">Project Name</font></td>
												<td align="left" width="25%">{CATEGORY}</td>
											</tr>
										    <tr width="100%">
												<td align="left" width="20%"><font color="Black">Corridor</font></td>
												<td align="left" width="25%">{FROM_TO}</td>
											
												<td align="left" width="20%"><font color="Black">Approval Year</font></td>
												<td align="left" width="25%">{APPROVALYEAR}</td>
											</tr>
											<tr width="100%">
												<td align="left" width="20%"><font color="Black">National Highway Number</font></td>
												<td align="left" width="25%">{NHNO}</td>
											
												<td align="left" width="20%"><font color="Black">Total Length (in Km.)</font></td>
												<td align="left" width="25%">{TOTALKM}</td>
											</tr>
										</table>
									</fieldset>
								</td> 
							</tr>
							<tr valign="top" >
								<td>
									<a href="javascript:void(0);" id="showDIV">More Details</a>
									<div id="seconddiv">										
										<table class="" align="center" cellpadding="5" cellspacing="3" width="100%" style="border-collapse:collapse;border:0px solid {TABLEBORDERCOLOR};" >											
											<tr>
												<td>
													<fieldset style="width:98%; align:center">
														<legend><B><font color="blue">Project Description</font></B></legend>
														<table cellpadding="5" cellspacing="5" width="100%" align="center">										
															<tr>
																<td>
																	{PROJECTNAME}
																</td>
																<td>													
															</tr>											
														</table>
													</fieldset>
												</td>
											</tr>	
											<tr>
												<td>
													<fieldset style="width:98%; align:center">
														<legend><B><font color="blue">Cost and Dates</font></B></legend>
														<table cellpadding="5" cellspacing="5" width="100%" align="center">										
															<tr width="100%">
																<td align="left" width="20%"><font color="Black">Estimated Cost</font></td>
																<td align="left" width="25%"><B>&#2352;</B>&nbsp;{ESTIMATEDCOST}</td>
															
																<td align="left" width="20%"><font color="Black">Total Length (in Km.)</font></td>
																<td align="left" width="25%">{ESTIMATELENGTH}</td>
															</tr>
															<tr width="100%">
																<td align="left" width="20%"><font color="Black">Actual Start Date</font></td>
																<td align="left" width="25%">{ACTUALSTARTDT}</td>
															
																<td align="left" width="20%"><font color="Black">Actual End Date</font></td>
																<td align="left" width="25%">{ACTUALENDDT}</td>
															</tr>
														</table>
													</fieldset>
												</td>
											</tr>
											<tr>
												<td>
													<fieldset style="width:98%; align:center">
														<legend><B><font color="blue">Workcode Remarks</font></B></legend>
														<table cellpadding="5" cellspacing="5" width="100%" align="center">										
															<tr>
																<td>
																	{REMARKS}
																</td>
																<td>													
															</tr>											
														</table>
													</fieldset>
												</td>
											</tr>
											<tr>
												<td>
													<fieldset style="width:98%; align:center">
														<legend><B><font color="blue">Ministries</font></B></legend>
														<table cellpadding="5" cellspacing="5" width="100%" align="center">										
															<tr width="100%">
																<td align="left" width="20%"><font color="Black">Central Ministry</font></td>
																<td align="left" width="25%">{MINISTRIES}</td>
															
																<td align="left" width="20%"><font color="Black">Central Participate</font></td>
																<td align="left" width="25%">{CENTRALPARTICIPATE}</td>
															</tr>
															<tr width="100%">
																<td align="left" width="20%"><font color="Black">Central Department</font></td>
																<td align="left" width="25%">{CENTRALDEPARTMENT}</td>
															
																<!-- <td align="left" width="20%"><font color="Black">Actual End Date</font></td>
																<td align="left" width="25%">{ACTUALENDDT}</td> -->
															</tr>
														</table>
													</fieldset>
												</td>
											</tr>
										</table>																				
									</div>
								</td>
							</tr>
						</table>
					</td>
				</tr>
				<tr>
					<td>
						<table  cellspacing="2"  align="center"  width="100%" cellpadding="3" style="border-collapse:collapse;border:1px solid {TABLEBORDERCOLOR}" >
							<TR>
								<td colspan="2" bgcolor="#2792B4"  height="10%" align="center" width="100%"><font color="white" style="class:headings;"><B>Project Details</B></font><br/>
								</td>
							</TR>	
							<tr>
								<td>
									<fieldset style="width:98%; align:center">													
										<table align="center" cellpadding="5" cellspacing="5" width="100%" style="border-collapse:collapse;border:0px solid {TABLEBORDERCOLOR};" >
											<!-- <tr>
												<td align="left"><font color="Black">Stretch Name</font></td>
												<td align="left"><input  type="text" class="texts" style="width:250px" name="stretchname" value="{STRETCHNAME}"/></td>
											
												<td align="left"><font color="Black">Kilometer</font></td>
												<td align="left">From<input  type="text" class="texts" style="width:100px" name="kmfrom" value="{KMFROM}"/>&nbsp;To<input  type="text" class="texts" style="width:100px" name="kmto" value="{KMTO}"/></td>
											</tr> -->	
											<tr width="100%">
												<td colspan="4">
													<table border="0" width="100%"> 
														<tr width="100%">
															<td align="left" width="17%"><font color="Black">State Name & Total Kilometer</font></td>
															<td align="left" width="20%">
																<select type="text" class="texts" style="width:150px" name="stateid" value="{STATEID}"/>{STATEOPTION}</select>&nbsp;&nbsp;
																<input  type="text" class="texts" style="width:90px" name="statetotalkm" value="{STATETOTALKM}"/>
															</td>
															<td align="left" width="15%">
															<input class="button" type="submit" value="Add State" onclick="return formCheck1(theform);"/>
															
															</td>
															<td align="left" width="25%"></td>															
														</tr>
														<tr>
															<td colspan="1">
																
															</td>
															<td colspan="3">
																<!-- <iframe name="addstate" src="?module=addproject&action=addstate&nomenu=1" frameborder="0" width="336px" scrolling="no"></iframe> -->
															</td>
														</tr>
													</table>
												</td>
											</tr>
													
				<TR>
					<TD ><br/>
						<table align = "center" border="0" width="100%" cellpadding="5" cellspacing="4">

							<tr>
								<td align="center" >
									<!-- IF GROUPID <> "2" -->
									<input class="button" type="submit" value="Submit" onclick="return formCheck(theform);"/>
									<!-- ENDIF -->
									<!-- IF GROUPID == "2" -->
									<A href="#" onclick="alert('Sorry you do not have permission to insert data');" class="button"><FONT SIZE="" COLOR="white"><B>Submit</B></FONT></a>
									<!-- ENDIF -->				
								</td>
							</tr>  
						</table>
					</TD>
				</TR>
			</table>
		</TD>
	</TR>
</TABLE>

<input type="hidden" name="multiprojectid" value="{MULTIPROJECTID}"/>
<input type="hidden" name="workcodeid" value="{WORKCODEID}"/>	
<input type="hidden" name="workstatusid" value="{WORKSTATUSID}"/>	
<input type="hidden" name="projectid" value="{PROJECTID}"/>
		

<script>
	/* Java script for file upload Starts here*/
	function jsUpload(upload_field) {
		//var re_text = /\.pdf|\.zip/i;
	    var filename = upload_field.value;
		  
		upload_field.form.submit();
		return true;
	 }
	/* Java script for file upload Ends here*/
	
	
			
	function formCheck(theform) {
		
		/*if(!validRequired(theform.workstatus,"Work Status "))
			return false;*/
	
		updateAddproject();
			return false;
	}
	function formCheck1(theform) {
		
		/*if(!validRequired(theform.workstatus,"Work Status "))
			return false;*/
	
		updateAddMultiState();
			return false;
	}
	

	function formCheckAddState(theform) {
		//alert('test');
		if(!validRequired(theform.statetotalkm,"Work Status "))
			return false;
	
		updateAddMultiState();
		return false;
	}

	$(function() {
		$('#datepicker').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker1').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker2').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker3').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker4').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker5').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker6').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker7').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker8').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker9').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker10').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker11').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker12').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker13').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker14').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker15').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker16').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker17').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker18').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});
	$(function() {
		$('#datepicker19').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

	$(function() {
		$('#datepicker20').datepicker({
			changeMonth: true,
			changeYear: true
		});
	});

</script> 

<style>
	fieldset
	{
		border:1px solid #a1a1a1;
		-moz-border-radius:5px; /* Firefox */
		border-radius:5px;		
	}
</style>

<style type="text/css">
	div.scroll
	{
		width:450px;
		height:360px;
		overflow:scroll;
	}
</style>	
<script type="text/javascript">

$(document).ready(function(){

$("#seconddiv").hide();

	 // show hide search container
    $("#showDIV").bind("click", function() {
        var text = $("#showDIV").text();
        if(text == "Hide Work Code Details"){
            $("#showDIV").text("Show Work Code Details");
        }
        else{
            $("#showDIV").text("Hide Work Code Details");
        }
        $("#seconddiv").slideToggle(2500);
        
    });

});
</script>