아는 것이 좋은 것이다.

[AJAX] 실시간 더보기 more (asp) 페이징 기능 본문

AJAX

[AJAX] 실시간 더보기 more (asp) 페이징 기능

start0 2014. 4. 30. 16:37
<!-- list.asp 리스트 페이지 -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function()
{
$('.more').live("click",function()
{
var ID = $(this).attr("id");
if(ID)
{
$("#more"+ID).html('<img src="http://demos.9lessons.info/moreajax.gif" />');

$.ajax({
type: "POST",
url: "table_ajax.asp",
data: "lastmsg="+ ID,
cache: false,
success: function(html){
$("tbody#updates").append(html);
$("#more"+ID).remove(); // removing old more button
}
});
}
else
{
$(".morebox").html('The End');// no results
}

return false;
});
});
</script>
<style type="text/css">
     *{ margin:0px; padding:0px }
tr.timeline
{
list-style:none
}
tr.timeline td,th
{
position:relative;
border-bottom:1px #dedede dashed;
padding:8px;
}
.morebox
{
font-weight:bold;
color:#333333;
text-align:center;
border:solid 1px #333333;
padding:8px;
margin-top:8px;
margin-bottom:8px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}
.morebox a{ color:#333333; text-decoration:none}
.morebox a:hover{ color:#333333; text-decoration:none}
#container{margin-left:60px; width:580px }
</style>

<table>
  <thead>
    <tr>
      <th>IDX</th>
      <th>상품명</th>
    </tr>
  </thead>
  <tbody id="updates">
<%

sql="select top 3 idx, name from table"
Set rs = dbssaka.execute(sql)
If Not(rs.bof Or rs.eof) Then
Do Until rs.eof
%>
    <tr class="timeline">
      <th><%=rs("idx")%></th>
      <td><%=rs("name")%></td>
    </tr>
<%
rs.Movenext
loop
End If
rs.close
Set rs = nothing
%>
     <tr>
          <td colspan="2">
          <div id="more<%=rs("idx")%>" class="morebox">
          <a href="#" class="more" id="<%=rs("idx")%>">more</a>
          </div>
          </td>
     </tr>
  </tbody>
</table>




<!-- ajax_table.asp 더보기 클릭시 불러오는 페이지-->
<%
response.Charset = "euc-kr"

lastmsg=request("lastmsg")

sql = "select top 10 item_name, item_serial from item where idx< '" & lastmsg & "' order by idx desc"
Set  rs = dbssaka.execute(sql)

If Not(rs.bof Or rs.eof) then
Do Until rs.eof
item_serial = rs("item_serial")
item_name = rs("item_name")
%>
    <tr class="timeline">
      <th><%=item_serial%></th>
      <td><%=item_name%></td>
    </tr>
<%
rs.Movenext
loop
End If
rs.close
Set rs = nothing
%>
     <tr>
          <td colspan="5">
               <div id="more<%=item_serial%>" class="morebox">
               <a href="#" id="<%=item_serial%>" class="more">more</a>
               </div>
          </td>
     </tr>


Comments