I am trying to search the contents using jquery. Search option working fine. But, I have faced some case insensitive problem here. My full codes on jsfiddle. if i put senthil in my search it didn't show the result. Because, I have Senthil (Uppercase S) in my content. How do I find Uppercase letters in jquery?
JsFiddle
$('#search').on('input', function(){
var text = $(this).val();
$('.subjects a').show();
$('.subjects a:not(:contains(' + text + '))').hide();
$('.subjects a span').show();
});
You can use a custom expression for contains like this:
$.expr[":"].contains = $.expr.createPseudo(function(arg) {
return function( elem ) {
return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
};
});
Updated Fiddle
Add this code to your JS code
$.expr[":"].contains = $.expr.createPseudo(function(arg) {
return function( elem ) {
return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
};
});
Credits Here
Related
I want to write a validation for a textarea to prevent to type some words, well for example if you type Viber on textarea it will remove that and then alert, my problem is this code only work when you type viber first! if you type for ex: I like Viber, it doesn't work, i want to find viber everywhere in textarea and remove it, and second problem is i want to do this with all type of text in lowercase and uppercase, VIBER, viber, Viber, ViBeR and etc... can i do this?
$('textarea').keyup(function() {
var val = this.value;
var my = $(this).val();
if ( val.indexOf('viber') == 0 ) {
$(this).val($(this).val().split(my).join(""));
alert("viber not allowed");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<textarea></textarea>
JSFiddle
$('textarea').keyup(function() {
if ($(this).val().toLowerCase().indexOf('viber') != -1) {
$(this).val($(this).val().replace(/viber/i, ''));
alert('never say "Viber" again!');
}
});
And pay attention to the String.indexOf - it returns index of the first match or -1 if it didn't find anything. In your case, you're checking for zero - it's wrong because zero means that it finds first occurence in the begginning of string.
$('textarea').keyup(function() {
var val = this.value.toLowerCase();
var my = $(this).val();
if ( val.indexOf('viber') != -1 ) {
$(this).val($(this).val().split(my).join(""));
alert("viber not allowed");
}
});
http://jsfiddle.net/0g5kxbbh/2/
I am searching in list of 500 li's. using following code. but facing two problems. one when i press backspace very fastly after typing something, it is not captured. and also searching is case sensitive which i dont want. please suggest improvements in below code :
$('#find_question').bind("keyup", function() {
searchWord = $(this).val();
console.log("input length",searchWord);
if (searchWord.length >= 0) {
$('#leftSection li').each(function(i, data) {
text = $(this).text();
if (text.match(RegExp(searchWord, 'i')))
$(this).show();
else
$(this).hide();
});
}
});
Try this
The containsIgnoreCase comes from How do I make jQuery Contains case insensitive, including jQuery 1.8+?
Live Demo
$.expr[':'].containsIgnoreCase = function (n, i, m) {
return jQuery(n).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};
$function() {
$('#find_question').on("keyup", function() {
searchWord = $(this).val();
$('#leftSection li').hide();
if (searchWord.length >= 0) {
$('#leftSection li:containsIgnoreCase("'+searchWord+'")').show();
}
});
});
I have a jScript function to text search an element in drop down. It used to work fine till ie7. I have a workaround that works cross browsers but is slow in ie7 using jQuery option:contains instead of Regex.
Function:
/// For the dropdown element passed, find the index where the Text matches the passes string
/// and select this option. Returns true if found otherwise false
function selectTextinDropdown(el, sometext) {
// Use REgex instead of option:contains as it it much faster!
$(el).find("option:[text^='" + sometext.trim() + "']").each(function () {
// works ok but SLOW in IE 7!!
// $(el).find("option:contains('" + sometext.trim() + "')").each(function () {
//alert("found|" + this.text + "|" + sometext);
$(this).attr("selected", "selected");
if ($(this).text() == sometext) {
$(this).attr("selected", "selected");
return true; //found and selected!
}
return false; //Not found and Not selected!
});
}
Anybody familiar with a better workaround?
tks for reading!
Try this:
function selectTextinDropdown(selectEle, targetText) {
if(targetText==null){
return false;
}
targetText = targetText.trim();
// Find all options that meet your condition
var $matches = $(selectEle).find('option').filter(function(index){
// only use jquery selector once
var $this = $(this);
// extract text from the option
var text= $this.text();
// determine if it's found
// OPTION A: exact match
var found = (text === targetText);
// OPTION B: partial match
// var found = (text.indexOf(targetText) >= 0);
if(found){ // select item if found
$this.attr("selected", "selected");
}
return found;
});
return ($matches!=null && $matches.length>0);
}
Sorry for the horrible title, Am terrible at wording these things.
What I am trying to do is quite simple I think.
I have a set of hidden letters that make up a word.
Below them is a selection of random jumbled up letters.
When people click one of the random jumbled letters I am filtering through the hidden letters and showing the corresponding letter.
What I need to do is, if someone clicks a letter, filter through the hidden letters and either return a "true" and show the letter or return a "false/null" and make an alert();
This is how I am filtering at the moment. I am confused as to where to place an if statement or if that is even the approach I should be taking.
And here is a fiddle (the hidden word is "Seal") - http://jsfiddle.net/GA7WB/
var $buttons = $('#letters span'),
$hidden = $('.letter');
$buttons.click(function(){
_selected = $(this).html();
$hidden.filter(function() {
return $(this).text() == _selected;
}).show();
});
You just need to check the length of the results returned by the filter:
// get matched elements
var matches = $hidden.filter(function() {
return $(this).text() == _selected;
});
// show them, or alert if none
if (matches.length > 0) matches.show();
else alert("There are no " + _selected + "'s");
See Fiddle
Try setting a flag if you find one:
var $buttons = $('#letters span'),
var $hidden = $('.letter');
$buttons.click(function(){
_selected = $(this).html();
var foundOne = false;
$hidden.filter(function() {
var retval = $(this).text() == _selected;
if (retval) foundOne = true;
return retval;
}).show();
if (!foundOne) {
alert("Nope");
}
});
FIDDLE http://jsfiddle.net/GA7WB/4/
I want to replace all characters in the textarea by a click using jQuery.
For example:
ə = e, ı = i, ...
Thıs ıs əxamplə
By clicking it should be:
This is example
$('textarea').html($('textarea').html().replace(/ə/g,'e'))
Adding on from Zikes
var replace_map={
"ı":"i",
"ə":"e"
};
$('textarea').click(function(){
var ret='';
$.each(this.value.split(''), function(i, str) {
ret += replace_map[str] || str;
})
this.value = ret;
});
DEMO
UPDATED EDIT
var replace_map={
"ı":"i",
"ə":"e"
};
$('textarea').click(function(){
this.value = $.map(this.value.split(''), function(str) {
return replace_map[str] || str;
}).join('');
});
UPDATED DEMO
HTML:
<textarea>Thıs ıs əxamplə</textarea>
JS:
var replace_map={
"ı":"i",
"ə":"e"
};
$('textarea').click(function(){
this.value = this.value.replace(/./g,function(str){
return replace_map[str] || str;
})
});
I don't think you really need jQuery for that other than perhaps to select the textarea element (and then only for a microscopic amount of ease).
Past that you should be able to use just string.replace on the textarea content:
https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String/replace