관리 메뉴

도드넷

JAVASCRIPT#56 - trim 메소드 detail.js 실전예제 파트5 본문

창고/JS KING 포니 [중단]

JAVASCRIPT#56 - trim 메소드 detail.js 실전예제 파트5

도드! 2016. 6. 27. 12:27
반응형



I wish we could meet someday. and i wish you could love me for just who i am.


JAVASCRIPT#56 - trim 메소드 detail.js 실전예제 파트5


이제 상품(아이템) 세부정보를 표시하는 detail.js 를 구성할 차례.


$(function() {$("#MYTAB").tabs();});

var Detail = {
    "categoryID" : null,
    "itemID" : null,
    "categoryName" : null
};


$(document).ready(function(){
    Detail.categoryID = Util.getQueryStringParams("categoryID");
    Detail.itemID = Util.getQueryStringParams("itemID");

    DataMgr.loadCategoryName(Detail.categoryID, completeCategoryName);
});

var completeCategoryName = function(data)
{
    Detail.categoryName = data;
    DataMgr.loadItem(Detail.categoryID, Detail.itemID, completeItem);
}

var completeItem = function(item)
{
    $("#categoryName").text("Category : " + Detail.categoryName + ", Item : " + item.title);
   
    $("#tabs-1").text(item.info);
   
    $("<lable>Add Review : </lable>").appendTo("#tabs-2");
    $("<input id='reviewAdd'></input>").appendTo("#tabs-2");
    $("<br>").appendTo("#tabs-2");
    $("<br>").appendTo("#tabs-2");
    $("<ul id='review'></ul>").appendTo("#tabs-2");
    for(var i=0; i<item.reviews.length; i++)
    {
        $("<li></li>").appendTo("#review").text(item.reviews[i]);
    }

    $("#tabs-3").text(item.QnA);

    $("#reviewAdd").keyup(function(event){
        if(event.which == 13 && $(this).val().trim() != "")
        {
            alert("Review Added!");
            $("<li></li>").appendTo("#review").text($(this).val());
            $(this).val("");
        }
    });
}


특별히 살펴볼건 없는듯?


전에 만들어놨던 Util로 URL에서 ID값 가져오고 그걸 바탕으로 DataMgr 에 요청해서 데이터 가져오고

appendTo 하고 text 메소드로 내용 변경함.


여기에 jQuery UI Tabs 기능 이용함.

 

새로운 자바스크립트 메소드로는 trim 메소드가 있는데 이건 맨앞과 맨뒤 공백 지우는것.


예를들어 "    애플잭 사랑해        " 라는 스트링을 trim 하면 그냥 "애플잭 사랑해"가 됨. ♡



myproject 페이즈3.zip









반응형
Comments