I have a form that I am using in a dialog modal box. This form is
submitted via AJAX to a backend PHP script that inserts a record into
the database.

Next the item that has been inserted into the database (a list of
tasks) that task is added to the end of an unordered lists.

I also have this unordered list setup so I can drag and drop the list
items to sort them. Once dropped, again, a script updates the
database.

Lastly, I have an inplace editor setup so I can easily edit the
contents of each task.

When I click on my link to open the dialog box, once the form is
saved, a 'template' task is copied and modified with the contents from
the form.

Everything works perfectly except after I add new tasks, they are not
editable until I reload the page. I thought using live() would fix
this, but it does not. Below is my code for this dialog box. I am not
superb with jQuery so if you see things that look very wrong or have a
better way to complete this task, please let me know.

Thank you!

$('.task_add').live('click', function(e) {
  e.preventDefault();
  var targetUrl = $(this).attr('href');

  // Clear values
  $('#name').val('');
  $('#description').val('');
  $('#url').val('');

  $('#dialog_task_add').dialog({
    autoOpen  : false,
    bgiframe  : true,
    draggable : false,
    modal     : true,
    resizable : false,
    width     : 'auto',
    buttons: {
      'Save': function() {
        $.ajax({
          type     : 'POST',
          url      : '../tasks/add.php',
          data     : $([]).add('#name').add('#description').add
('#url'),
          success  : function (response) {
            if (response == 'SUCCESS') {
              $('#dialog_task_add').dialog('close');

              // Update the various values
              $('#name-TASKID').text($('#name').val());
              $('#description-TASKID').text($('#description').val());
              $('#url-TASKID').text($('#url').val());

              // Rename the IDs
              // Not yet implemented

              // Show the created item
              $('#task_TASKID').clone().appendTo('.tasks').slideDown
();
            } else {
              // Alert in a better way once other portions of code are
complete
              alert('OH NO!');
            };
          },
        });
      },
      'Cancel': function() {
        $(this).dialog('close');
      },
    }
  });

  $('#dialog_task_add').dialog('open');
});

Reply via email to