현재 게시글을 불러오는거 까지는 만들었는데 다음 이전버튼을만들어서 추가적으로 더 게시글을 보여주는걸 만들고 싶습니다.

 

한번에 9개의 글을 읽어와서 3개만보여주고 6개는 감춰진상태에서 다음 이전버튼으로 불러오는걸 만들고 싶은데 좋은방법좀 알려주시면 감사합니다.

 

위젯은 이런식으로 만들었습니다.

<!--@foreach($tab_list as $key => $val)-->
       <div class="test">
        <!--@foreach($val->document_list as $k => $v)-->
        <ul class="box">
            <li class="test1">
                <!--@if(!$_thumbnail_checked && $v->thumbnailExists($widget_info->thumbnail_width, $widget_info->thumbnail_height))-->
                    <td width="130px" height="100px">
                        <a href="{getSiteUrl($val->domain,'','document_srl',$v->document_srl)}"><img src="{$v->getThumbnail($widget_info->thumbnail_width,$widget_info->thumbnail_height,$widget_info->thumbnail_type)}" border="0" alt="" /></a>
                    </td>
                    {@ $_thumbnail_checked = true; }
                <!--@else-->
                <td width="130px" height="100px">
                    <a href="{getSiteUrl($val->domain,'','document_srl',$v->document_srl)}"><img src="/images/100100.png"/></a>
                </td>
                </li>
                <!--@end-->
            <li class="test2">
                <td>
                    <div class="title">
                    <span class="title">
                    <a href="{$v->getPermanentUrl()}#{$v->getCommentCount()}">{$v->getTitle($widget_info->subject_cut_size)}</a></span>
                    <span class="author"> - {$v->getNickName()}</span>
                    <span class="icon">{$v->printExtraImages($widget_info->duration_new)}</span>         
                    </div>
                    </td>
                {@ $_thumbnail_checked = true; }
            </li>
            <li class="test3">
            내용불러올자리
            </li>
        </ul>
                      <!--@end-->
    </div>

    <!--@end-->

 

 

  • ?
    <div class="test" loop="$tab_list=>$key,$val">
        <ul class="box" loop="$val->document_list=>$k,$v">

     

    <!--@foreach를 고집할 이유가 없다면 상단을 이렇게 바꾸는게 더 보기 좋을 것 같고,

    아마 $val->document_list에는 widget에서 이미 3개씩 설정한걸 가져오고 있는 것이라 사료되는데

     

    [ < ] [ > ]버튼을 하단에 만들고 

    (jQuery)(function($)
    {
        var page=0;
        $('<버튼클래스').click(function()
        {
            page--;
            if(page < 0) page = 0;
            $('[data-page]').hide();
            $('[data-page=' + page + ']').show();
        });
        $('>버튼클래스').click(function()
        {
            page++;
            if(page > 2) page = 2;
            $('[data-page]').hide();
            $('[data-page=' + page + ']').show();
        });
    });

     

    같은 방법으로 구현할 수 있을 것 같네요. 3개씩 불러온 element엔 $key?를 이용해 data-page="{$key}"식으로 페이지 넘버를 붙여주시면 될 듯 합니다.

     

    나머지 숨겨주시는건 잊지 마시고...:3

  • ? profile

    하단에

    <script>
    jQuery(function($)
    {
        var page=0;
        $('prev').click(function()
        {
            page--;
            if(page < 0) page = 0;
            $('[data-page]').hide();
            $('[data-page=' + page + ']').show();
        });
        $('next').click(function()
        {
            page++;
            if(page > 2) page = 2;
            $('[data-page]').hide();
            $('[data-page=' + page + ']').show();
        });
    });
    </script>

    넣었으나 반응이없습니다. ㅜ

  • profile ?

    $('.prev') 가 아닐까요 헛... <element class="prev" 신것 같은데

     

    여러개 추가하려면 클래스명에 id지정을 넣어줘야 다른 위젯들에 영향을 안 줄거에요. 기억상 위젯에 xe가 id를 붙여주던데

    참고해서 조금 더 수정하셔야 정상적으로 쓰실 수 있을 듯

     

    <element onclick="next(this);">

     

    function next(elem)

    {

        ...

        $(elem).parent().find("[data-page]").hide();

        $(elem).parent().find("[data-page='" + page + "']").show();

        ...

    }

    식으로 작업하셔야 할 것 같습니다 후다닥 코드 보고 옴 ㅠㅠ

  • ? profile
    자바스크립트가 아직부족해서 이해하는데 오래걸렸습니다 ㅜ.ㅜ