jQuery를 사용하여 편집을 제자리에 작성하고 바로 아래 편집 할 수있는 새 div를 사용할 수 있습니다.

Question

나는 새롭다 jQuery 그리고 클릭하고 텍스트를 입력하고, 텍스트를 입력하고, 저장하고, 즉시 다른 div가 동일한 기능을 입력 할 수있는 다른 div가 동적으로 팝업 할 수 있는지에 대한 편집을 할 수 있는지 알고 싶습니다. 그리고 저장하십시오. 누군가 아이디어가 있다면 대단히 감사 할 것입니다.

    $(document).ready(function() {
        $('.edit_area').editable(function(value, settings) {
            return (value);
        }, {
            type: 'textarea',
            onblur: 'submit',
            indicator: 'Saving...',
            callback: function(value, settings) {
                var thisData = $(value);

                $.post('<%=Url.Action("SetPostieNotes", "Posties") %>',
                'postieNotes=' + escape(thisData)
                );
                var divTag = document.createElement("div");
                divTag.id = "div";
                divTag.setAttribute("align", "center");
                divTag.className = "edit_area";
                divTag.innerHTML = "Test Dynamic Div.";
                document.body.appendChild(divTag);
            }
        });
    });

Answer 1

사용 제시 가능 장소 편집 기능을 위해서는 콜백 함수를 사용하여 기존 DIV 아래에서 새 DIV를 생성합니다.

---

당신은 실제로 Jeditable이 제공하는 모든 것을 사용하는 것이 아닙니다. 이와 같은 것을 시도하십시오 (지금 당장 테스트 할 수는 없지만 아이디어를 줄 것입니다).

$(function() {
    $('.edit_area').editable('<%=Url.Action("SetPostieNotes", "Posties") %>', {
        callback: function(v, settings) {
            var new_div = $('<div />')
                          .addClass('edit_area')
                          .editable('<%=Url.Action("SetPostieNotes", "Posties") %>', settings);

            $(this).after(new_div);
        }
    });
});

그게 전부가되어야합니다. 당신은 자신을 제출할 필요가 없습니다. 그것은 Jeditable의 것입니다. 저장하려는 URL을 첫 번째 매개 변수로, 두 번째 매개 변수로 설정하십시오.

Answer 2

실제로 Jeditable을 사용하여 시작했고 Tectual의 editables () 플러그인으로 이동하여 여기에 사용중인 코드입니다. https://github.com/relipse/jquery-editable/blob/master/jquery.edabil.js