Question

I’m displaying some form data in a jquery dialog. Everything works fine when I do this the first time. I can see the “my value” string in the dialog. If I reopen the dialog again for the second time the form value is no longer visible. Check out this jsfiddle to try it out yourself. This is the code:

var dialog;

$("#b1").click(function(){
dialog = $("<div></div>").html("<p><input id='input1' type='text'></p>").dialog({
    autoOpen:false,
});
$("#input1").val("my value");
dialog.dialog("open");
});

This bug only happens when I add the html tags dynamically. If I use a static html block everything works fine. Any idea what is wrong here? Thanks!

Answer 1

That is because you are not destroying the old

<input id='input1' type='text'>

so when you call

$("#input1").val("my value");

it sets the value of first

<input id='input1' type='text'> 

it finds in the DOM.