DataTables : 편집 가능한 셀의 모양 변경

누군가 편집 가능한 셀을 "표시"하도록 도와 줄 수 있습니까? 지금은 단순한 텍스트처럼 보이고 시각적으로 제안 할만한 것은 없습니다. 편집 할 수 있습니다 ... 표준 텍스트 필드처럼 보이게하고 싶습니다.DataTables : 편집 가능한 셀의 모양 변경

출처

2012-12-10 Michal S

에서 값을 편집 할 수있는 텍스트 상자에 표시됩니다이 작동합니다 :

var oTable = $('#example').dataTable({ 
    "bServerSide": true, 
    "sAjaxSource": "/url/", 
    "fnDrawCallback": function() { 
     $('#example tbody td').editable('url', { // simple editable initialization 
      "height": "14px", 
     }); 

     $('#example tbody tr').each(function() { 
      $.each(this.cells, function(){ 
       $(this).click() //by default all td's have bind for click function, so we simulate clicks for every td 
      }); 
     }); 

     $('#example tbody td input').live('click', function(){ 
      $(this).select() // to select input 
     }) 
    } 
}); 
    $.editable.types.defaults.reset = function(){ //this function disables reset input editing after submiting 

    }

UPDATE :

나는 여기에 시험 샘플을 만들었다. http://jsfiddle.net/94BZV/31/

editable의 init에 올바른 url을 넣어 편집 필드로 다시 전달 된 정답을 얻는 것을 잊지 마십시오.

출처

2012-12-10 16:00:27 Smiter

고마워, 확실히 나아 졌어.하지만 텍스트 상자를 클릭하고 다른 곳을 클릭 한 후에 만 "텍스트 영역"이된다. 페이지가로드 될 때 일반 텍스트처럼 보이고 필드로 값을 입력하면, 그것도 다시 "텍스트 전용"이됩니다 ... –

내 대답 코드에서 마지막 3 줄을 붙여 넣었습니까? 그들은 트릭을하고있다. 내부에 구현하지 않고 붙여 넣기 만하면됩니다. – Smiter

예 샘플에 따라 정확하게 붙여 넣었습니다. 코드에 올바르게 배치되어 있는지 확인했는데 그렇게 보입니다. 그러나 쓴 것처럼 작동합니다 :/먼저 텍스트 영역과 같이 표시 될 수 있도록 클릭해야합니다. . –

ASP.net에서 무엇을 원하십니까? 그렇다면 텍스트가 GridView에 있으면 EDITINDEX 값을 목록의 rowindex 값으로 설정해야합니다. 예를 들어 EDITINDEX 값이 -1이면 정적 모드이고 모든 것이 레이블에 표시되므로 변경해야합니다. 보다 큼에 그 값> -1 그런 다음 컨트롤이 그럼 당신은 컨트롤 "

출처

2012-12-10 14:06:14

죄송합니다. 내 마음에 이런 식으로 지정해야합니다. :) PHP/JS의 웹 응용 프로그램을 원합니다. –

DataTables : 편집 가능한 셀의 모양 변경

답변

관련 문제