Скользящий «Редактировать окно» для портлета jquery

Question

Я использую портлеты jquery в своем веб-приложении. http://jqueryui.com/demos/sortable/#portlets

Что я хочу сделать, так это сделать окно редактирования между заголовком портлета и содержимым портлета, как только пользователь нажимает на значок «Настройки», который присутствует на каждом заголовке портлета. Я могу добиться этого, имея отдельный редактор для каждого отдельного портлета. Но мой вопрос заключается в том, как я могу достичь этого, когда у меня есть общий «Редактирование-Коробка», который разделяется между всеми портлетами, присутствующими на моей веб-странице. Как сделать это поле редактирования между элементом «Заголовок заголовка » после того, как пользователь нажмет на значок «Настройки» этого конкретного портлета?

Answer 1

Вы можете создать окно редактирования «на лету», я имею в виду, когда вы нажимаете кнопку настройки. Теперь, после того как вы отредактировали текстовое поле и применили настройки, вы можете просто удалить окно редактирования.

$(".settings").click(function() { 
$("<input/>").attr("class", "editbox") 
    .attr("value", "") 
    .appendTo($("yourPortletSelector")); 

});

$(".applySettings").click(function { 
    //do all your work 
    $(".editbox").remove(); 
});