2015-09-07 2 views
2

У меня есть следующие JSON из веб-сервисасортировка по различным атрибутам с помощью JavaScript

var homes = [ 
    { 
     "h_id": "3", 
     "city": "Dallas", 
     "state": "TX", 
     "zip": "75201", 
     "price": "162500", 
     "createdOn": "2015-08-31 00:35:14" 
    }, { 
     "h_id": "4", 
     "city": "Bevery Hills", 
     "state": "CA", 
     "zip": "90210", 
     "price": "319250", 
     "createdOn": "2015-08-31 14:35:14" 
    }, { 
     "h_id": "5", 
     "city": "New York", 
     "state": "NY", 
     "zip": "00010", 
     "price": "962500", 
     "createdOn": "2015-08-31 13:35:14" 
    } 
]; 

Использование нг-Повторяю я хочу показать это в сНу (h_id) .Я знаю, как сортировать с помощью OrderBy. но здесь у меня есть список выбора html select.OnClick на том, что я хочу сортировать по New to Old, Old to new, price и h_id.

Как создать функцию javascript для получения этого типа функциональности?

+0

вы хотите, если выбрать цену его нужно сортировать по цене или сортировать по h_id? –

+0

yes..если мы выбираем цену, затем сортируем по цене или выбираем h_id сортировку по h_id и еще два варианта: newtoOld и oldtoNew. мы должны отсортировать это также – varunaer

+0

. Вы можете сослаться на следующие URL-адреса http://www.jitendrazaa.com/blog/webtech/web/pagination-and-sorting-of-data-table-using-angularjs/ http: // stackoverflow .com/questions/26879066/custom-sorting-in-angularjs –

ответ

0

Вы можете использовать функцию array.sort и дать ему функцию сравнения в качестве параметра.

ex.

homes.sort(function(l, r) { 
    return l.h_id - r.h_id; 
}); 

некоторая документация: http://www.w3schools.com/jsref/jsref_sort.asp

Вы могли бы иметь различные функции сравнения для каждого случая, и сортировка по выбору пользователя

+0

Я не понимаю, как назвать это в ng-repeat .. – varunaer

+0

ah sorry не понимал, что вы используете угловой: см. Документацию здесь: https: // docs .angularjs.org/api/ng/filter/orderBy orderBy выполняет предикатную функцию как второй параметр, поместив туда функцию логического сравнения, программно изменяя эту функцию логического сравнения, когда пользователь меняет порядок. – Simba

+0

thanks..trying it – varunaer

1

Try это ...

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> 
<html> 
<head> 
    <script type="text/javascript"> 
var homes = [ 
    { 
     "h_id": "3", 
     "city": "Dallas", 
     "state": "TX", 
     "zip": "75201", 
     "price": "162500", 
     "createdOn": "2015-08-31 00:35:14" 
    }, { 
     "h_id": "1", 
     "city": "Bevery Hills", 
     "state": "CA", 
     "zip": "90210", 
     "price": "319250", 
     "createdOn": "2015-08-31 14:35:14" 
    }, { 
     "h_id": "5", 
     "city": "New York", 
     "state": "NY", 
     "zip": "00010", 
     "price": "1", 
     "createdOn": "2015-08-31 13:35:14" 
    } 
]; 
    function changeFunc() { 

    var selectBox = document.getElementById("selectBox"); 
    var selectedValue = selectBox.options[selectBox.selectedIndex].value.trim(); 
alert(selectedValue); 

var sort_by = function(field, reverse, primer){ 
    var key = function (x) {return primer ? primer(x[field]) : x[field]}; 

    return function (a,b) { 
     var A = key(a), B = key(b); 
     return ((A < B) ? -1 : ((A > B) ? 1 : 0)) * [-1,1][+!!reverse];     
    } 
} 

// Sort by price high to low 
homes.sort(sort_by(selectedValue, true)); 
var u1 = document.getElementById('u1'); 
$(".remove").remove(); 
for (var i=0; i<homes.length; i++) { 
    u1.innerHTML += '<li class="remove">- '+homes[i].price+', '+homes[i].city+'</li>'; 
} 

    } 

    </script> 
</head> 
<body> 
To sort or not to sort, that is the question. 
<h3>By price asc</h3> 
<ul id="u1" style="margin-bottom: 20px;"></ul> 

    <select id="selectBox" onchange="changeFunc();"> 
    <option>Select option</option> 
<option value="h_id">h_id</option> 
<option value="price">price</option> 
<option value="city">city</option> 
    </select> 
</body> 
</html> 

Demo : http://js.do/code/66972

0

Выберите лучшую сортировку Algo, а затем реализовать его собственного

var homes = [ 
    { 
     "h_id": "3", 
     "city": "Dallas", 
     "state": "TX", 
     "zip": "75201", 
     "price": "162500", 
     "createdOn": "2015-08-31 00:35:14" 
    }, { 
     "h_id": "4", 
     "city": "Bevery Hills", 
     "state": "CA", 
     "zip": "90210", 
     "price": "319250", 
     "createdOn": "2015-08-31 14:35:14" 
    }, { 
     "h_id": "5", 
     "city": "New York", 
     "state": "NY", 
     "zip": "00010", 
     "price": "962500", 
     "createdOn": "2015-08-31 13:35:14" 
    } 
]; 

var sortBy = 'price'; //define sortBy field on basis of field selected by use to be sort before calling sorting 
var orderBy = 'asc';// define sorting based on user selected field to sort either asc or dsc 

for (i=0; i<homes.length; i++) { 
    for(j=0; j<homes.length-i-1; j++) { 
    if (orderBy == 'asc') { 
     if (homes[j][sortBy] > homes[j+1][sortBy]) { 
      temp = homes[j]; 
      homes[j] = homes[j+1]; 
      homes[j+1] = temp; 
     } 
    } else { 
     if(homes[j][sortBy] < homes[j+1][sortBy]) { 
      temp = homes[j]; 
      homes[j] = homes[j+1]; 
      homes[j+1] = temp; 
     } 
    } 
    } 
} 
console.log(homes); 

Но помните '100' < '9' will return true из-за строки проверки

Смежные вопросы