The parent element is returned fadeOut ()
I have a search function that is supposed to hide those divs that don't match the search criteria.
HTML from elements
<div class="form-group" id="number">
<input class="form-control tfInput" id="tfInput1" type="text" value="test">
<button type="button" class="btn btn-success" id="update1"> Save
</button>
<button type="button" class="btn btn-default" aria-label="Delete" id="delete1">Delete
</button>
</div>
There are several of these sections that are loaded onto the page. All these divs have a class .tfInput
and are attached to the form with an id "list"
.
HTML where divs are loaded into
<form class="form-inline">
<div class="form-group">
<input class="form-control" type="text" id="searchElement" style="width: 200px" />
<button type="button" class="btn btn-default" onclick="search()">search</button>
</div>
</form>
<div class="container">
<form class="form-inline" id="list"></form>
</div>
There is a search box with an ID "searchElement"
, and the search function is called when a button is clicked or with an event keyup()
in the search box.
Javascript
function search() {
$.each($('#list .tfInput'), function(index, input) {
if (new RegExp($('#searchElement').val().toUpperCase()).test(input.value.toUpperCase())) {
$(input).parent().show();
} else {
$(input).parent().fadeOut();
}
})
};
Problem
The divas disappear, but they reappear within the same second.
They never remain hidden.
Any solution?
thank
source to share
I had a similar problem :) Try to block your button like:
$("#Button").click(
function(event) {
$(this).attr("disabled", true);
event.preventDefault();
//your code
$(this).attr("disabled", false);
};
);
For some unknown reason, javascript likes to interpret double-click click.
Also, if your items have a default mode, it can revert to it. To prevent this, we just used event.preventDefault ()
The third option is that you hide it elsewhere. Forth option: you use every tfInput element. Therefore, it finds the original source data by the parents. Finds the second - shows the original data. Finds the third - hides the inputs of the parent ect. It toggles the same item.
source to share