Develop Reference

How can i unset the changes made by jquery?

I am filtering data according to first character but when user click all I want to show all the data but once I have filtered data according to character I am not able to reset it to all.
I want to allow user to filter data according to alphabet user select and when user click all user should be able to see all the items again.
My code:
$('.myFilters li').on("click", function() {
if($(this).text() == "all"){
$(this).show();
return ;
}
var letter = $(this).text()[0];
$('#mycatouter div').each(function() {
letter=letter.toUpperCase();
if ($(this).text()[0] == letter) {
$(this).show();
} else {
$(this).hide();
}
});
});

The issue is in the usage of the this keyword:
$('.myFilters li').on("click", function() {
if($(this).text() == "all"){
$('#mycatouter div').show();
return;
}
var letter = $(this).text()[0];
$('#mycatouter div').each(function() {
letter = letter.toUpperCase();
if ($(this).text()[0] == letter) {
$(this).show();
} else {
$(this).hide();
}
});
});
In your first if, this refers to the event target, while in the each loop it refers to the current element in the loop.

$(this).hide() hides containers it shouldn't

I have this little piece of code that filters through a list of results and hides the divs that don't match. I am writing this for a PhoneGap iOS application. It works fine on Android, but on iOS for some reason it hides the entire search field as well after typing a few characters, not just the results.
Any idea why? I've stripped it down to almost only the HTML code and jQuery and it's still happening. I tried commenting out the $(this).hide(); part and it stops hiding the search field, so I assume somehow that's the culprit, but I can't figure out why or how to fix this. Been at it for 10 hours straight. Any ideas? Maybe I can target the results some other way?
$('#box_search').keyup(function() {
var valThis = $(this).val().toLowerCase();
if (valThis == "") {
$('#listing-results > .listing_container').show();
} else {
$('#listing-results > .listing_container').each(function() {
var text = ($(this).find('.listing_results_text_name').text() + $(this).find('.listing_results_text_name').data("alt")).toLowerCase();
if (text.indexOf(valThis) >= 0) {
$(this).show();
} else {
$(this).hide();
}
});
};
});

obviously I cant see the html but sometimes it helps to clean the code and just change the logic slightly
var box_search = function(e){
var myIndex = $(this).val();
val = (!myIndex || myIndex==='')?false:myIndex;
if(!myIndex){
$('#listing-results > .listing_container').show();
return;
}
//
$('#listing-results > .listing_container').each(function() {
var text = $(this).find('.listing_results_text_name').text() +
$(this).find('.listing_results_text_name').data("alt")
text = (!text || text==='')?false:text;
text = text.toLowerCase();
if(text.indexOf(myIndex.toLowerCase()) >= 0){
$(this).show();
return;
}
$(this).hide();
});
} //end of function
$('.box_search').keyup(box_search);

JQuery live search exact match

I'm using a live search that I modified to run after pressing enter(I have a very large table and it causes the text entry to lag if done on keyUp) and I'm trying to find out a way to make it an exact search instead of just a similar. The reason being I have a column with store numbers starting from 1 to over 7000, if I type in just '1' I get a whole slew of results. I'm new to JQuery and I've tried to play around with it but I feel like I'm getting no where. Any and all help is appreciated.
Here is the code:
$('#search').keyup(function(e) {
if (e.keyCode == 13) {
$(this).trigger("enterKey");
}
});
$("#search").bind("enterKey", function() {
var value = $(this).val();
$("table tr").each(function(index) {
if (index !== 0) {
$row = $(this);
var id = $row.find("td:first").text();
if (id.indexOf(value) !== 0) {
$row.hide();
} else {
$row.show();
}
}
});
});

How to filter search results based on multiple data attributes

I'm trying to search multiple data results based on inline data attributes.
However, I can only figure out how to search a single data attribute instead of them all.
How would I accomplish this?
What I have: http://jsfiddle.net/9SMZC/2/
$("input[type=text]").keyup(function () {
var filter = $(this).val();
$("a").each(function () {
if ($(this).attr("data-event-name").search(new RegExp(filter, "i")) < 0) {
$(this).hide();
} else {
$(this).show();
matches++;
}
});
});
Thanks in Advance!

If you want to apply a "or" logic, you may do this :
$("input[type=text]").keyup(function () {
var filter = $(this).val();
$("a").each(function () {
var data = $(this).data();
$(this).hide();
for (var key in data) {
if (~data[key].search(new RegExp(filter, "i"))) {
$(this).show();
break;
}
}
});
});
Demonstration (try to search "andrew" for example)
The idea is to get the data object and iterate over the properties. To simplify the code (that is to avoid keeping a boolean) I also always hide and show when the element is ok.

Checkbox click script - [SHIFT] check/uncheck range, [CTRL] check/uncheck all -- based on select name?

Would anyone know of a ready-made script or plugin providing:
-Shift click for check/uncheck all in range
-CTRL click to select or unselect all
That can works off the check inputs 'name' (instead of all on a page or all inside a div):
input[name='user_group[]']
input[name='record_group[]']
I've been using a couple of scripts (javascript and jQuery) but they're based on all checkboxes in a div or table and I'm not smart enough to roll my own or modify another script. Google searching on this has been a little difficult (too many common terms I think)...
Thanks Much Appreciated!

I started playing around with this script, although it's missing a CTRL+Click feature (select all/none control).
In it's original form it works against all checkboxes on a page. I changed the "$('input[type=checkbox]').shiftClick();" linke to "$("input[name='selected_employees[]']").shiftClick();" and as far as I can tell it seems to be working perfectly now against only the single checkbox group.
The only flaw (for my requirements) is there is not a CTRL+Click function to toggle check or un-check all checkboxes in the group.
<script type="text/javascript">
$(document).ready(function() {
// shiftclick: http://sneeu.com/projects/shiftclick/
// This will create a ShiftClick set of all the checkboxes on a page.
$(function() {
$("input[name='selected_employees[]']").shiftClick();
// $('input[type=checkbox]').shiftClick();
});
(function($) {
$.fn.shiftClick = function() {
var lastSelected;
var checkBoxes = $(this);
this.each(function() {
$(this).click(function(ev) {
if (ev.shiftKey) {
var last = checkBoxes.index(lastSelected);
var first = checkBoxes.index(this);
var start = Math.min(first, last);
var end = Math.max(first, last);
var chk = lastSelected.checked;
for (var i = start; i < end; i++) {
checkBoxes[i].checked = chk;
}
} else {
lastSelected = this;
}
})
});
};
})(jQuery);
});
</script>

I believe this should work!
Working demo on jsFiddle: http://jsfiddle.net/SXdVs/3/
var firstIndex = null;
$(":checkbox").click(function(e) {
$this = $(this);
if (e.ctrlKey) {
if ($this.is(":checked")) {
$("input[name='"+ $this.attr("name") +"']").attr("checked", "checked");
} else {
$("input[name='"+ $this.attr("name") +"']").removeAttr("checked");
}
} else if (e.shiftKey) {
$items = $("input[name='"+ $this.attr("name") +"']");
if (firstIndex == null) {
firstIndex = $items.index($this);
} else {
var currentIndex = $items.index($this);
var high = Math.max(firstIndex,currentIndex);
var low = Math.min(firstIndex,currentIndex);
if ($this.is(":checked")) {
$items.filter(":gt("+ low +"):lt("+ high +")").attr("checked", "checked");
} else {
$items.filter(":gt("+ low +"):lt("+ high +")").removeAttr("checked");
}
firstIndex = null;
}
}
});