ajax 게시판 기능 구현 -

먼저 ajax 는 페이지 리 셋 효과 가 없다 는 것 을 이해 합 니 다. 댓 글 은 바로 이런 효과 입 니 다. 댓 글 을 올 릴 때 댓 글 내용 을 아래 에 직접 보 여 줍 니 다.
됐어. 코드 바로 올 려.
1. 컨트롤 러 를 새로 만 듭 니 다. 내용 은 다음 과 같 습 니 다.
 

selData();            //      ,      
        $this->assign('leaveData',$leaveData);    //      
        return $this->fetch('leaveword-form');    //    
    }
    public function leave()    //    
    {
        if($this->request->isAjax())    //     ajax  
        {
            $post = $this->request->post();    //         
            $post['leavetime'] = time();        //             
            $model = model('Leaveword');
            $addRes = $model->doleave($post);    //      
            if($addRes)
            {    //        
                $newdata = $model->selOne();    //        
                $newdata['leavetime'] = date('Y-m-d H:i:s',$newdata['leavetime']);
                $this->success('    ','Index/index',$newdata,0);
            }
            else
            {
                $this->error('    ');
            }
        }
    }
}

 
2. 대응 모델 만 들 기
 

save($post);
    }
    public function selData()    //      
    {
        return $this->order('leavetime desc')->select();
    }
    public function selOne()    //        
    {
        return $this->order('leavetime desc')->find();
    }
}

 
3. 보기 층
주로 일부 스타일 입 니 다. 이것 은 자신 이 좋아 하 는 스타일 을 스스로 조정 할 수 있 습 니 다. (건물 주 는 bootstrop 스타일 을 참조 하 였 습 니 다)
주로 아래 의 ajax 부분 을 보고 삽입 데 이 터 를 교체 하 는 것 이 중점 입 니 다. 아래 에 해당 하 는 설명 이 있 습 니 다.
 

    
    
    
    
    




    

        
  :</td>
    </tr>
    <tr>
        <td>  :<input type="text" name="uname" id="leavename" class="form-control"/></td>
    </tr>
    <tr>
        <td>
            <button type="button" class="btn btn-primary" value="  " id="subleave" style="margin-top: 10px">    </button>
        </td>
    </tr>
</table>

//        
<table class="table table-striped table-hover" style="margin-top: 30px;">
    <thead>
    <tr>
        <th>id</th>
        <th>   </th>
        <th>    </th>
        <th>    </th>
    </tr>
    </thead>
    <tbody id="box">
    <?php foreach($leaveData as $k=?>$v) {?>
    <tr>    //          
        <td><?php echo $v['id']??></td>
        <td><?php echo $v['uname']??></td>
        <td><?php echo $v['leavecontent']??></td>
        <td><?php echo date('Y-m-d H:i:s',$v['leavetime'])??></td>
    </tr>
    <?php }??>
    </tbody>
</table>





//    *    jquery  
<script src="{:url('/')}jquery-min.js"/>
<script>    // *      ,     
    $('#subleave').on('click',function (){
        var leavecontent = $('#leaveword').val();
        var uname = $('#leavename').val();    //      
        $.ajax({    //  ajax  ,  4   ,url,data,type,datatype
            url:"{:url('Index/leave')}",
            data:{leavecontent:leavecontent,uname:uname},
            type:'post',
            dataType:'json',
            success:function(res)    //        
            {        
                if(res.code == 1)    //      
                {    //         
                    var str = '<tr><br>' +
                        '<td>'+res.data.id+'</td><br>' +
                        '<td>'+res.data.uname+'</td><br>' +
                        '<td>'+res.data.leavecontent+'</td><br>' +
                        '<td>'+res.data.leavetime+'</td><br>' +
                        '</tr>';
                    $('#box').prepend(str);    //     
                }
            }
        })
    })
</script></code></pre> 
  <p>4.  ajax       ,                   ~</p> 
 </div> 
</div>
                            </div>
                        </div>