0

I have a html page which contains textbox and checkboxes. When I call the javascript function to reset form using the reset button, textbox value has been reset. Checkboxes values reset in DOM, but not reflecting in UI. If I click anywhere in a webpage, then checkbox box value reset in UI.

What could be an issue?

HTML

<table width="100%" border="0" cellpadding="0" cellspacing="0"
                            class="table alignright">
<tr>
        <td style="line-height: 30px;">Role:</td>
            <td>
                <input type="text" id="roleName" class="inp_style1" placeholder="" th:field="*{roleName}"/>
                <input type="hidden" th:field="*{id}"/>
            </td>
</tr>
<tr>
        <td>Student<span class="input_checkbox"><input
            type="checkbox" class="styled" name="1" th:field="*{student}" /></span></td>
</tr>
<tr>
        <td>Staff<span class="input_checkbox"><input 
            type="checkbox" class="styled" name="1" th:field="*{staff}" /></span></td>
</tr>
</table>

<div class="bttn_box">
    <button type="reset" id="resetBtn" style="display:none;"></button>
    <a href="javascript:;" onclick="clearSelectForm()">Clear</a>
</div>

jQuery

function clearSelectForm() {
    $('#showErrorMessage').html('');
    $('#userError').html('');
    $('#resetBtn').click();
}
Martin Jinda
  • 488
  • 10
  • 26
A R kumar
  • 1
  • 1
  • Are you using a library which changes the Ui of the checkboxes? – Rory McCrossan Jul 24 '17 at 12:58
  • Can you post the function you're calling? – henrique romao Jul 24 '17 at 12:59
  • Updated with html and javascript – A R kumar Jul 24 '17 at 13:34
  • It sounds like you're trying to force the browser to explicitly redraw the parts of the UI whose state has changed. These may be relevant: [https://stackoverflow.com/questions/8840580/force-dom-redraw-refresh-on-chrome-mac](https://stackoverflow.com/questions/8840580/force-dom-redraw-refresh-on-chrome-mac), [https://stackoverflow.com/questions/21664940/force-browser-to-trigger-reflow-while-changing-css](https://stackoverflow.com/questions/8840580/force-dom-redraw-refresh-on-chrome-mac) – anandsun Jul 24 '17 at 13:47
  • Reset button only works if the inputs/checkboxes (including reset button) are between `
    ` and `
    ` tags. Working js fiddle example: https://jsfiddle.net/4gdtr664/     – Axel Stone Jul 24 '17 at 15:17
  • Btw, what does the `th:field="*{staff}"` do? Are you using any javascript frameworks that are capable of autoupdating element values? – Axel Stone Jul 24 '17 at 15:20

0 Answers0