1. Sort table first column by jQuery
Create a function sortTable. Pass table id & order
function sortTable(table, order) {
var asc = order === 'asc',
tbody = table.find('tbody');
tbody.find('tr').sort(function(a, b) {
if (asc) {
return $('td:first', a).text().localeCompare($('td:first', b).text());
} else {
return $('td:first', b).text().localeCompare($('td:first', a).text());
}
}).appendTo(tbody);
}
Call function when document loaded
jQuery(document).ready(function() {
sortTable($('#editable'),'asc');
});
2. Sort the select option without empty value
Html:
<select id="contacts" class="filteroption" name="data[Candidateprofile][company]">
<option value="">Contact</option>
<option value="1">John</option>
<option value="2">Joseph</option>
<option value="3">Charles</option>
<option value="4">Edward</option>
<option value="5">Kevin</option>
<option value="6">Donald</option>
<option value="7">Brian</option>
</select>
jQuery:
$("#contacts").append($("#contacts option:gt(0)").sort(function (a, b) {
return a.text == b.text ? 0 : a.text < b.text ? -1 : 1;
}));
3. Sort according to Case sensitivity
selectSort('#contacts', 'text', 'asc');
var selectSort = function (select, attr, order) {
if(attr === 'text'){
if(order === 'asc'){
$(select).html($(select).children('option').sort(function (x, y) {
return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1;
}));
$(select).get(0).selectedIndex = 0;
e.preventDefault();
}
if(order === 'desc'){
$(select).html($(select).children('option').sort(function (y, x) {
return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1;
}));
$(select).get(0).selectedIndex = 0;
e.preventDefault();
}
}
};
Create a function sortTable. Pass table id & order
function sortTable(table, order) {
var asc = order === 'asc',
tbody = table.find('tbody');
tbody.find('tr').sort(function(a, b) {
if (asc) {
return $('td:first', a).text().localeCompare($('td:first', b).text());
} else {
return $('td:first', b).text().localeCompare($('td:first', a).text());
}
}).appendTo(tbody);
}
Call function when document loaded
jQuery(document).ready(function() {
sortTable($('#editable'),'asc');
});
2. Sort the select option without empty value
Html:
<select id="contacts" class="filteroption" name="data[Candidateprofile][company]">
<option value="">Contact</option>
<option value="1">John</option>
<option value="2">Joseph</option>
<option value="3">Charles</option>
<option value="4">Edward</option>
<option value="5">Kevin</option>
<option value="6">Donald</option>
<option value="7">Brian</option>
</select>
jQuery:
$("#contacts").append($("#contacts option:gt(0)").sort(function (a, b) {
return a.text == b.text ? 0 : a.text < b.text ? -1 : 1;
}));
3. Sort according to Case sensitivity
selectSort('#contacts', 'text', 'asc');
var selectSort = function (select, attr, order) {
if(attr === 'text'){
if(order === 'asc'){
$(select).html($(select).children('option').sort(function (x, y) {
return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1;
}));
$(select).get(0).selectedIndex = 0;
e.preventDefault();
}
if(order === 'desc'){
$(select).html($(select).children('option').sort(function (y, x) {
return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1;
}));
$(select).get(0).selectedIndex = 0;
e.preventDefault();
}
}
};
Comments
Post a Comment