jquery 인라인 편집시 날짜 표시기를 표시합니다.

Question

테이블에서 인라인 편집을하고 있고 사용자가 내부를 클릭하면 날짜 표시기를 표시해야하는 셀 중 하나와 발급자가 있습니다. 셀을 클릭하면 편집 텍스트 상자가 displax이지만 텍스트 상자를 클릭하면 datepicker가 나타나지 않습니다. 당신의 도움을 주셔서 감사합니다. 건배

$('.editable').live({ 
      hover: function() { 
       //alert('Am hovering'); 
       //change background of an editable element if mouse hover 
       $(this).toggleClass('over-inline'); 
      }, 
      click: function (e) { 
      //start inline editing 
       var $editable = $(this); 

       if ($editable.hasClass('active-inline')) { 
        return; 
       } 
       var contents = $.trim($editable.html()); 
       initialValue = contents; 
       var itemID = $editable.attr('id'); 
       var editID = 0; 
       var s = ''; 
       $editable 
        .addClass('active-inline') 
        .empty(); 

        //define the edit element 
        var editElement = '<input type="text" class="showDatePicker" />'; 
        displayDatePicker('.showDatePicker'); 
        $(editElement) 
        .val(initialValue) 
        .appendTo($editable) 
        .focus(); 
        //addEditButtons($editable); function that add save/delete/cancel buttons 
     } 



     function displayDatePicker(selector) { 

      $(selector).datepicker({ 
       showOn: "both", 
       buttonImage: "images/calendar.gif", 
       buttonImageOnly: true, 
       changeMonth: true, 
       changeYear: true 
      }); 
      $(selector).datepicker("option", "dateFormat", 'dd.mm.yy'); 
     } 

Answer 1

나는 당신이 일을 수행하는 순서 변경하여 시작, 위의 설명에서 말했듯이 :

• 새로 만든 텍스트 상자를 추가를;
• hasDatepicker 클래스를 요소에 추가하는 함수를 호출하십시오. 그것은 다음과 같습니다 있도록

또한 텍스트 상자의 클래스를 변경 :

var editElement = '<input type="text" class="Datepicker" >'; 

그런 다음 함수를 이런 식으로 호출