2013-06-14 1 views
0

다음과 같이 colorbox에 텍스트 영역을 배치하여 보고서 제목을 변경하려면 colorbox가있는 모달 창을 만들려고합니다.이전 값을 유지하는 색상 상자 요소

<a class="change-report-title" href="#edit-box">Change Title</a> 

JQuery와 :

$(".change-report-title").colorbox({ 
    inline:true, 
    width:"400px", 
    onOpen:function(){ 
     var current_title = $("#report-title").html(); 
     $("#title-box-text").html(current_title); 
    } 
}); 

HTML : 나는 colorbox를로드하고 잘 작동 할 때 이제 제목을 업데이트하려고 보고서 제목을 얻기 위해 노력

<div style="display:none"> 
     <div id="edit-box"> 
     Edit Report Title<br /> 
     <textarea id="title-box-text" name="title-box-text" cols="38" rows="5"></textarea> 
     <br /> 
     <input id="title-box-change" name="title-box-change" type="button" value="Update" /> 
     </div> 
    </div> 

텍스트 영역의 편집 된 값으로, 텍스트 영역은 최초 값을 계속 반환합니다.

$("#title-box-change").click(function (e) { 
    var new_title = $("#title-box-text").html(); 
    $("#report-title").html(new_title); 
    return false; 
}); 

제가 제대로 이해하지 못하는 것이 있습니다. 저는 인터넷 검색을하고 stackoverflow를 검색했습니다. 어떤 아이디어라도 감사 할 것입니다. 감사.

+1

는'.change-보고서 - title' 요소가 존재 하는가 코드의 첫 번째 부분에 대한

? 질문에 정의를 추가하십시오. –

+0

정의가 추가되었습니다 :'.change-report-title' 요소는 colorbox를 호출하는 데 사용되는 링크입니다. –

답변

1

html() 대신 val() 함수를 사용하십시오. 또한 텍스트를 가져 오거나 설정해야하는 경우 html() 대신 text() 메서드를 사용하는 것이 좋습니다 (HTML 마크 업이 아님). 클릭 이벤트에 대한

var current_title = $("#report-title").text(); 
             ^^^^^^^ 
$("#title-box-text").val(current_title); 
        ^^^^ 

:

$("#title-box-change").click(function (e) { 
    var new_title = $("#title-box-text").val(); 
             ^^^^^^^^^ 
    $("#report-title").text(new_title); 
         ^^^^^ 
    return false; 
});