Apologies if this response no longer aligns with your current query after deleting your previous question and posting a new one. This was the response I intended to send before your question was removed:
Allow me to recap your situation to ensure I have grasped it accurately:
You have a Model, perhaps named Player, representing a player with attributes such as name, team, points, and assists. There exists a collection of these Players within the referenced View. This particular View displays information about players, highlighting those with the most points and assists.
While making some assumptions about your requirements, let's imagine you wish to exhibit a list of players alongside additional details for the highlighted individuals. You can view my approach in this JSFiddle link that I have prepared.
A general principle is to avoid setting data directly in the DOM unless absolutely necessary, which is why JavaScript comes into play. Since your View contains a Collection, it should be responsible for managing references to the top points scorer and assists leader. Utilizing the "max" functions, you could implement it as follows:
getMaxPointsPlayer: function () {
return this.getMax("points");
},
getMaxAssistsPlayer: function () {
return this.getMax("assists");
},
getMax : function (attribute) {
return this.collection.max(function (player) {
return player.get("team") === this.homeTeam || player.get("team") === this.awayTeam ? player.get(attribute) : 0;
}, this);
},
Note two important points:
- Prefer using
=== over == whenever feasible. Please refer to resources on this site for further clarification.
- In absence of clarity regarding the whereabouts and nature of the variables "home" and "away" in your code, I have defined them as member variables within the view (simply strings).
Thus, when referencing the player with the most points or assists, you can invoke one of these functions embedded within the View. Subsequently, store the output in a variable for easy access or employ it immediately upon invoking the respective function.
By examining the provided code snippet in the JSFiddle, you may notice additional features beyond your initial inquiry. This demonstration aims to showcase an optimal method for maintaining a clean and organized application structure (though solely within JSFiddle). Strive to allocate distinct responsibilities to your Views, whether presenting and manipulating a Model, overseeing a list of sub-views contained within a Collection, or coordinating various sub-views. Consequently, each view possesses the necessary logic without getting entangled with DOM manipulation.