addmore.js

   1 // Updated to wait until the document is loaded. addmore_link
   2
   3 cj(function ( $ ) {
   4   $(document).ready(function(){
   5     var count = parseInt($('input[name=contrib_count]').val());
   6     for ( var i = 2; i <= count; i++ ) {
   7       $('#' + "contribution_page_" + i).after(
   8       '<a id=\"remove_link\" class=\"form-link\" href=\"remove\" name=\"remove_link-' + i + '\"> Remove</a>');
   9       $('#' + "contribution_page_" + i).parent().parent().attr("id", "crm-section-con-" + i);
  10       $('#' + "percentage_" + i).parent().parent().attr("id", 'crm-section-per-' + i);
  11     }
  12     $('#percentage_1').after('<label><br><SMALL>Progressbar shows the sum of each percentage of contributions done on each selected contribution page</SMALL></label>');
  13   });
  14   $("#ProgressBar").validate({
  15     rules: {
  16       starting_amount: {
  17         required: true,
  18         number: true
  19       },
  20       progressbar_name: {
  21         required: true
  22       },
  23       goal_amount: {
  24         required: true,
  25         number: true
  26       },
  27       contribution_page_1: {
  28         required: true
  29       },
  30       percentage_1: {
  31         required: true,
  32         max: 100,
  33         number: true
  34       }
  35     }
  36   });
  37
  38   $('#addmore_link').on('click', function( e ) {
  39     e.preventDefault();
  40     var count = parseInt($('input[name=contrib_count]').val());
  41     count++;
  42
  43     var c_page_sel = $('select[name=contribution_page_1]').clone().attr('id', "contribution_page_" + count);
  44     c_page_sel.attr("name", "contribution_page_" + count);
  45
  46     var id_section = "crm-section-con-" + count;
  47     var sect_tag = "<div class=\"crm-section\" id=" + id_section + "> <hr width='50%' size='1'> <div class=\"label\"><label>Contribution Page</label>";
  48     $('#addmore_link').parent().parent().before(sect_tag);
  49
  50     var id_content = "content_con-" + count;
  51     $('#' + id_section).append("<div class=\"content\" id="+ id_content + ">");
  52     $('#' + id_content).append(c_page_sel);
  53     $('#' + id_content).append('<a id=\"remove_link\" class=\"form-link\" href=\"remove\" name=\"remove_link-' + count + '\"> Remove</a>');
  54     $('#' + id_section).append("</div>");
  55
  56     id_section = "crm-section-per-" + count;
  57     sect_tag = "<div class=\"crm-section\" id=" + id_section + "> <div class=\"label\"><label>Percentage</label>";
  58     $('#addmore_link').parent().parent().before(sect_tag);
  59
  60     id_content = "content_per-" + count;
  61     $('#' + id_section).append("<div class=\"content\" id="+ id_content + ">");
  62     $('#' + id_content).append('<input type="text" size="20" id = percentage_'+ count + ' name="percentage_' + count +'" value="" />');
  63     $('#' + id_section).append("</div");
  64
  65     $( "#contribution_page_" + count).rules( "add", {
  66       required: true
  67     });
  68
  69     $( "#percentage_" + count).rules( "add", {
  70       required: true,
  71       max: 100,
  72       number: true
  73     });
  74
  75     $('input[name=contrib_count]').val(count);
  76
  77   });
  78
  79   $(document).on('click', '#remove_link', function( e ) {
  80     e.preventDefault();
  81
  82     var rem_name = e.target.name;
  83     //assuming that - is the delimiter. second string will be the count
  84     var rem_name_ar = rem_name.split('-');
  85     var contri_page = "\"#percentage_" + rem_name_ar[1] + "\"";
  86     $('#crm-section-con-'+ rem_name_ar[1] +'').remove();
  87     $('#crm-section-per-'+ rem_name_ar[1] +'').remove();
  88     var count = parseInt($('input[name=contrib_count]').val());
  89     count--;
  90     $('input[name=contrib_count]').val(count);
  91   });
  92 });