Hello, I have a small issue with copying text from one textbox in main window to another textbox in an iframe. The code i have is as follows:
index.html
<html>
...
\\JQuery Library Here
\\JQuery Code
<script>
$(function() {
$('#lastName').keyup(function() {
var txtClone = $(this).val();
var rel = $("#listUnder").contents().find("#relationship option:selected").text();
if(rel == "Son" || rel == "Daughter"){
$("#listUnder").contents().find("#surname").val(txtClone);
}
});
});
</script>
<body>
<input type="text" name="lastName" id="lastName"/>
<div align="center">
<iframe src="other.html" width="680" height="360" frameborder="1" name="listUnder" id="listUnder" scrolling="auto"></iframe>
</div>
</body>
</html>
other.html
<html>
<body>
<form>
Relationship:
<select name="relationship" id="relationship" style="width:120px;">
<option value=""></option>
<option value="Son">Son</option>
<option value="Daughter">Daughter</option>
<option value="Cousin">Cousin</option>
<option value="Brother">Brother</option>
<option value="Sister">Sister</option>
</select>
<p>
Surname:
<input type="text" name="surname" id="surname" size="20"/>
</form>
</body>
</html>
Now the issue is that when i select "Son" or "Daughter" in select box of iframe page(other.html) it allows me to type the last name in lastName textbox of index.html and it then shows in surname textbox of iframe page in real time. But what i want to happen is that when you type in the last name textbox in index.html and then select "Son" or "Daughter" in relationship dropdown box of iframe in other.html, the text in last name box should then be copied to the surname box of iframe without having to interact with the last name textbox again.
Thanks in advance.
