There is modal window in my jsp. I use it for both: add or edit my items. It decides what to do depends on "id": add if "id" is null, edit - if not null.
<div class="modal fade" id="editRow">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h2 class="modal-title" id="modalTitle"></h2>
</div>
<div class="modal-body">
<form class="form-horizontal" id="detailsForm">
<input type="hidden" id="id" name="id">
...
<div class="form-group">
<div class="col-xs-offset-3 col-xs-9">
<button class="btn btn-primary" type="button" onclick="save()">
<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
</button>
</div>
</div>
</form>
Generally it works fine, but there is one scenario which does not work:
- I open "edit" windows for some item
- Don't save it, just close "edit" window
- Open "add" window, enter some data
- After saving it edit item from 1), instead adding new one
There is button on this jsp, which I press to call "add" window:
<a class="btn btn-info" onclick="add('<spring:message code="meals.add"/>')">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
</a>
There is "add" js function from this button:
var form;
...
form = $('#detailsForm');
...
function add(title) {
$('#modalTitle').html(title);
form[0].reset();
$('#editRow').modal();
}
I thought form[0].reset();
should prevent such wrong scenario, but seems it does not help. Could you explain?