jeudi 19 avril 2018

jquery checkbox prepend - works separately, but not when put together inside function

I`m new to javascript and jquery, but very eager to learn.

My end goal is to make a popup, in which a table of contents is displayed, with links, as is normal in a table of contents. This table of contents is called "Print adjust". just before every chapter headline inside the table of contents, I want a checkbox. If ticked, this checkbox will remove that chapter from the document. In addition, I want one checkbox that if ticked, ticks all the other checkboxes, and removes all chapters in the document. If all chapter specific checkboxes are checked, the master checkbox will be automatically checked. I have tested parts of the code separately, but have challenges when I put it into the "Print adjust" function. The table of contents is fully operational, checkboxes are diplayed in fromt of every headline inside the TOC, but when I expect the checkboc class "justone" to be inserted, the "class "Master" is inserted on every line - the master should only be one checkbox inside a separate div, and that should be the checkbox "to rule them all". This checkbox is not inserted at all, but all the other checkboxes get this class. In the div I want this checkbox, only text input fields are displayed - many of them.

If anybody can point me in the right direction, it would be much appreciated.

Here is the part of the function I`m struggling with:

  var check= document.createElement ('input');
  check.type= "checkbox";
  check.id= "CHECK" + sectionNumber;
  check.className="justone";



  $("input[type='checkbox'].justone").change(function(){
  var a = $("input[type='checkbox'].justone");
  if(a.length == a.filter(":checked").length){
  $('.containerhideall').prop('checked', true);
 }
 else {
    $('.containerhideall').prop('checked', false);
 }
 });

 $('.justone').change(function(){
if($('.justone:checked').length==0){
    $('#purpose_scope').show();
}else{
    $('#purpose_scope').hide();
    $('.justone:checked').each(function(){
        $('#'+$(this).attr('data-ptag')).show();
    }) 
}});                    



var MASTERcheck= document.createElement ('input');
check.type= "checkbox";
check.id= "MASTER";
check.className="containerhideall";
check.innerHTML=sectionNumber;



$('.containerhideall').click(function() {
if ($(this).is(':checked')) {
$('input:checkbox').prop('checked', true);
} else {

  $('input:checkbox').prop('checked', false);
 }
 });



$('.containerhideall').change(function(){
if($('.containerhideall:checked').length==0){
$('.screensteps-section').show();
}else{
    $('.screensteps-section').hide();
    $('.containerhideall:checked').each(function(){
        $('#'+$(this).attr('data-ptag')).show();
    })
}

});



$('.checkall').prepend (MASTERcheck);

    $('.PRINTEntry').each(function(n) {
(this).prepend (check);
});




Aucun commentaire:

Enregistrer un commentaire