मैंने जेएसओएन डेटा से गतिशील रूप से तालिका प्रस्तुत की है और मैं एक चुनिंदा ड्रॉपडाउन के माध्यम से तालिका को वोट और रेटिंग (आरोही/अवरोही) द्वारा क्रमबद्ध करना चाहता हूं लेकिन मुझे यकीन नहीं है कि कैसे ... मैंने कुछ अलग तरीकों की कोशिश की है लेकिन मैं हमेशा असफल रहता हूं .

                <label for="sort">Sort</label><br>
                <select name="sort" id="sort">
                    <option value="0" selected>Order By</option>
                    <option value="1">Votes Ascending</option>
                    <option value="2">Votes Descending</option>
                    <option value="3">Rating Ascending</option>
                    <option value="4">Rating Descending</option>
                </select>

यहां कोड का लिंक दिया गया है: https://jsfiddle.net/natefr0st/zckrwdaf/

0
Kevin Zino 8 नवम्बर 2019, 01:02

2 जवाब

सबसे बढ़िया उत्तर

इसके लिए आपको Array.sort(). किसी भी प्रकार की छँटाई जो आप करना चाहते हैं, उसके तीन मुख्य परिणाम हैं: a > b, a < b, a = b। ये क्रमशः वापसी मूल्यों 1, -1, और 0 के अनुरूप हैं। तो वास्तव में एकमात्र चाल है "a और b क्या हैं?" और यही वह प्रश्न है जिसका उत्तर आपको देना है। वोट है? क्या यह नाम है? क्या यह रेटिंग है? आदि।

यहाँ एक उदाहरण है:

var objs = [
  {name: "Bob", age: 30},
  {name: "Susan", age: 35},
  {name: "Jennifer", age: 22}
];

function sortByName(a, b, sortAsc = true) {
  var val1 = a.name;
  var val2 = b.name;
  let result = ((val1 < val2) ? -1 : ((val1 > val2) ? 1 : 0));
  if (!sortAsc) {
    result *= -1;
  }
  return result;
}
// sort by name (ascending)
console.log(objs.sort((a, b) => sortByName(a, b, true)));
// sort by name (descending)
console.log(objs.sort((a, b) => sortByName(a, b, false)));

function sortByAge(a, b, sortAsc = true) {
  var val1 = a.age;
  var val2 = b.age;
  let result = ((val1 < val2) ? -1 : ((val1 > val2) ? 1 : 0));
  if (!sortAsc) {
    result *= -1;
  }
  return result;
}
// sort by age (ascending)
console.log(objs.sort((a, b) => sortByAge(a, b, true)));
// sort by age (descending)
console.log(objs.sort((a, b) => sortByAge(a, b, false)));

जैसा कि आप देख सकते हैं, उन दो कार्यों (sortByName और sortByAge) के बीच केवल एक चीज अलग है, जिस पर मैंने अपने तुलनात्मक मूल्यों का निर्माण किया है। इसका उपयोग करके, हम एक सामान्य sortByProperty फ़ंक्शन बना सकते हैं जो इन अवधारणाओं का उपयोग करता है।

var objs = [
  {name: "Bob", age: 30},
  {name: "Susan", age: 35},
  {name: "Jennifer", age: 22}
];

function sortByProperty(a, b, property, sortAsc = true) {
  var val1 = a[property];
  var val2 = b[property];
  let result = ((val1 < val2) ? -1 : ((val1 > val2) ? 1 : 0));
  if (!sortAsc) {
    result *= -1;
  }
  return result;
}

function sortByName(items, sortAsc = true) {
  return objs.slice().sort((a, b) => sortByProperty(a, b, "name", sortAsc))
}
// sort by name (ascending) using helper function
console.log(sortByName(objs));
// sort by age (descending) calling sortByProperty directly
console.log(objs.slice().sort((a, b) => sortByProperty(a, b, "age", false)));

वहां से, ऐसा लगता है कि एक बार आपके पास डेटासेट हो जाने के बाद, आप जानते हैं कि इसे तालिका में कैसे लाया जाए और पेजिंग आदि कैसे करें, इसलिए मैं उसमें जाने की जहमत नहीं उठाऊंगा। अगर आपका कोई प्रश्न हैं, तो मुझे से पूछें!

0
mhodges 8 नवम्बर 2019, 01:57

मैंने आपके लिए एक पहेली नमूना जोड़ा और पहले दो सॉर्टिंग विकल्प ("ऑर्डर बाय", "वोट्स एएससी" लागू किए। मुझे लगता है कि आप बाकी सॉर्टिंग विकल्पों को लागू कर सकते हैं :)

https://jsfiddle.net/on863L2m/2/

$('#sort').on('change', function() {
    displayMovies(1, $(this).val())
});


switch(sort) {
   case "0":
    movies = movies.sort(function (a, b) {
            return ((a.id < b.id) ? -1 : ((a.id > b.id) ? 1 : 0));
    });
   break;
   case "1":
    movies = movies.sort(function (a, b) {
            return ((a.imdb_votes < b.imdb_votes) ? -1 : ((a.imdb_votes > b.imdb_votes) ? 1 : 0));
    });
   break;
  }
0
Peter Andersson 8 नवम्बर 2019, 01:38