Computer Science/Web

Web] Select 태그를 이용해 정렬하기

TwinParadox 2017. 2. 25. 00:00
728x90

Web] Select 태그를 이용해 정렬하기




필자가 텀 프로젝트를 하면서,

구매 내역 조회야 DB에 쿼리문 하나만 날리면 조회가 쉽게 이루어지지만,

평가 기준에 별도의 기능이 추가되어 있어야 했고,

당시 필자의 뇌리에 스쳤던 것은 구매 내역을 정렬하는 기능이었다.


인터넷에 있는 오픈 마켓에서 자기가 구매했던 내역을 특정일을 기준으로,

혹은 특정 기간을 기준으로 정렬하는 것을 구현하는 기능을 흔하게 볼 수 있다.

필자는 조회일을 기준으로 최근 1개월, 3개월, 6개월 기준으로 구매 내역을 조회하는 기능을 만들어보려고 했다.


소스와 이런 부분에 대해서 이야기를 나누기 전에 하나 짚고 넘어가야 할 점은,

필자는 이전에 PHP를 해본 적도 없고, PHP의 버전이 어디쯤 왔는지까지 정확히 알지 못했다.

(지금도 자세히는 모른다. 하지만, 이걸 직접 했던 필자도 아쉽긴 마찬가지였다.)


어쨌든, 필자 역시 모든 걸 아는 학생이라서 학교에서 가르쳐주는 문법을 바탕을 작성을 했고,

그런 이유로 아래 소스가 비효율적이거나 현재는 사장된 방법으로 작성되어 있을 수 있음을 먼저 알리는 바이다...




항상 느끼는 것이지만, 적절한 데이터 삽입이 중요한 것 같다.

물론, 기능을 구현하는 것이 가장 중점적으로 다루어져야 겠지만,

구현한 기능에 버그가 없는지 확인하기 위해서

버그를 발생시킬만한 의도적인 데이터 삽입도 필요해 보인다.


디자인이 자질구레한 건 좀 이해해달라...





최근 3개월 이내로 조회한 결과 16년 7월과 10월 데이터는 조회되지 않는다.



1
2
3
4
5
6
7
8
9
10
11
12
13
<center><table width=880 border=0 style='margin-top:100px;'>
<tr><td align=center><b>구매내역</b></td></tr>
<tr><td>* 주문 물품이 배송 이전 단계이면 온라인으로 주문 취소가 가능합니다.</td></tr>
<tr><td>* 배송중이거나 구매 완료된 제품에 대한 반품 및 환불 요청은 당사 고객센터(전화 : 070-1234-5678)로 문의바랍니다.</td></tr>
<tr><form name=pfrm><td><input type=hidden value='$period' name=per>날짜 조회 : &nbsp;
<select name=period onchange='selectOpt(this.options[this.selectedIndex].value);'>
<option value=-1>선택</option>
<option value=0>전체</option>
<option value=1>최근 1개월</option>
<option value=3>최근 3개월</option>
<option value=6>최근 6개월</option></select>
</td></form></tr>
</table>
cs



조회되는 데이터를 출력하는 건 php에서 진행하고 있기도 하고,

해당 페이지 전체를 올리기에는 소스 내용이 너무 길어서

여기서 다룰 select 태그를 이용한 정렬에 집중할 부분만 소스를 올린다.


이렇게 option 태그 별로 별도의 value를 지정해뒀고,

select 태그에서 변화가 있을 때마다 해당 옵션에 대한 value값을

자바스크립트 함수로 넘겨 페이지 교체가 일어난다.


1
2
3
4
function selectOpt(a)
{
    location.replace("./check.php?period="+a);
}
cs



1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
if($period=="0" || $period=="-1" || $period=="") {
    $period=0;
    $result=mysql_query("select * from receivers where userID='$UserID' order by date desc",$con);
    $total=mysql_num_rows($result);
}
else {
    $current_date = date("Y-m-d H:i:s");
    list($year,$month,$day,$hour,$minute,$second= split("[- :]",$current_date);
    $before=date("Y-m-d H:i:s"mktime($hour$minute$second$month-$period$day$year ));
    $result=mysql_query("select * from receivers where userID='$UserID' and date > '$before' order by date desc",$con);
    $total=mysql_num_rows($result);
}
?>
cs



period라는 변수로 넘겨 받은 값들을 토대로,

각 상황에 맞는 쿼리를 날려 데이터를 불러온다.

상기 소스에서 list()함수를 사용해서 현재 시각에 대한 정보를

연도, 월, 일, 시, 분, 초로 나누는 작업을 시행한 뒤

mktime()을 이용해서 이전 날짜를 구해 이를 바탕으로 데이터를 조회하도록 했다.

728x90
728x90

'Computer Science > Web' 카테고리의 다른 글

Web] 마우스 온/오버 시, 투명도 바꾸기  (0) 2017.03.04
HTML] 회원가입 폼  (1) 2017.03.01
API] 다음 우편번호 API 사용하기  (0) 2017.02.06
Javascript] BOM(Browser Object Model)  (0) 2017.01.21
Javascript] 함수  (0) 2017.01.21