title: Issue with Ajax on Jquery Dialog
body: <p>I have a Jquery.Dialog which i use to send messages in my application. When the user clicks "new", the dialog pops up and allows the user to select who they'd like to message (as of right now, its working with IDs rather than usernames).</p>
  
  <p>When i open the dialog for the first time, everything works fine. Im able to select the recipient by either typing the ID or looking through it on a "search form" that opens on a second dialog. All of this works fine while opening for the first time before a page refresh. The ID field has an Ajax function on the "onchange" event that validates that the user ID exists on my database AND enables the "send" button (disabled by default to prevent users from sending messages with a "recipient ID" of null.</p>
  
  <p>The problem is that, if i close the message dialog and reopen it (without refreshing the page) the Ajax functionality (mentioned above) doesnt work anymore. For it to get to work again i have to refresh the page.</p>
  
  <p>"Inspect Element" is not showing any javascript errors, so i really dont know what could be causing this. Im clearing the dialog before opening with the following line:</p>
  
  <pre><code>$(document.getElementById("msgdialog").innerHTML= " ");
  </code></pre>
  
  <p>But nothing. Below i will post some code to give you an idea of what im doing:</p>
  
  <p><strong>Dialog</strong></p>
  
  <pre><code>$(document.getElementById("msgdialog").innerHTML= " ");
  $("&lt;%= escape_javascript(render "newmessages") %&gt;").appendTo("#msgdialog");
  $( "#msgdialog" ).dialog(
     {
   hide: 'fold',
   show: 'blind',
   modal: true,
   resizable: false,
   padding: 0,
   margin: 0,
   height: 'auto',
   width: 'auto',
   title: 'Message',
       stack: true
      }
    );
  </code></pre>
  
  <p>Inside the dialog there's a form_for with fields as (ID, Name, Subject and Message) and a "send" button which is disabled by default and gets enabled by the ajax request.</p>
  
  <p>Here's the ajax request that happens on the "onChange" event of the form's ID field:</p>
  
  <pre><code>&lt;script&gt;
  function selectModel(pmodel,elObj) 
    { 
     var dataString = 'model='+pmodel+'&amp;class='+document.getElementById('selected').value+'&amp;code='+elObj.value+'&amp;userid='+document.getElementById('idfield').value+'&amp;type=displayname'+'&amp;type2=message'; 
  $.ajax(
    {   
       type: "GET",  
      url: "/searchlookup/show",  
      data: dataString  
    }); 
    return false;
  };
  </code></pre>
  
  <p></p>
  
  <p>Here's the show.js that's called on the Ajax request</p>
  
  <pre><code>&lt;% when "searchname" %&gt;
  &lt;%if @errormsg == "0" %&gt;
      &lt;% if params[:type2] == 'messages' %&gt;
          $(document.getElementById('buttonc').disabled = false)              
      &lt;% end %&gt;
  &lt;% else %&gt;
      &lt;% if params[:type2] == 'messages' %&gt;
          $(document.getElementById('buttonc').disabled = true);
      &lt;% end %&gt;
  </code></pre>
  
  
  
  <p>That's basically all that's involved. Let me know if you need anythingelse :)</p>
  
  <p>Oscar</p>
  
  <p>EDIT</p>
  
  <p>Something i figured recently. I have 3 tabs on my index, one shows the "unread messages", the other the "read messages" and the 3rd one the "sent messages". Each tab lists the messages that fall in each category, and when i click one of the listed lines it opens a dialog showing the content. I realized that if, after opening and closing my "new message" dialog, if i open one of the listed messages under the "unread/read/sent" message and close that dialog, if i try opening the "new message" again, it works fine. And i can close it/open it as many times as i want and it works fine... :S </p>