API tools faq
paste
Advertisement
Guest User

beyond article

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