title: jQuery detect form changes
body: <p>Hope to get a little help from you guys.</p>
  
  <p>Im using this script when detecting if a form has changed or not. If so, when I click a href link with a certain class a confirm window will popup.</p>
  
  <pre><code>var formChanged = false;
  
  $(document).ready(function() {
  
  $('#my_form input[type=text].editable, #my_form textarea.editable').each(function (i) {
    $(this).data('initial_value', $(this).val());
  });
  
  $('#my_form input[type=text].editable, #my_form textarea.editable').keyup(function() {
    if ($(this).val() != $(this).data('initial_value')) {
         handleFormChanged();
  }
  });
  
  $('#my_form .editable').bind('change paste', function() {
    handleFormChanged();
  });
  
  $('.navigation_link').bind("click", function () {
    return confirmNavigation();
  });
  });
  
  function handleFormChanged() {
   $('#save_or_update').removeAttr('disabled');
   formChanged = true;
  }
  
  function confirmNavigation() {
   if (formChanged) {
        return confirm('Are you sure? Your changes will be lost!');
   } else {
        return true;
   }
  }
  </code></pre>
  
  <p>Everything works fine, except for when i have a link inserted into a div on a buttonclick with jQuery like this (making the link "visible"):</p>
  
  <pre><code>$("button").click(function () {
    var dylink = "&lt;a href='#' class='navigation_link'&gt;dynammic link&lt;/a&gt;";
    $("#tester").html(dylink);
  });
  </code></pre>
  
  <p>the confirm window does not pop up if I edit the form and then click the "dynamic link".
  The other link works perfect. Any idea what it could be?</p>
  
  <p>This is the html code</p>
  
  <pre><code>&lt;div&gt;&lt;button&gt;Show link&lt;/button&gt;&lt;/div&gt;
  &lt;div id="tester"&gt;&lt;/div&gt;
  &lt;div&gt;&lt;a href="#" class="navigation_link"&gt;permanent link&lt;/a&gt;&lt;/div&gt;
  &lt;form action="" method="get" id="my_form"&gt;
  &lt;input type="text" class="editable"&gt;
   &lt;input type="button" name="button" id="save_or_update" value="Submit" disabled="disabled" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Thanks
  /A</p>