Grow your CSS skills. Land your dream job.

Input dynamically added, wont delete on submit unless refresh.

  • # March 9, 2013 at 2:13 pm

    I’m working on a mini CMS for a racing team and here is my issue.

    When they log on, PHP will generate a

    with a
    chunk for each post they have done.

    ‘;
    ‘;

    ‘;
    ‘;
    ‘;

    ‘;

    ‘;

    Then, if they want to add a post, I upload the data to a MySQL database with JQuery AJAX in the background, and on success, I get the ID of that post, and insert it with .after in my form. The problem is when I do this, select the post and delete it, it doesn’t see that new post as part of the form and won’t delete it unless I refresh the page.

    Any idea how to fix this? Here is the code performed when creating a post and when deleting it.

    submit_post function:

    $.ajax({
    type: ‘POST’,
    url: ‘submit_post.php’,
    data: { postTitle : titleValue, postMessage : messageValue }
    }).success( function () {
    var date = new Date(),
    day = date.getDate(),
    months = new Array(‘Jan’, ‘Feb’, ‘Mar’, ‘Apr’, ‘May’, ‘Jun’, ‘Jul’, ‘Aug’, ‘Sept’, ‘Oct’, ‘Nov’, ‘Dec’),
    today = months[date.getMonth()] + ‘. ‘ + day,
    phpID = ”,
    title = $(‘#post_title’).val();

    $.ajax({
    type: ‘POST’,
    url: ‘add_post_to_list.php’,
    data: phpID
    }).success( function (data) {
    phpID = data;

    var post = ‘

    ‘ +
    ‘ +

    ‘ +
    ‘ +
    ‘ +

    ‘ +

    ‘;

    $(‘.post_options’).after(post);
    togglePostForm(0);
    notificationAlert(1);
    });
    });

    delete_post function:

    $(‘#delete_post_button’).click( function (e) {
    e.preventDefault();

    var postID = [];
    $(“.select_post[name='select_post[]‘]:checked”).each(function () {
    postID.push(parseInt($(this).val()));
    });

    $.ajax({
    type: ‘POST’,
    url: ‘delete_post.php’,
    data: { select_post : postID }
    }).success( function () {
    var posts = $(‘.old_posts’),
    postArray = [];

    $(“.select_post[name='select_post[]‘]:checked”).each( function () {
    $(this).parent().css(‘opacity’,’0′);
    $(this).parent().css(‘padding’,’0′);
    $(this).parent().css(‘height’,’0′);
    });
    });
    });

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".