Jeg hadde en fungerende kode som kunne tilbakestille skjemaet mitt når jeg klikker på en tilbakestillingsknapp. Men etter at koden min blir lengre, innser jeg at den ikke fungerer lenger.
<div id="labels">
<table class="config">
<thead>
<tr>
<th colspan="4"; style= "padding-bottom: 20px; color:#6666FF; text-align:left; font-size: 1.5em">Control Buttons Configuration</th>
</tr>
<tr>
<th>Index</th>
<th>Switch</th>
<th>Response Number</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<form id="configform" name= "input" action="#" method="get">
<tr><td style="text-align: center">1</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" value="" id="number_one"></td>
<td><input style="background: white; color: black;" type="text" id="label_one"></td>
</tr>
<tr>
<td style="text-align: center">2</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" id = "number_two" value=""></td>
<td><input style="background: white; color: black;" type="text" id = "label_two"></td>
</tr>
<tr>
<td style="text-align: center">3</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" id="number_three" value=""></td>
<td><input style="background: white; color: black;" type="text" id="label_three"></td>
</tr>
<tr>
<td style="text-align: center">4</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" id="number_four" value=""></td>
<td><input style="background: white; color: black;" type="text" id="label_three"></td>
</tr>
<tr>
<td></td>
<td><input type="submit" id="configsubmit" value="Submit"></td>
</tr>
<tr>
<td><input type="reset" id="configreset" value="Reset"></td>
</tr>
</form>
</tbody>
</table>
</div>
Og min jQuery:
$('#configreset').click(function(){
$('#configform')[0].reset();
});
Er det noen kilde som jeg bør inkludere i kodene mine for at .reset()
-metoden skal fungere? Tidligere brukte jeg:
<script src="static/jquery.min.js">
</script>
<script src="static/jquery.mobile-1.2.0.min.js">
</script>
og .reset()
-metoden fungerte.
For øyeblikket bruker jeg
<script src="static/jquery-1.9.1.min.js"></script>
<script src="static/jquery-migrate-1.1.1.min.js"></script>
<script src="static/jquery.mobile-1.3.1.min.js"></script>
Kan det muligens være en av grunnene?
$('#configreset').click(function(){
$('#configform')[0].reset();
});
Sett det i JS-fele. Fungerte som tiltenkt.
Så ingen av de ovennevnte problemene er feil her. Kanskje du har et motstridende ID-problem? Blir klikket faktisk utført?
Rediger: (fordi jeg er en trist sekk uten riktig kommenteringsevne) Det er ikke et problem direkte med koden din. Det fungerer fint når du tar det ut av konteksten til siden du bruker for øyeblikket, så i stedet for at det er noe med de spesielle jQuery / javascript og attribuerte skjemadataene, må det være noe annet. Jeg ville begynne å halvere koden rundt den og prøve å finne ut hvor det skjer. Jeg mener, bare for å være sikker, antar jeg at du kan ...
console.log($('#configform')[0]);
i klikkfunksjonen og sørge for at det' er rettet mot riktig skjema ...
og hvis det er det, må det være noe som ikke er oppført her.
rediger del 2: En ting du kan prøve (hvis det ikke er rettet mot det riktig) er å bruke "input: reset" i stedet for det du bruker ... også, jeg vil foreslå fordi det ikke er målet som fungerer feil for å finne ut hva det faktiske klikket er rettet mot. Bare åpne opp firebug / utviklerverktøy, hva har du, kast inn ...
console.log($('#configreset'))
og se hva som dukker opp. og så kan vi gå derfra.
En tilbakestillingsknapp trenger ikke noe skript i det hele tatt (eller navn eller id):
<input type="reset">
og du er ferdig. Men hvis du virkelig må bruke skript, merk at hver skjemakontroll har en form-egenskap som refererer til skjemaet den er i, så du kan gjøre det:
<input type="button" onclick="this.form.reset();">
Men en tilbakestillingsknapp er et langt bedre valg.