API tools faq
paste
kura2yamato

javascript 001

kura2yamato
Jan 15th, 2021 (edited)
737
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 20.74 KB | None | 0 0
raw download clone embed print report diff
  1. function parsingHasil(item, index) {
  2.    hasil[index] = parseInt(item) / parseInt(total) * 100;
  3.    return 1;
  4. }
  5. var hasil = Array();
  6. var arr = Array();
  7. var total = 0;
  8.  
  9. function getForm() {
  10.  
  11.    $.ajax({
  12.       method: 'GET',
  13.       url: sourceorigin + '/get_voting/' + fbp_id,
  14.       success: function(dt) {
  15.          // var result = JSON.parse(data[0]['data']);
  16.  
  17.          log_txt(data);
  18.          data['data'].forEach(element => {
  19.             if (typeof element.question_type != "undefined" && element.question_type == 'imagesingle') {
  20.                var key = element.answer;
  21.                log_txt(key);
  22.                //if(typeof arr[key] !== 'undefined')
  23.                if (typeof arr[key] == "undefined" || arr[key] == null) {
  24.                   arr[key] = 1;
  25.                } else {
  26.                   arr[key]++; //kecuali mau pakai
  27.                   //arr[key]+=element.total
  28.                }
  29.                total++;
  30.                //hasil[key] = parseInt(arr[key])/parseInt(data['total'])* 100;
  31.             }
  32.             elseif(typeof element.question_type != "undefined") {
  33.                log_txt(element.question_type);
  34.             }
  35.             else {
  36.                log_txt(element);
  37.             }
  38.          });
  39.          //----------Hasil
  40.          arr.forEach(parsingHasil);
  41.       },
  42.    });
  43.  
  44.    $.ajax({
  45.       method: 'GET',
  46.       url: sourceorigin + '/getformview/' + fbp_id,
  47.       success: function(data) {
  48.          var str = "";
  49.          var poolinngresult = "";
  50.          $("#tnc-content-href").append("<a href='#tnc' class='text-tnc'>" + data['data'][0]['campaign']['hreftnc'] + "</a>").magnificPopup({
  51.             items: {
  52.                src: '#tnc'
  53.             },
  54.             callbacks: {
  55.                open: function() {},
  56.                close: function() {
  57.                   //   location.reload(true);
  58.                }
  59.             },
  60.             type: 'inline',
  61.             fixedContentPos: false,
  62.             fixedBgPos: true,
  63.             overflowY: 'auto',
  64.             closeBtnInside: true,
  65.             preloader: true,
  66.             midClick: true,
  67.             removalDelay: 300,
  68.             mainClass: 'my-mfp-slide-bottom'
  69.          });
  70.          $("#success_popup").append("<button title='Close (Esc)' type='button' class='mfp-close right bat-close-button'><span><i class='fa fa-close'></i></span></button>" +
  71.             "<div class='tandc-text'>" +
  72.             data['data'][0]['campaign']['success_messages'] +
  73.             "<div class='bat-voucher-code'>" +
  74.             data['data'][0]['campaign']['code_voucher'] +
  75.             "</div>" +
  76.             "<a href='#' target='_blank'>" + data['data'][0]['campaign']['shop_url'] + "</a>" +
  77.             "</div>" +
  78.             "<div class='bat-modal-button'><button id='confirm-success-all' class='ok-button-success' type='button'>OK</button></div>")
  79.          $('#tnc-content').append("<div id='tnc' class='campaign_popup zoom-anim-dialog mfp-hide'>" +
  80.             "<button title='Close (Esc)' id='btn_success_close' type='button' class='mfp-close right bat-close-button'><span><i class='fa fa-close'></i></span></button>" +
  81.             "<p class='tncTitle' style='text-align: center;'>Syarat & Ketentuan<br></p>" +
  82.             "<div class='tandc-text'>" +
  83.             data['data'][0]['campaign']['tnc'] +
  84.             "</div>" +
  85.             "<div class='bat-modal-button'><button class='ok-button-tnc' type='button'>OK</button></div></div>")
  86.          $('#header-article').append("<div class='bat-component' id='bat-title'>" + data['data'][0]['campaign']['title'] + "</div>" +
  87.             "<!-- beyond article banner image -->" +
  88.             "<div class='bat-component' id='bat-banner-image'>" +
  89.             "<img src='" + sourceorigin + "/storage/" + data['data'][0]['campaign']['image_banner'] + "'>" +
  90.             "</div>" + " <input type='hidden' name='textfield' id='id_campaign' class='bat-input-field bat-textfield id-short-input' value='" + data['data'][0]['campaign']['_id'] + "'>")
  91.          data['data'].forEach((element, index) => {
  92.             if (element.question_type == 'short') {
  93.                str = " <div class='input-short'>" +
  94.                   "<input type='text' name='" + element._id + "' class='bat-input-field bat-textfield short-input'>" +
  95.                   "</div>";
  96.             } else if (element.question_type == 'long') {
  97.                str = "<div class='input-long'>" +
  98.                   "<textarea rows='8' name='" + element._id + "' class='bat-input-field bat-textarea long-input'></textarea>" +
  99.                   "</div>";
  100.             } else if (element.question_type == 'single') {
  101.                var option = "";
  102.                element['options'].forEach((value, index) => {
  103.                   option += "<li class='bat-radiobutton-item'>" +
  104.                      "<input class='bat-radiobutton' type='radio' name='" + element._id + "' value='" + value + "' id='radio-" + index + "'/>" +
  105.                      "<label for='radio-" + index + "'>" + value + "</label>" +
  106.                      "</li>";
  107.                });
  108.                str = "<ul id='radiobutton'>" + option + "</ul>";
  109.             } else if (element.question_type == 'multiple') {
  110.                var option = ""
  111.                element['options'].forEach((value, index) => {
  112.                   option += "<label class='bat-checkbox'>" + value +
  113.                      "<input class='check-bx' type='checkbox' name='" + element._id + "' value='" + value + "' id='checkbox-" + index + "'/>" +
  114.                      "<span class='checkmark'></span>" +
  115.                      "</label>";
  116.                   str = option;
  117.                });
  118.             } else if (element.question_type == 'select') {
  119.                var option = ""
  120.                element['options'].forEach((value, index) => {
  121.                   option += "<option value='" + value + "'>" + value + "</option>";
  122.                });
  123.                str = "<div class='select-dropdown'>" +
  124.                   "<select name='" + element._id + "' id='select-dropdown' class='bat-input-field bat-select-dropdown'>" +
  125.                   "<option value=''>Pilih Jawaban</option>" + option +
  126.                   "</select>";
  127.             } else if (element.question_type == 'imagesingle') {
  128.                var option = ""
  129.                element['options'].forEach((value, index) => {
  130.                   if (element.images.length != 0) {
  131.                      option += "<div class='bat-polling-image' data-for='polling-2'>" +
  132.                         "<img src='" + sourceorigin + "/storage/" + element['images'][index] + "'>" +
  133.                         "<div class='bat-polling-text'>" + value + "</div>" +
  134.                         "<input type='radio' name='" + element._id + "' id='polling-2' value='" + value + "' class='img-option'>" +
  135.                         "</div>"
  136.                   } else {
  137.                      option += "<div class='bat-polling-image' data-for='polling-2'>" +
  138.                         "<img>" +
  139.                         "<div class='bat-polling-text'>" + value + "</div>" +
  140.                         "<input type='radio' name='" + element._id + "' id='polling-2' value='" + value + "' class='img-option'>" +
  141.                         "</div>"
  142.  
  143.                   }
  144.                   console.log(hasil);
  145.                   if (typeof hasil[value] !== 'undefined') {
  146.                      console.log(hasil[value]);
  147.                      poolinngresult += "<div class='bat-polling-percentage' id='percentage-1' style='width: calc(" + hasil[value] + "% - 26px);'>" +
  148.                         "<div class='bat-polling-percentage-text'>" + value + "</div>" +
  149.                         "<div class='bat-polling-percentage-number'>" + hasil[value] + "%</div>" +
  150.                         "</div>";
  151.                   }
  152.                });
  153.                str = "<div class='bat-component bat-quiz' id='bat-polling'>" +
  154.                   "<div class='bat-quiz-question'>Clozetters, kalau kamu mendapatkan kesempatan untuk memiliki " + data['data'][0]['campaign']['title'] + " akan kamu pakai dalam momen apa?</div>" +
  155.                   "<div class='bat-quiz-input'>" +
  156.                   "<div class='bat-polling-image-list'>" +
  157.                   option +
  158.                   "</div>" +
  159.                   "<div class='bat-polling-result'>" +
  160.                   poolinngresult "</div>" +
  161.                   "</div>" +
  162.                   "</div>"
  163.             } else if (element.question_type == 'scale') {
  164.                // element['options'].forEach((value,index) => {
  165.                //   option += "<option value='"+value+"'>"+value+"</option>";
  166.                // });
  167.                var option = "";
  168.                var nameArr = element.range.split('-');
  169.                for (var i = parseInt(nameArr[0]); i <= parseInt(nameArr[1]); i++) {
  170.                   option += "<div class='bat-scaling-answer'>" +
  171.                      "<div class='bat-radiobutton-item'>" +
  172.                      "<input class='bat-radiobutton scale-option' type='radio' name='" + element._id + "' value='" + i + "' id='scaling-" + i + "'>" +
  173.                      "<label for='scaling-" + i + "'>" + i + "</label>" +
  174.                      "</div>" +
  175.                      "</div>"
  176.                }
  177.                str = "<div class='bat-scaling-answer-list'><div class='bat-scaling-item' id='bat-scaling-tidak'>" + element.start + "</div>" +
  178.                   "<div class='bat-scaling-item' id='bat-scaling-list'>" +
  179.                   option +
  180.                   "</div>" +
  181.                   "<div class='bat-scaling-item' id='bat-scaling-ingin'>" + element.end + "</div></div>";
  182.             }
  183.             $('#answer-template').append("<div class='bat-component bat-quiz' id='bat-textfield'>" +
  184.                "<div class='bat-quiz-question'>" + element.question + "</div>" +
  185.                "<div class='bat-quiz-input'>" + str + "</div>");
  186.          });
  187.  
  188.       }
  189.    })
  190. }
  191. $(document).ready(function() {
  192.    getForm();
  193.    $(document).on('submit', '#bat-form', function(e) {
  194.       e.preventDefault();
  195.       if ($('#agree').is(":checked")) {
  196.          var fd = new FormData();
  197.          var i;
  198.          var num = $('.bat-radiobutton-item').find('.bat-radiobutton')
  199.          var numshortinput = $('.input-short').find('.short-input')
  200.          var numlonginput = $('.input-long').find('.long-input')
  201.          var numcheckbox = $('.bat-checkbox').find('.check-bx')
  202.          var numselectbox = $('.select-dropdown').find('.bat-select-dropdown')
  203.          var numoptionimg = $('.bat-polling-image').find('.img-option')
  204.          var numscale = $('.bat-scaling-answer').find('.scale-option')
  205.          fd.append('_token', '{{csrf_token()}}')
  206.          if (num.length > 0) {
  207.             var dataoption = [];
  208.             num.each(function(index, item) {
  209.                var id = $(item).attr('name')
  210.                if (dataoption.indexOf(id) === -1) {
  211.                   dataoption.push(id);
  212.                }
  213.             });
  214.             for (let index = 0; index < dataoption.length; index++) {
  215.                const element = dataoption[index];
  216.                var val = $('input[name=' + element + ']:checked').val();
  217.                i = index;
  218.                fd.append('answer[' + i + ']', val);
  219.                fd.append('question[' + i + ']', element);
  220.             }
  221.          }
  222.          if (numshortinput.length > 0) {
  223.             numshortinput.each(function(index, item) {
  224.  
  225.                if (index == 0) {
  226.                   i += index + 1;
  227.                } else {
  228.                   i = index;
  229.                }
  230.                // var val = $(item).val();
  231.                var id = $(item).attr('name');
  232.                var val = $(item).val()
  233.                fd.append('answer[' + i + ']', val);
  234.                fd.append('question[' + i + ']', id);
  235.             });
  236.          }
  237.          if (numlonginput.length > 0) {
  238.             numlonginput.each(function(index, item) {
  239.  
  240.                if (index == 0) {
  241.                   i += index + 1;
  242.                } else {
  243.                   i = index;
  244.                }
  245.                var id = $(item).attr('name');
  246.                var val = $(item).val()
  247.                fd.append('answer[' + i + ']', val);
  248.                fd.append('question[' + i + ']', id);
  249.             });
  250.          }
  251.          if (numcheckbox.length > 0) {
  252.             var dataceckoption = [];
  253.             numcheckbox.each(function(index, item) {
  254.                var id = $(item).attr('name')
  255.                //console.log($(item));
  256.                if (dataceckoption.indexOf(id) === -1) {
  257.                   dataceckoption.push(id);
  258.                }
  259.             });
  260.             for (let index = 0; index < dataceckoption.length; index++) {
  261.                const element = dataceckoption[index];
  262.                //var val = $('input[name='+element+']:checked').val();
  263.                var val = [];
  264.                $.each($("input[name=" + element + "]:checked"), function() {
  265.                   val.push($(this).val());
  266.                });
  267.  
  268.                if (index == 0) {
  269.                   i += index + 1;
  270.                } else {
  271.                   i = index;
  272.                }
  273.                fd.append('answer[' + i + ']', val);
  274.                fd.append('question[' + i + ']', element);
  275.             }
  276.          }
  277.          if (numselectbox.length > 0) {
  278.             numselectbox.each(function(index, item) {
  279.  
  280.                if (index == 0) {
  281.                   i += index + 1;
  282.                } else {
  283.                   i = index;
  284.                }
  285.                // var val = $(item).val();
  286.                var id = $(item).attr('name');
  287.                var val = $(item).val();
  288.                console.log(val);
  289.                fd.append('answer[' + i + ']', val);
  290.                fd.append('question[' + i + ']', id);
  291.             });
  292.          }
  293.          if (numoptionimg.length > 0) {
  294.             var dataoption = [];
  295.             numoptionimg.each(function(index, item) {
  296.                var id = $(item).attr('name')
  297.                if (dataoption.indexOf(id) === -1) {
  298.                   dataoption.push(id);
  299.                }
  300.             });
  301.             for (let index = 0; index < dataoption.length; index++) {
  302.                const element = dataoption[index];
  303.                var val = $('input[name=' + element + ']:checked').val();
  304.                if (index == 0) {
  305.                   i += index + 1;
  306.                } else {
  307.                   i = index;
  308.                }
  309.                fd.append('answer[' + i + ']', val);
  310.                fd.append('question[' + i + ']', element);
  311.             }
  312.          }
  313.          if (numscale.length > 0) {
  314.             var datascaling = [];
  315.             numscale.each(function(index, item) {
  316.                var id = $(item).attr('name')
  317.                if (dataoption.indexOf(id) === -1) {
  318.                   dataoption.push(id);
  319.                }
  320.             });
  321.             for (let index = 0; index < datascaling.length; index++) {
  322.                const element = datascaling[index];
  323.                var val = $('input[name=' + element + ']:checked').val();
  324.                if (index == 0) {
  325.                   i += index + 1;
  326.                } else {
  327.                   i = index;
  328.                }
  329.                fd.append('answer[' + i + ']', val);
  330.                fd.append('question[' + i + ']', element);
  331.             }
  332.          }
  333.          var nama = $("#nama").val();
  334.          var whatsapp = $("#whatsapp").val();
  335.          var alamat = $("#alamat").val();
  336.          var email = $("#email").val();
  337.          var idcampaign = $("#id_campaign").val();
  338.          var instagram = $("#instagram").val();
  339.          fd.append('nama', nama);
  340.          fd.append('whatsapp', whatsapp);
  341.          fd.append('alamat', alamat);
  342.          fd.append('email', email);
  343.          fd.append('instagram', instagram);
  344.          fd.append('idcampaign', idcampaign);
  345.          $.ajax({
  346.             url: sourceorigin + '/saveparticipant',
  347.             method: 'POST',
  348.             processData: false,
  349.             contentType: false,
  350.             data: fd,
  351.             success: function() {
  352.                $.magnificPopup.open({
  353.                   items: {
  354.                      src: '#success_popup'
  355.                   },
  356.                   callbacks: {
  357.                      open: function() {},
  358.                      close: function() {
  359.                         location.reload(true);
  360.                      }
  361.                   },
  362.                   type: 'inline',
  363.                   fixedContentPos: false,
  364.                   fixedBgPos: true,
  365.                   overflowY: 'auto',
  366.                   closeBtnInside: true,
  367.                   preloader: true,
  368.                   midClick: true,
  369.                   removalDelay: 300,
  370.                   mainClass: 'my-mfp-slide-bottom'
  371.                });
  372.             },
  373.             error: function(xhr, status, error) {
  374.                var err = eval("(" + xhr.responseText + ")");
  375.                $('#errormessages').text(err.messages)
  376.                $.magnificPopup.open({
  377.                   items: {
  378.                      src: '#failed_popup'
  379.                   },
  380.                   callbacks: {
  381.                      open: function() {},
  382.                      close: function() {
  383.                         location.reload(true);
  384.                      }
  385.                   },
  386.                   type: 'inline',
  387.                   fixedContentPos: false,
  388.                   fixedBgPos: true,
  389.                   overflowY: 'auto',
  390.                   closeBtnInside: true,
  391.                   preloader: true,
  392.                   midClick: true,
  393.                   removalDelay: 300,
  394.                   mainClass: 'my-mfp-slide-bottom'
  395.                });
  396.             }
  397.          })
  398.       } else {
  399.          alert('please check term and condition')
  400.       }
  401.    });
  402.    $(document).on('click', '.bat-polling-image', function() {
  403.       var clickImageRadio = $(this).data('for');
  404.       $("#" + clickImageRadio).prop("checked", true);
  405.       $('.bat-polling-image').removeClass('bat-polling-image-active');
  406.       $(this).addClass('bat-polling-image-active');
  407.    });
  408.    $(document).on('click', '.campaign_popup .fa-close', function() {
  409.       $('.mfp-close').click();
  410.    });
  411.    //  open tnc
  412.    $('.text-tnc').magnificPopup({
  413.       items: {
  414.          src: '#tnc'
  415.       },
  416.       callbacks: {
  417.          open: function() {},
  418.          close: function() {
  419.             //   location.reload(true);
  420.          }
  421.       },
  422.       type: 'inline',
  423.       fixedContentPos: false,
  424.       fixedBgPos: true,
  425.       overflowY: 'auto',
  426.       closeBtnInside: true,
  427.       preloader: true,
  428.       midClick: true,
  429.       removalDelay: 300,
  430.       mainClass: 'my-mfp-slide-bottom'
  431.    });
  432.  
  433.    //  tombol ok popup
  434.    $('.ok-button-tnc,.ok-button-success,.ok-button-fail,.ok-button-end').click(function(event) {
  435.       magnificPopup1 = $.magnificPopup.instance; // save instance in magnificPopup variable
  436.       magnificPopup1.close(); // Close popup that is currently opened
  437.       event.preventDefault();
  438.    });
  439.  
  440.    //  popup kontes selesai
  441.    $('#open_end_popup').magnificPopup({
  442.       items: {
  443.          src: '#end_popup'
  444.       },
  445.       callbacks: {
  446.          open: function() {}
  447.       },
  448.       type: 'inline',
  449.       fixedContentPos: false,
  450.       fixedBgPos: true,
  451.       overflowY: 'auto',
  452.       closeBtnInside: true,
  453.       preloader: true,
  454.       midClick: true,
  455.       removalDelay: 300,
  456.       mainClass: 'my-mfp-slide-bottom'
  457.    });
  458.  
  459.    //  open popup success submit form
  460.    $('#open_success_popup').magnificPopup({
  461.       items: {
  462.          src: '#success_popup'
  463.       },
  464.       callbacks: {
  465.          open: function() {},
  466.          close: function() {
  467.             //   location.reload(true);
  468.          }
  469.       },
  470.       type: 'inline',
  471.       fixedContentPos: false,
  472.       fixedBgPos: true,
  473.       overflowY: 'auto',
  474.       closeBtnInside: true,
  475.       preloader: true,
  476.       midClick: true,
  477.       removalDelay: 300,
  478.       mainClass: 'my-mfp-slide-bottom'
  479.    });
  480.  
  481.    //  open popup failed submit form
  482.    $('#open_failed_popup').magnificPopup({
  483.       items: {
  484.          src: '#failed_popup'
  485.       },
  486.       callbacks: {
  487.          open: function() {},
  488.          close: function() {}
  489.       },
  490.       type: 'inline',
  491.       fixedContentPos: false,
  492.       fixedBgPos: true,
  493.       overflowY: 'auto',
  494.       closeBtnInside: true,
  495.       preloader: true,
  496.       midClick: true,
  497.       removalDelay: 300,
  498.       mainClass: 'my-mfp-slide-bottom'
  499.    });
  500.  
  501.    //  open popup kontes selesai submit form
  502.    $('#open_end_popup').magnificPopup({
  503.       items: {
  504.          src: '#end_popup'
  505.       },
  506.       callbacks: {
  507.          open: function() {}
  508.       },
  509.       type: 'inline',
  510.       fixedContentPos: false,
  511.       fixedBgPos: true,
  512.       overflowY: 'auto',
  513.       closeBtnInside: true,
  514.       preloader: true,
  515.       midClick: true,
  516.       removalDelay: 300,
  517.       mainClass: 'my-mfp-slide-bottom'
  518.    });
  519. });
  520.  
  521. function log_txt(param) {
  522.    console.log(param);
  523.    return 1;
  524. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!