Возвращение диалогового окна jQuery обратно в исходное состояние при закрытии/сохранении и т. Д.

Question

В настоящее время я работаю над функцией JQuery Dialog, где открытый метод вызывается встроенной функцией onclick Javascript, например.

<a href="#" onclick="showDialog(this); return false;">Click Me</a> 

function showDialog(entity) { 

//Set up some variables 
var id = $(entity).attr('id); 

//Create some Html form elements to go in the Dialog window 
var html = "<input type='text' name='name' id='' />" + 
    "<input type='hidden' name='id' id='id' value=' + id + ' />"; 

//Set the dialog HTML and trigger the dialog open method 

} 

Это прекрасно работает, когда я вносить изменения в содержание диалога, например, скрывая поля, изменение контента через Ajax звонков и т.д., и попытка открыть диалоговое окно, после закрытия другого, изменения по-прежнему настоящее время.

Я думал об использовании функции destroy, но затем получаю ошибки jQuery относительно невозможности инициализации.

Как вернуть диалоговое окно обратно в исходное состояние при закрытии или сохранении диалога?

Answer 1

Вы можете сделать это с помощью шаблона DIV так: -

Поместите HTML вы хотите, чтобы диалог появляется каждый раз с (при нажатии на свежие или после того, как сохранить или закрыть) внутри шаблона DIV как это: -

<a href="#" onclick="showDialog(this); return false;">Click Me</a> 
<div id="dialogueTemplate"> 
    <input type='text' name='name' id='' />" 
    <input type='hidden' name='id' id='id' /> 
</div> 

в яваскрипта части -

function showDialog(entity) { 

    //Set up some variables 
    var id = $(entity).attr('id'); 

    //Then while displaying the dialogue, get the template 
    var html = $("div#dialogueTemplate").attr('innerHTML'); 

    //fill into the dialogue's body 
$("div#dialogue p").attr('innerHTML',html); 

    //Apply runtime changes 
    $("div#dialogue p input[name='id']").attr('id',id); 

    //Finally display the dialogue 
    $("#dialogue").dialog('open'); 
} 

Answer 2

просто установить переменную HTML обнулить в начале метода

всякий раз, когда вы вызываете этот метод, он будет свежим ... без каких-либо значений.

var html= '' ;