Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript JQuery: Tables Don't Toggle or Sort Anymore

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #149250
    bmoneruiux
    Participant

    Darn! I’ve messed something up now, and can’t figure out what… Can a more experienced coder lend an eye???

    $(function () {
    var i = 1;
    //ADD ROW FUNCTION
    $('body').on('click', '.addPTbutton', function () {
    var box = '<table class="manage-pt" id="' + i + '"><tr class="pt-entry"><td class="pt-toggle-group"><input class="pt-button togPTbutton" id="0" type="button" value="▾"><input class="pt-button addPTbutton" id="0" type="button" value="+"><input class="pt-button delPTbutton" id="' + i + '" type="button" value="-"></td><td class="pt-values"><div><input class="vendor" placeholder="*Vendor Name" type="text"><i class="icon-sort"></i><i class="icon-lock"></i></div><div><textarea class="ptCode" name="ptCode" placeholder="*Pixel Tag Code"></textarea></div><div class="page-select"><select><option value="AllPages">All Pages</option><option value="HomePage">HomePage</option><option value="VehicleDetailsPage">VehicleDetailsPage</option><option value="VehicleSearchResults">VehicleSearchResults</option><option value="ContactUsForm">ContactUsForm </option></select></div><div class="area-checkboxes"><p class="wheretosave">*Where?</p><input name="head" type="checkbox"><label for="head">Head</label><input name="body" type="checkbox"><label for="body">Body</label></div><div class="save-pt"><input type="submit" value="SAVE"></div></td></tr></table>';
    i++;
    $("#p_scents").append(box);
    return false;
    });
    //DELETE ROW FUNCTION
    $('body').on('click', '.delPTbutton', function () {
    var boxnum = $(".manage-pt").length;
    if (boxnum <= '1') {
    alert('Cannot Delete Last Remaining Row');
    } else {
    $(this).parents().eq(3).remove();
    }
    return false;
    });
    //TOGGLE BUTTON
    $('body').on('click', '.togPTbutton', function () {
    var hiddenarea = $(this).parent().next().children().next();
    if ($(hiddenarea).is(':hidden')) {
    //OPENED
    $(this).val('▾');
    $(this).parent().next().children(0).children(0).attr('readonly', false);
    } else {
    //HIDDEN
    $(this).val('▸');
    $(this).parent().next().children(0).children(0).attr('readonly', true);
    //CHECKS FOR MORE THAN ONE 1 MANAGE-PT BEFORE ENABLES SORTABLE
    if ($(".manage-pt").size() > 1) {
    $('#p_scents').sortable({
    disabled: false,
    placeHolder: '.placeHolderHighlight',
    handle: '.icon-sort',
    });
    $('#p_scents').sortable({
    disabled: true,
    });
    }
    }
    //TOGGLES VISIBILITY OF HIDDEN AREA
    $(hiddenarea).toggle(function (){});
    //CHECKS TO MAKE SURE ONLY ONE CHECKBOX IS SELECTED
    var $onlyOne = $('input.onlyOne');
    $onlyOne.click(function () {
    $onlyOne.filter(':checked').not(this).removeAttr('checked');
    });
    });
    });

    JS is apart of this Pen

    #149252
    bmoneruiux
    Participant

    Tables should toggle open and closed. However once closed, they no longer open.
    Tables should be sortable, however the functionality is gone now and I don’t know why.

    #149267
    bmoneruiux
    Participant

    Ok I had to do some serious cleanup (closure ussues mostly), but I’ve found and corrected the issue with the toggles and sortable errors. My last issue deals with my sortable if statements not being followed after conditions are met.

    I have it set to not activate sortable until 2 or more .manage-pt’s are present. Works great, until I delete all but the last one. It remains sortable, even though it’s that last one left. I have to open it and close it again for it to realize it’s the last one again. Why is this?

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.