diff options
author | benal01 <bja4245@rit.edu> | 2025-03-27 08:50:12 -0400 |
---|---|---|
committer | benal01 <bja4245@rit.edu> | 2025-03-27 08:50:12 -0400 |
commit | 057efa1b557d5d874300c6cda8c7d74519c946d6 (patch) | |
tree | cb5cfd5d3ef520a80adee635ea38ce9722afebc4 /ufund-ui/src/app/components/need-list/need-list.component.html | |
parent | f7a5b01d15493e86a35598b6396621823bc0242f (diff) | |
download | JellySolutions-057efa1b557d5d874300c6cda8c7d74519c946d6.tar.gz JellySolutions-057efa1b557d5d874300c6cda8c7d74519c946d6.tar.bz2 JellySolutions-057efa1b557d5d874300c6cda8c7d74519c946d6.zip |
use <selection> instead of table with *ngFor for sort algorithms
Diffstat (limited to '')
-rw-r--r-- | ufund-ui/src/app/components/need-list/need-list.component.html | 15 |
1 files changed, 6 insertions, 9 deletions
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html index de4be58..9799493 100644 --- a/ufund-ui/src/app/components/need-list/need-list.component.html +++ b/ufund-ui/src/app/components/need-list/need-list.component.html @@ -1,14 +1,11 @@ <h1>Needs List</h1> <div id="search-container"> - <div style="display: flex;"> - <h3>Sort by:</h3> - <table style="margin-left: 10px; display: flex; column-gap: 24px;"> - <tr><h3><button (click)="changeSortAlgo('sortByName',searchForm.value)">Name(A-Z)</button></h3></tr> - <tr><h3><button (click)="changeSortAlgo('sortByNameReverse',searchForm.value)">Name(Z-A)</button></h3></tr> - <tr><h3><button (click)="changeSortAlgo('sortByMaxGoal',searchForm.value)">Max Goal(Descending)</button></h3></tr> - <tr><h3><button (click)="changeSortAlgo('sortByMinGoal',searchForm.value)">Max Goal(Ascending)</button></h3></tr> - </table> - </div> + <label for="sort">Sort by:</label> + <select [(ngModel)]="sortSelection" id="sort" (change)="changeSortAlgo(sortSelection, searchForm.value)"> + <option *ngFor="let algorithm of SortingAlgoArrays" value="{{algorithm.name}}"> + {{algorithm.name}} + </option> + </select> <form id="search-form" #searchForm="ngForm"> <input type="text" name="search" placeholder="Search in {{needs.length}} needs..." (input)="search(searchForm.value)" ngModel> <input type="reset" value="Clear" (click)="search(null)"> <br> |