I have a Iframe which has a form with text fields.This form is created by php script. The parent page refresh auto, continuously.
<form id="form" method="post" action="test.php?vid='.$vid.'">
<table border="1" width="100%" style="border-collapse:collapse">
<tr>
<th class="col-header list">Distance </th>
<th class="col-header list">Service</th>
<th class="col-header list">Recipient</th>
</tr>
<tr>
<td >
<input type="text" class="input" id="cdistance" name="cdistance" />
</td>
<td nowrap class="list">
<input type="text" class="input" id="service" name="service" />
</td>
<td nowrap class="list">
<input type="text" class="input" id="destination" name="destination" />
</td>
</tr>
<tr>
<td width="100%" colspan="3" style="background:#e0e0e0;">
<input type="submit" class="btn" name="add" id="add" value="Add New"/>
<input type="hidden" name="distance_unit" value="'.$distance.'" />
</td>
</tr>
</table>
</form>
To avoid user entered data loosing ('before hit submit') I used query code in parent page to get those entered text in Iframe's form and add them back to text fields after page refreshed.
My problem is when the user hit the submit button after page refreshed text fields are not cleared (form not reset) but data submitted successfully.So I tried to reset the form by $('#form')[0].reset(). This is the error I got
Uncaught TypeError: Cannot read property 'reset' of undefined
Also tried $('#textVal').val(''); to empty text fields. But still the data remaining in text fields.
Note: The form is reset if the user hit submit button before refreshed. Does anyone need more details please let me know.
Any solution for this would be appreciated.
