JQuery UI Modal only works first time

Question

I am using JQuery UI to show a modal, after I do a lookup on an input field value. This has to fire every time the value changes in the input field.

My problem is, that the modal only displays the first time the code is called - not subsequent times. I know the code runs, because I tried putting alerts in there - that displayed just as expected.

What am I missing here?

<input id="RegistrationNo" name="RegistrationNo" type="text"/>

<span style=visibility:hidden" id="dialog">Nononono!!</span>

<script>
  $("#RegistrationNo").change(function() {
     //Some check here...
     $("#dialog").dialog({
      bgiframe: true,
      modal: true,
      buttons: { 
        Ok: function() { 
          $(this).dialog('close');
          }
        }
      });
  });
</script>

Answer 1

try creating the dialog only once and then just open/close it as needed:

<input id="RegistrationNo" name="RegistrationNo" type="text"/>

<span id="dialog">Nononono!!</span>

<script>
  $("#dialog").dialog({
      bgiframe: true,
      modal: true,
      autoOpen:false,
      buttons: { 
        Ok: function() { 
          $(this).dialog('close');
          }
        }
      });
  $("#RegistrationNo").change(function() {
     $("#dialog").dialog("open");
  });

</script>