I have problem with indexOf.
I have search and when I type something, .mark-select li will disappear or appear, depend on key word, I want to do something when there is not words in search that contains in .marka-select li . I don't know how to check when there is not same words.
Help please!
This is my code :
$("#marka").keyup(function() {
var marka = $("#marka").val().toLowerCase();
if(marka != "") {
$(".marka-select li").hide();
$(".marka-select li").each(function() {
var trenutna_marka = $(this).attr("data-keywords").toLowerCase();
if(trenutna_marka.indexOf(marka) >=0) {
$(this).show();
}
});
} else {
$(".marka-select li").show();
}
});
Of course it is possible that I just do not understand the question but why not just add an else statement to your if indexOf check?
if(trenutna_marka.indexOf(marka) > -1) {
$(this).show();
} else {
... do something else ...
}
Related
I have a following jQuery which searches text in table rows and it works fine. The issue is that I would like to ignore/remove spaces when searching some text e.g.: I want to find this in a table:
'John Smith'
but when I type in search bar: Johnsmith then record is not found. So I would like to remove spaces in my jQuery code to find any text ignoring spaces. Here is my jQuery with commented code which removes spaces but it doesn't work:
$('document').ready(function() {
$('#search').keyup(function() {
search_table($(this).val());
});
function search_table(value) {
$('table .rows').each(function() {
var found = 'false';
$(this).each(function () {
//if ($(this).text().replace(" ", "").toLowerCase().indexOf(value.toLowerCase()) >= 0) {
if ($(this).text().toLowerCase().indexOf(value.toLowerCase()) >= 0) {
found = 'true';
}
});
if (found == 'true') {
$(this).show();
} else {
$(this).hide();
}
});
}
});
use .replace(/ /g,"") to replace all spaces (groups of spaces)
if ($(this).text().toLowerCase().replace(/ +/g,"").indexOf(value.toLowerCase()) >= 0) {
found = 'true';
}
I want to make the alert appear if the number of infant is more than adults.
I've tried but it looks like something went wrong.
Please help.. thanks before
ex: http://jsfiddle.net/pBxfX/132/
var button = $('#submit'),
adult = $('#adult option:selected').val(),
infant = $('#infant option:selected').val();
if(adult > infant) {
$("#alert").hide;
}
else if(adult == infant) {
$("#alert").hide;
}
else {
$("#alert").show;
}
A few things:
You need to treat hide and show as methods (call them as .hide() and .show())
You need to execute your checking code in the change event handler for the select.
When comparing adults to infants, you need to treat them as integers (they are currently being treated as strings).
See http://jsfiddle.net/pBxfX/133/ for updated code
var button = $('#submit');
$(document).ready(function() {
$(button).attr('disabled', true);
$('input[type="text"]').on('keyup', function() {
var from = $("#from").val(),
to = $("#to").val();
if (from != '' && to != '') {
$(button).attr('disabled', false);
} else {
$(button).attr('disabled', true);
}
});
// Run code when any <select> changes
$("select").on('change', function() {
var adult = parseInt($('#adult option:selected').val()); //convert to integers for comparison
var infant = parseInt($('#infant option:selected').val()); //convert to integers for comparison
if (adult > infant) {
$("#alert").hide(); //Note that it is .hide() not .hide
} else if (adult == infant) {
$("#alert").hide();
} else {
$("#alert").show();
}
});
});
hide() and show() are functions so you need to add () to call these functions.
if(adult > infant) {
$("#alert").hide();
}
else if(adult == infant) {
$("#alert").hide();
}
else {
$("#alert").show();
}
I am trying to add a search filter so that user can find results from this list of contracts while they are typing. E.g.: if a user types "IP", then the top 4 results should be displayed. Following is the function:
$('#doc_search').on('keyup', function(){
var inputtext = $(this).val().toLowerCase();
$('.subdoclist li a').each(function() {
if(inputtext ==''){
$('.subdoclist li').each(function(){
$(this).addClass('show');
});
console.log(inputtext);
} else if ($(this).text().toLowerCase() === inputtext) {
$('.subdoclist li').removeClass('show');
$(this).parent().addClass('show');
console.log(inputtext);
}
});
})
'#doc_search' is the search field on top
'.subdoclist li' are the list items that contain anchor tags with text
At the moment, I have to type exact text and only then the search works.
Fiddle link: Click here
Here it is with a couple of things fixed up, first I'm using indexOf > -1 to see if the input string is contained within each potential match, and instead of removing show on all of them per-match I do it before it performs the search.
$('#doc_search').on('keyup', function() {
var inputtext = $(this).val().toLowerCase();
if (inputtext != '') {
$('.subdoclist li').removeClass('show');
$('.subdoclist li a').each(function() {
if ($(this).text().toLowerCase().indexOf(inputtext) > -1) {
$(this).parent().addClass('show');
}
});
} else {
$('.subdoclist li').addClass('show');
}
});
If you want a simple search, you can check if the text entered is contained on the string like this:
How to check whether a string contains a substring in JavaScript?
You can check each word entered on the search, splitting the string with space delimiter and using a loop but that will take more effort if there too words or a lot if entries.
Short and case-sensitive variant:
$('#doc_search').on('keyup', function() {
var inputtext = $(this).val();
if (inputtext !== '') {
$('.subdoclist li').each(function() {
$(this).toggle($("a:contains('"+ inputtext +"')",$(this)).length > 0);
});
} else {
$('.subdoclist li').show();
}
});
I want to filter a list (show/hide the lis) based on the contents of a span within the li. Currently I have something working, but it filters the list no matter where the match occurs. I need it to be seeded to the start, so only if the match occurs at the start of the span will it be shown, otherwise it will be hidden.
<li><img/><span>text</span></li>
<li><img/><span>other text</span></li>
<li><img/><span>other words</span></li>
so, if I filter on "text", currently the first 2 would be returned whereas I only want the first (as the word "text" is at the start of it).
This is what I currently have:
var value = $("#listcontainer ul#list input").val();
if(value == '') {
$('ul#list> li').show(); //show all, if nothing entered
} else {
$('ul#list > li:not(.plain):not(:contains(' + value + '))').hide();
$('ul#list > li:not(.plain):contains(' + value + ')').show();
} //.plain = li which contains the text input
Thanks
Try:
$('ul#list > li:not(.plain)').text(function(i, text) {
var show = text.slice(0, value.length) === value;//starts with value
$(this).toggle(show);//if starts with val show otherwise hide
});
This will check if the text of each li starts with the value and show it if it does, otherwise hide it.
Try
var value = $("#listcontainer ul#list input").val().toLowerCase();
if (value == '') {
$('ul#list> li').show(); //show all, if nothing entered
} else {
var $lis = $('ul#list > li:not(.plain)').filter(function () {
return $.trim($(this).text()).toLowerCase().indexOf(value) == 0;
});
$('ul#list > li:not(.plain)').not($lis).hide();
$lis.show();
} //.plain = li which contains the text input
Even if you got this to work, you would run into all sorts of problems trying to escape parentheses, etc.
Try the more readable
var value = $("#listcontainer ul#list input").val();
if(value == '') {
$('ul#list> li').show();
} else {
$('ul#list > li').each(function() {
if($(this).text() == value) {
$(this).show();
} else {
$(this).hide();
}
});
}
Also, know that filter is an option (though for your problem, I would go with the solution above).
Try this way :
var value = $("#listcontainer ul#list input").val();
if(value == '') {
$('ul#list> li').show(); //show all, if nothing entered
} else {
$('ul#list > li').each(function() { $(this).toggle(
$(this).find('span').text() == value); });
}
$(document).ready(function () {
$("#btnhighlight").click(function () {
var htext = $("#txthighlighttext").val();
if (htext == '') {
alert("Pleae enter the search item.");
return false;
}
$("#lstCodelist option").each(function () {
$(this).removeClass('searchItem');
if ($(this).text().search(htext) != -1) {
$(this).addClass('searchItem');
}
});
});
});
Lets take I have a row something like this
I love to work with Jquery.
If I enter my search text as jquery its not highlighting Jquery. But my query should work in both they way regardless of CAPS or SMALL letters.
how to change my code to work like that.
thanks for your all help.
use .toUpperCase() ............. // or lowerCase
if ($(this).text().toUpperCase().indexOf(htext.toUpperCase()) != -1) {
This one should work, I believe:
$(document).ready(function () {
$("#btnhighlight").click(function() {
var htext = $("#txthighlighttext").val().toLowerCase();
if (htext === '') {
alert("Please enter the search item.");
return false;
}
$("#lstCodelist option").each(function() {
var $this = $(this);
if ($this.text().toLowerCase().indexOf(htext) !== -1) {
$this.addClass('searchItem');
} else {
$this.removeClass('searchItem');
}
});
});
});
Sidenote: indexOf is proven to be faster than search.