• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 283
  • Last Modified:

Pre-populate Element

Hi All,

I have a form that is populated from a list.  Here is a piece of the form:
form
If the AOT Designator is "Yes", the "CompletionDate" and "showCompletionDatelabel" are supposed to display but they are not.

Here is an excerpt of the code:

					<tr>
									<td style="width: 313px;font-weight:bold" class="bgColor">AOT Designator</td>
									<td class="bgColorElement">
										<select name="AotDesignator" id="drpdAotDesignator">
											<option value=""></option>
											<option value="Yes">Yes</option>
											<option value="No">No</option>
										</select>
									</td>
					</tr>					
					
					<tr>
									<td style="width: 313px;font-weight:bold" class="bgColor"><span style="display:none" id="showCompletionDatelabel">
									Completion Date</span></td>
									<td class="bgColorElement">
									<span style="display:none" id="showCompletionDate">
										<input type="text" name="txtCompletionDate" id="CompletionDate">
									</span>
									</td>
					</tr>



$(xData.responseXML).find("z\\:row").each(function() 
	{  
        var Designator = $(this).attr("ows_AOTDesignator");
		$("#drpdAotDesignator").val(Designator);
		alert(Designator);
		if(Designator == "Yes")
		{
			alert("Yes Again");
			$("#showCompletionDate").css("display", "block");
			$("#showCompletionDatelabel").css("display", "block");			
		}
	}

Open in new window

0
Isaac
Asked:
Isaac
2 Solutions
 
Jagadishwor DulalBraces MediaCommented:
I have slightly changed your table see the function you may add it in your existing
<script>
$(document).ready(function() {
$('#drpdAotDesignator').change(function(){
var Designator=$('#drpdAotDesignator').val();
		if(Designator =='Yes'){
			alert("Yes Again");
			$("#showCompletionDate").css("display", "block");
		}
	})
});
</script>                                  

Open in new window


And the table html is:
<tr>
									<td style="width: 313px;font-weight:bold" class="bgColor">AOT Designator</td>
									<td class="bgColorElement">
										<select name="AotDesignator" id="drpdAotDesignator">
											<option value=""></option>
											<option value="Yes">Yes</option>
											<option value="No">No</option>
										</select>
									</td>
					</tr>					
					
					<tr id="showCompletionDate" style="display:none">
									<td class="bgColor">
                                  
									Completion Date</td>
									<td class="bgColorElement">
										<input type="text" name="txtCompletionDate" id="CompletionDate">
									</td>
					</tr>

Open in new window

0
 
ramyajanarthananCommented:
Alternatively,You can use show() or hide() too...

$("#showCompletionDate").show();

You can similarly code for any number of div or tables,list items etc.,to show and hide based on the conditions.
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now