JSon 기반 Ajax 페이지 새로 고침 효과 없 음 (2)

5343 단어 Ajax
이전 편 에 서 는 jquery 의 ajax 방식 으로 페이지 를 읽 고 페이지 에 표 시 됩 니 다.이 편 은 제 이 슨 을 이용 하여 데 이 터 를 읽 고 페이지 기 와 연결 하여 새로 고침 되 지 않 은 페이지 효 과 를 실현 하도록 하 겠 습 니 다.
이전 페이지 에 쓴 js 에 BindCommentList (1) 가 있 습 니 다. / /페이지 로 딩 기본 바 인 딩 첫 페이지 데이터 방법.매개 변 수 는 현재 페이지 입 니 다.페이지 에서 처음으로 기본 값 1 을 불 러 옵 니 다. 즉, 첫 페이지 의 데 이 터 를 불 러 옵 니 다.
그리고 페이지 분할 기 에서 a 탭 을 클릭 할 때 BindCommentList js 이벤트 가 발생 합 니 다.매개 변 수 는 클릭 한 a 탭 의 속성 title 에서 값 을 추출 하여 페이지 번 호 를 표시 합 니 다. BindCommentList 이벤트 코드 는 다음 과 같 습 니 다.
 //         

        function BindCommentList(page) {

            $.post("/Ajax/Elec_Comment/GetData.aspx", { pid: '<%=DotNet.Framework.Common.QueryString.QId("id") %>', page: page },

                function(data) {

                    var Comments = $.parseJSON(data);

                    $("#divCommentList").empty();

                    for (var i = 0; i < Comments.length; i++) {

                        var comment = Comments[i];

                        var span = "<span class=\"hsk\"><span>" + comment.id + comment.NickName + "</span><span>  " + comment.CommentIP + "</span> <span>" + comment.CommentDate + "</span></span><span class=\"pl_text\">" + comment.CommentBody + "</span>"

                        $("#divCommentList").append(span);

                    }

                }

            );

        }

 
ajax 요청 페이지 가 / Ajax / Elec 인 것 을 볼 수 있 습 니 다.Comment / GetData. aspx, 2 개의 인 자 를 전 달 했 습 니 다. pid 는 해당 하 는 제품 ID 입 니 다.첫 페이지 에 page = 1 을 불 러 옵 니 다. 페이지 번 호 를 누 르 면 전 달 된 page 값 은 a 탭 의 title 속성 에서 읽 습 니 다.구체 적 으로 어떻게 실현 할 것 인 가 는 이전 문장 을 참고 하 시기 바 랍 니 다.  전송 문  
jquery 의 post 방법 은 위의 코드 와 같은 요청 결 과 를 되 돌려 줍 니 다.  data. 이 data 는 json 형식의 데 이 터 를 되 돌려 줍 니 다.그 는 List < T > 범 형 집합 이다.
$("#divCommentList").empty();  댓 글 목록 을 비 운 div 의 내용 입 니 다.그리고 결 과 를 되 돌려 줍 니 다.json 을 이용 하여 데 이 터 를 되 돌려 분석 하고 html 로 연결 합 니 다.  마지막 으로 divCommentList div 에 다시 추가...
다음은 ajax 방법 요청 페이지 를 보 겠 습 니 다.  /Ajax/Elec_Comment/GetData.aspx  검색 한 목록 을 json 대상 으로 정렬 하 는 방법  코드 는 다음 과 같 습 니 다:
public partial class GetData : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            int page = DotNet.Framework.Common.QueryString.StrToId(DotNet.Framework.Common.QueryString.F("page"));

            int pid = DotNet.Framework.Common.QueryString.StrToId(DotNet.Framework.Common.QueryString.F("pid"));

            GSSS.HTML.BLL.PromotionZone.ElectronicProducts.T_ElectronicProducts_Comment bll = new GSSS.HTML.BLL.PromotionZone.ElectronicProducts.T_ElectronicProducts_Comment();

            if (page == 0)

            {

                page = 1;

            }

            DataSet data = bll.GetPageData(page, pid);

            List<commm> list = new List<commm>();

            if (data == null || data.Tables.Count == 0 || data.Tables[0].Rows.Count == 0)

            {

                Response.Write("    ");

                Response.End();

            }

            commm model = null;

            foreach (DataRow row in data.Tables[0].Rows)

            {

                model = new commm()

                {

                    CommentBody = row["CommentBody"].ToString(),

                    CommentIP = row["CommentIP"].ToString(),

                    CommentDate = row["CommentDate"].ToString(),

                    CommentRate = row["CommentRate"].ToString(),

                    Email = row["Email"].ToString(),

                    id = row["id"].ToString(),



                    NickName = row["NickName"].ToString(),

                    ProdictID = row["ProdictID"].ToString(),



                };



                list.Add(model);

            }

            JavaScriptSerializer jss = new JavaScriptSerializer();

            Response.Write(jss.Serialize(list));

            Response.End();

        }

    }

    public class commm

    {

        public string CommentBody { get; set; }

        public string CommentIP { get; set; }

        public string CommentDate { get; set; }

        public string CommentRate { get; set; }

        public string Email { get; set; }

        public string id { get; set; }

        public string NickName { get; set; }

        public string ProdictID { get; set; }

    }

댓 글 에 댓 글 시간 필드 가 있 습 니 다.그 는 DataTime 형식 으로 처음에는 데이터베이스 에서 DataTable 을 직접 읽 어 JSon 대상 으로 정렬 하여 되 돌려 주 려 고 했 으 나 변환 할 수 없 음 을 발견 하고 List < T > 범 형 으로 바 꾸 었 다.돌아 와 서 서열 화 된 이유 로DataTime 형식의 데 이 터 를 어떻게 해석 해 야 할 지 모 르 겠 습 니 다. 차라리 문자열 형식 으로 돌아 가 겠 습 니 다.그래서 새로운 종류의 commm 를 만 들 었 습 니 다. 클래스 결과 와 제품 평론 실체 류 의 결 과 는 차이 가 많 지 않 고 페이지 에 사용 할 수 없 는 데 이 터 를 생략 했 습 니 다.
추출 한 DataTable 데 이 터 는 List 집합 에 옮 겨 다 니 며 추가 되 었 습 니 다.그리고 List 집합 을 JSon 대상 으로 정렬 하여 클 라 이언 트 에 게 되 돌려 줍 니 다. 코드 는 다음 과 같 습 니 다.
여기 있 습 니 다.페이지 를 새로 고침 하지 않 는 효과 가 실 현 됩 니 다. 저희 가 하고 있 는 프로젝트 이기 때문에 Demo 를 제공 할 수 없습니다. 양해 해 주 십시오. 고수 여러분 께 서 더 좋 은 건의 가 있 으 면 댓 글 을 제출 해 주 십시오. 감사 하기 그 지 없습니다!!

좋은 웹페이지 즐겨찾기