Skip to content Skip to sidebar Skip to footer

Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser

The form below contains a Bootstrap toggle button group that uses checkboxes. I need to listen for click events on the checkbox inputs. Examp</div><h2 id="solution_1">Solution 1: </h2><div class="answer-desc"><p>I can't explain why it is working in JSFiddle, however it looks like the checkbox is essentially hiding behind the button. Are you going to be submitting this form, or just doing some jquery to the page based on selection? If it were me and you want to keep the buttons you can do this:</p><pre><code id="code_0" class="hljs language-xml"><span class="hljs-tag"><<span class="hljs-name">form</span><span class="hljs-attr">role</span>=<span class="hljs-string">"form"</span><span class="hljs-attr">id</span>=<span class="hljs-string">"form"</span>></span><span class="hljs-tag"><<span class="hljs-name">div</span><span class="hljs-attr">class</span>=<span class="hljs-string">"form-group"</span>></span><span class="hljs-tag"><<span class="hljs-name">div</span>></span><span class="hljs-tag"><<span class="hljs-name">div</span>></span><span class="hljs-tag"><<span class="hljs-name">label</span><span class="hljs-attr">for</span>=<span class="hljs-string">"fname"</span>></span>Name:<span class="hljs-tag"></<span class="hljs-name">label</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span><span class="hljs-tag"><<span class="hljs-name">div</span><span class="hljs-attr">id</span>=<span class="hljs-string">"fname"</span><span class="hljs-attr">class</span>=<span class="hljs-string">"btn-group btn-group-toggle"</span><span class="hljs-attr">data-toggle</span>=<span class="hljs-string">"buttons"</span>></span><span class="hljs-tag"><<span class="hljs-name">label</span><span class="hljs-attr">class</span>=<span class="hljs-string">"btn btn-primary"</span><span class="hljs-attr">data-value</span>=<span class="hljs-string">"a"</span>></span> a <span class="hljs-tag"></<span class="hljs-name">label</span>></span><span class="hljs-tag"><<span class="hljs-name">label</span><span class="hljs-attr">class</span>=<span class="hljs-string">"btn btn-primary"</span><span class="hljs-attr">data-value</span>=<span class="hljs-string">"b"</span>></span> b <span class="hljs-tag"></<span class="hljs-name">label</span>></span><span class="hljs-tag"><<span class="hljs-name">label</span><span class="hljs-attr">class</span>=<span class="hljs-string">"btn btn-primary"</span><span class="hljs-attr">data-value</span>=<span class="hljs-string">"c"</span>></span> c <span class="hljs-tag"></<span class="hljs-name">label</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span><span class="hljs-tag"></<span class="hljs-name">form</span>></span><span class="hljs-tag"><<span class="hljs-name">script</span>></span><span class="language-javascript"> $(<span class="hljs-keyword">function</span>(<span class="hljs-params"></span>) { $(<span class="hljs-string">'#fname label'</span>).<span class="hljs-title function_">click</span>(<span class="hljs-keyword">function</span>(<span class="hljs-params"></span>) { <span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">'you clicked '</span>+$(<span class="hljs-variable language_">this</span>).<span class="hljs-title function_">data</span>(<span class="hljs-string">'value'</span>)) }); }); </span><span class="hljs-tag"></<span class="hljs-name">script</span>></span></code><button class="copy-btn btn btn-secondary btn-sm" onclick="copyCode(this,'code_0')">Copy</button></pre></div><h2 id="solution_2">Solution 2: </h2><div class="answer-desc"><p>I tried to interpret your question as best as I could. Here's my jsfiddle: <a rel="nofollow noreferrer noopener" href="https://jsfiddle.net/wqse25vj/">https://jsfiddle.net/wqse25vj/</a> I hope it helps.</p><p>The hardest part of being a programmer is asking questions. "A problem well-stated is a problem half-solved." holds true. If this is not the answer you were looking for, refine your question and be sure to ask again. As a general note: remember to encapsulate your jQuery code in <code>$(document).ready()</code> and continue experimenting & learning HTML, CSS and Bootstrap. For example, I noticed your HTML label tag missing a <code>for</code> attribute, and a repetition of class names on your divs and input fields (hint: the Bootstrap class is required for the div only.). All the best to you!</p><a name='more'></a><p>Resources I used:</p><ul><li><a rel="nofollow noreferrer noopener" href="https://www.tutorialrepublic.com/faq/how-to-check-a-checkbox-is-checked-or-not-using-jquery.php">https://www.tutorialrepublic.com/faq/how-to-check-a-checkbox-is-checked-or-not-using-jquery.php</a></li><li>copy/pasted the inline-checkbox <a rel="nofollow noreferrer noopener" href="https://getbootstrap.com/docs/4.0/components/forms/">https://getbootstrap.com/docs/4.0/components/forms/</a></li></ul></div> </div> <div id='baca-juga'></div> <script> //<![CDATA[ var bacaJugaJudul=[],bacaJugaNum=0,bacaJugaUrl=[];function bacaJuga(a){for(var u=0;u<a.feed.entry.length;u++){var e=a.feed.entry[u];bacaJugaJudul[bacaJugaNum]=e.title.$t;for(var l=0;l<e.link.length;l++)if("alternate"==e.link[l].rel){bacaJugaUrl[bacaJugaNum]=e.link[l].href,bacaJugaNum++;break}}}function showBacaJuga(a){function u(a,u){u.parentNode.insertBefore(a,u.nextSibling)}var e=document.querySelector("#baca-juga"),l=document.createElement("div"),t=document.querySelector(".post-body-artikel").querySelectorAll("div > br, span > br, div > p, span > p"),r=Math.ceil(.5*t.length),n=document.getElementById("related"),c=(l.setAttribute("class","baca-juga-wrap"),{bacaJuga:!0,jumlahBacaJuga:3,judulBacaJuga:"Baca Juga"});optionLinkMagz(c);if(!0===c.bacaJuga&&void 0!==t[r]){u(e,null!==n?n:t[r]);for(var g=0;g<bacaJugaUrl.length;g++)bacaJugaUrl[g]==a&&(bacaJugaUrl.splice(g,1),bacaJugaJudul.splice(g,1));var J=Math.floor((bacaJugaJudul.length-1)*Math.random()),g=0;if(0<bacaJugaJudul.length&&0<c.jumlahBacaJuga){e.appendChild(l);n=e;null!=(n=n.previousElementSibling)&&"BR"===n.tagName&&(n.style.display="none");for(var i="<strong>"+c.judulBacaJuga+"</strong><ul>";g<bacaJugaJudul.length&&g<c.jumlahBacaJuga;g++)i+='<li><a href="'+bacaJugaUrl[J]+'">'+bacaJugaJudul[J]+"</a></li>",J<bacaJugaJudul.length-1?J++:J=0;l.innerHTML=i+="</ul>"}}} //]]> </script> <script src='/feeds/posts/summary/-/Bootstrap 4?alt=json-in-script&callback=bacaJuga&max-results=5'></script> <script src='/feeds/posts/summary/-/Css?alt=json-in-script&callback=bacaJuga&max-results=5'></script> <script src='/feeds/posts/summary/-/Javascript?alt=json-in-script&callback=bacaJuga&max-results=5'></script> <script src='/feeds/posts/summary/-/Jquery?alt=json-in-script&callback=bacaJuga&max-results=5'></script> <script src='/feeds/posts/summary/-/Twitter Bootstrap?alt=json-in-script&callback=bacaJuga&max-results=5'></script> <script> showBacaJuga("https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html"); </script> <div id='share-container'> <div class='share-title'> <p class='share-this-pleaseeeee'>Share</p> </div> <div id='share'> <a aria-label='facebook' class='facebook' href='//www.facebook.com/sharer.php?u=https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html' rel='nofollow noreferrer' title='facebook'> <svg viewBox='0 0 24 24'> <path d='M12 2.04C6.5 2.04 2 6.53 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85C10.44 7.34 11.93 5.96 14.22 5.96C15.31 5.96 16.45 6.15 16.45 6.15V8.62H15.19C13.95 8.62 13.56 9.39 13.56 10.18V12.06H16.34L15.89 14.96H13.56V21.96A10 10 0 0 0 22 12.06C22 6.53 17.5 2.04 12 2.04Z'></path> </svg> </a> <a aria-label='twitter' class='twitter' href='//twitter.com/intent/tweet?text=Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser&url=https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html' rel='nofollow noreferrer' title='twitter'> <svg viewBox='0 0 24 24'> <path d='M17.71,9.33C18.19,8.93 18.75,8.45 19,7.92C18.59,8.13 18.1,8.26 17.56,8.33C18.06,7.97 18.47,7.5 18.68,6.86C18.16,7.14 17.63,7.38 16.97,7.5C15.42,5.63 11.71,7.15 12.37,9.95C9.76,9.79 8.17,8.61 6.85,7.16C6.1,8.38 6.75,10.23 7.64,10.74C7.18,10.71 6.83,10.57 6.5,10.41C6.54,11.95 7.39,12.69 8.58,13.09C8.22,13.16 7.82,13.18 7.44,13.12C7.81,14.19 8.58,14.86 9.9,15C9,15.76 7.34,16.29 6,16.08C7.15,16.81 8.46,17.39 10.28,17.31C14.69,17.11 17.64,13.95 17.71,9.33M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2Z'></path> </svg> </a> <a aria-label='pinterest' class='pinterest' href='//pinterest.com/pin/create/button/?url=https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html&media=&description=Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser' rel='nofollow noreferrer' title='pinterest'> <svg viewBox='0 0 24 24'> <path d='M9.04,21.54C10,21.83 10.97,22 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12C2,16.25 4.67,19.9 8.44,21.34C8.35,20.56 8.26,19.27 8.44,18.38L9.59,13.44C9.59,13.44 9.3,12.86 9.3,11.94C9.3,10.56 10.16,9.53 11.14,9.53C12,9.53 12.4,10.16 12.4,10.97C12.4,11.83 11.83,13.06 11.54,14.24C11.37,15.22 12.06,16.08 13.06,16.08C14.84,16.08 16.22,14.18 16.22,11.5C16.22,9.1 14.5,7.46 12.03,7.46C9.21,7.46 7.55,9.56 7.55,11.77C7.55,12.63 7.83,13.5 8.29,14.07C8.38,14.13 8.38,14.21 8.35,14.36L8.06,15.45C8.06,15.62 7.95,15.68 7.78,15.56C6.5,15 5.76,13.18 5.76,11.71C5.76,8.55 8,5.68 12.32,5.68C15.76,5.68 18.44,8.15 18.44,11.43C18.44,14.87 16.31,17.63 13.26,17.63C12.29,17.63 11.34,17.11 11,16.5L10.33,18.87C10.1,19.73 9.47,20.88 9.04,21.57V21.54Z'></path> </svg> </a> <a aria-label='whatsapp' class='whatsapp' href='//api.whatsapp.com/send?phone=&text=Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser%20%2D%20https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html' rel='nofollow noreferrer' title='whatsapp'> <svg viewBox='0 0 24 24'> <path d='M16.75,13.96C17,14.09 17.16,14.16 17.21,14.26C17.27,14.37 17.25,14.87 17,15.44C16.8,16 15.76,16.54 15.3,16.56C14.84,16.58 14.83,16.92 12.34,15.83C9.85,14.74 8.35,12.08 8.23,11.91C8.11,11.74 7.27,10.53 7.31,9.3C7.36,8.08 8,7.5 8.26,7.26C8.5,7 8.77,6.97 8.94,7H9.41C9.56,7 9.77,6.94 9.96,7.45L10.65,9.32C10.71,9.45 10.75,9.6 10.66,9.76L10.39,10.17L10,10.59C9.88,10.71 9.74,10.84 9.88,11.09C10,11.35 10.5,12.18 11.2,12.87C12.11,13.75 12.91,14.04 13.15,14.17C13.39,14.31 13.54,14.29 13.69,14.13L14.5,13.19C14.69,12.94 14.85,13 15.08,13.08L16.75,13.96M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C10.03,22 8.2,21.43 6.65,20.45L2,22L3.55,17.35C2.57,15.8 2,13.97 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12C4,13.72 4.54,15.31 5.46,16.61L4.5,19.5L7.39,18.54C8.69,19.46 10.28,20 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4Z'></path> </svg> </a> <a aria-label='telegram' class='telegram' href='https://t.me/share/url?url=https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html&text=Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser' rel='nofollow noreferrer' target='_blank' title='telegram'> <svg viewBox='0 0 24 24'> <path d='M19.4 3.717l-17.73 6.837c-1.21.486-1.203 1.161-.222 1.462l4.552 1.42l10.532-6.645c.498-.303.953-.14.579.192l-8.533 7.701h-.002l.002.001l-.314 4.692c.46 0 .663-.211.921-.46l2.211-2.15l4.599 3.397c.848.467 1.457.227 1.668-.785l3.019-14.228c.309-1.239-.473-1.8-1.282-1.434z'></path> </svg> </a> </div> </div> <div id='ms-related-post'></div> <script> var postLabels = ["Bootstrap 4", "Css", "Javascript", "Jquery", "Twitter Bootstrap", ]; var relatedConfig = { postUrl: "https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html", homePageUrl: "https://griddle-reviews.blogspot.com/", relatedTitleText: "You may like these posts", }; </script> <div id='ms-matched-content'></div> <script> //<![CDATA[ // related post js from www.dte.web.id modified by sugeng.id !function(){var e,b={relatedTitleOuterOpen:'<div class="related-title"><p class="ms-title">',relatedTitleOuterClose:"</p></div>",relatedTitleText:"Artikel Terkait",thumbWidth:192,thumbHeight:108,imgBlank:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAJCAYAAAA7KqwyAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAD6AAAA+gBtXtSawAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAAYSURBVCiRY0xISOBgoAAwUaJ51IBhYwAAuQABOsYCprwAAAAASUVORK5CYII=",relatedOuter:"ms-related-post"};for(e in relatedConfig)"undefined"!=relatedConfig[e]&&(b[e]=relatedConfig[e]);function t(e){var t=document.createElement("script");t.src=e,document.getElementsByTagName("head")[0].appendChild(t)}function v(e){var t,l,a=e.length;if(0===a)return!1;for(;--a;)t=Math.floor(Math.random()*(a+1)),l=e[a],e[a]=e[t],e[t]=l;return e}var B={relatedPosts:!0,jumlahRelatedPosts:4,relatedPostsThumb:!0,judulRelatedPosts:b.relatedTitleText,relatedPostsNoThumbImg:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbF6A-8FlbXts0iX_ky7la1bRimAsslXEEmeeMEeiGRmBDf0il2a911daHmlWjelh_W844m_WVHbZKwJRWJFMY4hgoSbW2CbYI5GyfnZbMae-xmfXxJbWjQ677_XbbzKmVgwqGiKY_3k8/w192-h108-n-k-rw-no-nu/nomage+%25281%2529.png"},l=(optionLinkMagz(B),"object"==typeof postLabels&&0<postLabels.length?"/-/"+v(postLabels)[0]:"");l=l.replace("&","&"),msRelatedPosts=function(e){var t,l,a,s,r,d,o,n,i=b.relatedTitleOuterOpen+B.judulRelatedPosts+b.relatedTitleOuterClose,A=document.getElementById(b.relatedOuter),m=v(e.feed.entry);i+=1==B.relatedPostsThumb?'<ul class="ms-related-hasthumb">':'<ul class="ms-related-nothumb">';for(var u=0;u<m.length;u++)for(var h=0,c=m[u].link.length;h<c;h++)m[u].link[h].href==b.postUrl&&m.splice(u,1);if(0<m.length){for(var g=0;g<B.jumlahRelatedPosts&&g<m.length;g++){l=m[g].title.$t,void 0!==m[g].content&&(r=(s=m[g].content.$t).indexOf("<img",0));function f(e){a=e.replace(/.*?:\/\//g,"//").replace(/s72-(c|.*?-c)/,"w"+b.thumbWidth+"-h"+b.thumbHeight+"-c-rw")}"media$thumbnail"in m[g]?f(m[g].media$thumbnail.url):void 0!==r&&-1!==r?(d=s.indexOf("/>",r),o=(d=s.slice(r,d)).indexOf("src=",0)+5,n=d.indexOf('"',o),f(d.slice(o,n))):a=B.relatedPostsNoThumbImg;for(var p=0,c=m[g].link.length;p<c;p++)t="alternate"==m[g].link[p].rel?m[g].link[p].href:"#";i+='<li><a title="'+l+'" href="'+t+'">'+(1==B.relatedPostsThumb?'<div class="related-thumb-outer"><img alt="'+l+'" class="related-thumb" src="'+a+'" width="'+b.thumbWidth+'" height="'+b.thumbHeight+'"></div>':"")+('<div class="related-title-outer">'+l+"</div>")+"</a></li>"}1==B.relatedPosts&&(A.innerHTML=i+="</ul>")}},msRandomIndex=function(e){e=e.feed.openSearch$totalResults.$t-(B.jumlahRelatedPosts+1),e=1<e?1+Math.floor(Math.random()*e):1;t(b.homePageUrl.replace(/\/$/,"")+"/feeds/posts/default"+l+"?alt=json-in-script&orderby=updated&start-index="+e+"&max-results="+(B.jumlahRelatedPosts+1)+"&callback=msRelatedPosts")},t(b.homePageUrl.replace(/\/$/,"")+"/feeds/posts/summary"+l+"?alt=json-in-script&orderby=updated&max-results=0&callback=msRandomIndex")}(); function fullwidthImg(){var t=document.querySelector(".post-body img"),l=document.querySelector(".post-body > .tr-caption-container");l?l.classList.add("fullwidth"):t&&t.classList.add("fullwidth")}!function(){var t={fullwidthImage:!0};optionLinkMagz(t),1==t.fullwidthImage&&fullwidthImg()}(); //]]> </script> </div> <section class='comments comments-non-threaded embed' data-num-comments='0' id='comments'> <a name='comments'></a> <h2 class='comments-title'> Post a Comment for "Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser" </h2> <div id='Blog1_comments-block-wrapper'> </div> <div class='comment-footer'> <div class='comment-form default-comment-form'> <a name='comment-form'></a> <a aria-label='comment form' href='https://www.blogger.com/comment/frame/3974626855444907067?po=3289081708000043903&hl=en&saa=47563&skin=contempo' id='comment-editor-src'></a> <iframe allowtransparency='allowtransparency' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410px' id='comment-editor' name='comment-editor' src='' title='comment-editor' width='100%'></iframe> <script src='https://www.blogger.com/static/v1/jsbin/1839367302-comment_from_post_iframe.js' type='text/javascript'></script> <script> BLOG_CMT_createIframe('https://www.blogger.com/rpc_relay.html'); </script> </div> </div> </section> </article> </div> </div></div> <div class='iklan-atas section' id='iklan-atas'><div class='widget HTML' data-version='2' id='HTML76'> <div class='widget-content kode-iklan-atas'> <script type="text/javascript"> atOptions = { 'key' : '365d5ac5cd4e9ff093a5907e9ad650e2', 'format' : 'iframe', 'height' : 250, 'width' : 300, 'params' : {} }; document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://resentproduces.com/365d5ac5cd4e9ff093a5907e9ad650e2/invoke.js"></scr' + 'ipt>'); </script> </div> </div></div> <div class='iklan-tengah1 section' id='iklan-tengah1'><div class='widget HTML' data-version='2' id='HTML77'> <div class='widget-content kode-iklan-tengah'> <script type="text/javascript"> atOptions = { 'key' : 'edd748cb9b42467680df52aa8ab2d846', 'format' : 'iframe', 'height' : 60, 'width' : 468, 'params' : {} }; document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://resentproduces.com/edd748cb9b42467680df52aa8ab2d846/invoke.js"></scr' + 'ipt>'); </script> </div> </div></div> <div class='iklan-tengah2 section' id='iklan-tengah2'><div class='widget HTML' data-version='2' id='HTML78'> <div class='widget-content kode-iklan-tengah'> <script type="text/javascript"> atOptions = { 'key' : 'edd748cb9b42467680df52aa8ab2d846', 'format' : 'iframe', 'height' : 60, 'width' : 468, 'params' : {} }; document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://resentproduces.com/edd748cb9b42467680df52aa8ab2d846/invoke.js"></scr' + 'ipt>'); </script> </div> </div></div> <div class='iklan-bawah section' id='iklan-bawah'><div class='widget HTML' data-version='2' id='HTML79'> <div class='widget-content kode-iklan-bawah'> <script type="text/javascript"> atOptions = { 'key' : '63a77c42756762736b0155173bf1a66d', 'format' : 'iframe', 'height' : 50, 'width' : 320, 'params' : {} }; document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://resentproduces.com/63a77c42756762736b0155173bf1a66d/invoke.js"></scr' + 'ipt>'); </script> </div> </div></div> <div class='matched-content section' id='matched-content'><div class='widget HTML' data-version='2' id='HTML939'> <div class='widget-content kode-matched-content'> </div> </div></div> <script>//<![CDATA[ function LMmiddleAds(a){function e(e,n,l){function t(e,n){void 0!==n&&n.parentNode.insertBefore(e,n.nextSibling)}if(1<d.length){null!=e&&"\n"!=e.innerHTML&&t(e,null!==n?n:d[l]);for(var i,r=a.querySelectorAll(".post-body-artikel .kode-iklan-tengah"),o=0;o<r.length;o++)null!==(i=r[o].previousElementSibling)&&"BR"===i.tagName&&(i.style.display="none")}else e.parentNode.removeChild(e)}var n=a.querySelector(".post-body"),d=n.querySelectorAll("div > br, span > br, div > p, span > p"),l=Math.ceil(.2*d.length),t=Math.ceil(.7*d.length),i=a.querySelector("#iklan-tengah1 .widget-content"),r=a.querySelector("#iklan-tengah2 .widget-content"),o=a.querySelector("#iklan-atas .widget-content"),c=a.querySelector("#iklan-bawah .widget-content"),u=n.querySelector("#iklan1"),g=n.querySelector("#iklan2");null!=o&&"\n"!=o.innerHTML&&n.insertBefore(o,n.childNodes[0]),null!=c&&"\n"!=c.innerHTML&&n.appendChild(c);e(i,u,l),e(r,g,t)}LMmiddleAds(document); function matchedAds(){var e,n,t={iklanMatched:!0};optionLinkMagz(t),e=document.querySelector("#ms-matched-content"),n=document.querySelector("#matched-content .widget-content"),null!=e?1==t.iklanMatched&&null!=n&&"\n"!=n.innerHTML&&e.appendChild(n):n.parentNode.removeChild(n)}matchedAds(); //]]> </script> </section> <aside id='sidebar-wrap'> <div class='sidebar section' id='sidebar'><div class='widget HTML' data-version='2' id='HTML1'> <div class='widget-content'> <script type="text/javascript"> atOptions = { 'key' : 'b3cbedc3153259c38733a80008471667', 'format' : 'iframe', 'height' : 600, 'width' : 160, 'params' : {} }; document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://resentproduces.com/b3cbedc3153259c38733a80008471667/invoke.js"></scr' + 'ipt>'); </script> </div> </div><div class='widget PopularPosts' data-version='2' id='PopularPosts1'> <div class='popular-post-widget-title'> <h2 class='title'>Top Question</h2> </div> <div class='widget-content'> <div class='popular-posts-wrap'> <div class='the-most-popular'> <div class='popular-post-thumbnail'> <a href='https://griddle-reviews.blogspot.com/2022/09/creating-popup-window-with-form-content.html'> <img alt='Image' class='lazyload' data-src='//1.bp.blogspot.com/-sLMytth04W8/XtoBMx9lUjI/AAAAAAAAHmM/zK-toM5XTacePvBHnpIO_tfzjg63BD3ZgCK4BGAsYHg/w300-h168-p-k-no-nu/nomage%2B%25281%2529.png' height='169' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAJCAYAAAA7KqwyAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAD6AAAA+gBtXtSawAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAAYSURBVCiRY0xISOBgoAAwUaJ51IBhYwAAuQABOsYCprwAAAAASUVORK5CYII=' width='300'/> <div class='lazy-loading'></div> </a> </div> <div class='popular-post-info info-has-thumbnail'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2022/09/creating-popup-window-with-form-content.html'> Creating Popup Window With Form Content And Then Show Output In Parent Page And Send To Database </a> </p> <div class='popular-post-snippet'> I have a table and in of it's column I want user when c… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2023/02/get-value-of-checked-radio-button.html'> Get The Value Of Checked Radio Button Without Re-selecting The Buttons </a> </p> <div class='popular-post-snippet'> So I am getting some buttons as follows: var reportFilterBu… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2022/08/jquery-val-is-undefined.html'> JQuery Val Is Undefined? </a> </p> <div class='popular-post-snippet'> I have this code: But when i write $('#editorT Sol… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2023/01/onsubmit-method-doesnt-stop-submit.html'> Onsubmit Method Doesn't Stop Submit </a> </p> <div class='popular-post-snippet'> My onsubmit is not working. My idea was to put some mandato… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2023/01/too-much-recursion-error-when-calling.html'> "too Much Recursion" Error When Calling JSON.stringify On A Large Object With Circular Dependencies </a> </p> <div class='popular-post-snippet'> I have an object that contains circular references, and I w… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2023/12/configuring-any-cdn-to-deliver-only-one.html'> Configuring Any Cdn To Deliver Only One File No Matter What Url Has Been Requested </a> </p> <div class='popular-post-snippet'> I am currently working on a new project where the entire pa… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2023/02/display-modal-form-before-user-leaves.html'> Display Modal Form Before User Leaves Page </a> </p> <div class='popular-post-snippet'> I've used window.onbeforeunload to display a custom mes… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2022/06/how-to-to-insert-tradingview-widget.html'> How To To Insert TradingView Widget Into React Js Which Is In Script Tag Link: Https://www.tradingview.com/widget/market-overview/ </a> </p> <div class='popular-post-snippet'> export default class extends Component { render() { … </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2022/06/react-mobx-store-return-proxy-object.html'> React Mobx - Store Return Proxy Object </a> </p> <div class='popular-post-snippet'> I have the following state class: import { observable, acti… </div> </div> </div> <div class='popular-post-content'> <div class='popular-post-info'> <p class='popular-post-title'> <a href='https://griddle-reviews.blogspot.com/2024/10/angular-cant-export-excel-using-exceljs.html'> Angular : Can't Export Excel Using Exceljs - Error Ts2307: Cannot Find Module 'stream' - Error Ts2503: Cannot Find Namespace 'nodejs' </a> </p> <div class='popular-post-snippet'> I was try to export an excel file using ExcelJS Here is my … </div> </div> </div> </div> </div> </div></div> <div class='sidebar-sticky section' id='sidebar-sticky'><div class='widget BlogArchive' data-version='2' id='BlogArchive1'> <div class='widget-content'> <div id='ArchiveList'> <div id='BlogArchive1_ArchiveList'> <div class='archive-flat'> <ul> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/12/'> December 2024 <span class='post-count'>(1)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/11/'> November 2024 <span class='post-count'>(39)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/10/'> October 2024 <span class='post-count'>(73)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/09/'> September 2024 <span class='post-count'>(25)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/08/'> August 2024 <span class='post-count'>(378)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/07/'> July 2024 <span class='post-count'>(341)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/06/'> June 2024 <span class='post-count'>(721)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/05/'> May 2024 <span class='post-count'>(1296)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/04/'> April 2024 <span class='post-count'>(820)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/03/'> March 2024 <span class='post-count'>(1581)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/02/'> February 2024 <span class='post-count'>(1732)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2024/01/'> January 2024 <span class='post-count'>(1395)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/12/'> December 2023 <span class='post-count'>(1450)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/11/'> November 2023 <span class='post-count'>(435)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/10/'> October 2023 <span class='post-count'>(620)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/09/'> September 2023 <span class='post-count'>(278)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/08/'> August 2023 <span class='post-count'>(336)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/07/'> July 2023 <span class='post-count'>(264)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/06/'> June 2023 <span class='post-count'>(355)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/05/'> May 2023 <span class='post-count'>(201)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/04/'> April 2023 <span class='post-count'>(121)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/03/'> March 2023 <span class='post-count'>(153)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/02/'> February 2023 <span class='post-count'>(182)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2023/01/'> January 2023 <span class='post-count'>(245)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/12/'> December 2022 <span class='post-count'>(126)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/11/'> November 2022 <span class='post-count'>(241)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/10/'> October 2022 <span class='post-count'>(177)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/09/'> September 2022 <span class='post-count'>(165)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/08/'> August 2022 <span class='post-count'>(482)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/07/'> July 2022 <span class='post-count'>(287)</span> </a> </li> <li class='archivedate'> <a href='https://griddle-reviews.blogspot.com/2022/06/'> June 2022 <span class='post-count'>(249)</span> </a> </li> </ul> </div> </div> </div> </div> </div></div> </aside> </main> <div id='footer-widget-html-wrap'> <div class='footer-widget-html section' id='footer-widget-html'><div class='widget HTML' data-version='2' id='HTML831'> </div></div> </div> <footer id='footer-outer'> <div id='footer-content'> <div class='page-navmenu section' id='page-navmenu'><div class='widget PageList' data-version='2' id='PageList1'> <div class='normalwidget-title'> <h2 class='title'>Menu Halaman Statis</h2> </div> <div class='widget-content'> <ul> <li> <a href='https://griddle-reviews.blogspot.com/'>Beranda</a> </li> </ul> </div> </div></div> <div class='footer-text section' id='footer-text'><div class='widget HTML' data-version='2' id='HTML80'> <div class='footer-text'> © 2022 - <a href='https://griddle-reviews.blogspot.com/'>JavaScript Download </a> </div> </div></div> <div class='navbarrr section' id='navbarrr'><div class='widget Navbar' data-version='2' id='Navbar1'><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/platform.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar/3974626855444907067?po\x3d3289081708000043903\x26origin\x3dhttps://griddle-reviews.blogspot.com', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script><script type="text/javascript"> (function() { var script = document.createElement('script'); script.type = 'text/javascript'; script.src = '//pagead2.googlesyndication.com/pagead/js/google_top_exp.js'; var head = document.getElementsByTagName('head')[0]; if (head) { head.appendChild(script); }})(); </script> </div></div> </div> </footer> <a aria-label='Go To Top' href='#' id='goTop'> </a> <script> //<![CDATA[ /*! smooth-scroll js from Chris Ferdinandi (http://github.com/cferdinandi/smooth-scroll) */ !function(e,t){"function"==typeof define&&define.amd?define([],function(){return t(e)}):"object"==typeof exports?module.exports=t(e):e.SmoothScroll=t(e)}("undefined"!=typeof global?global:"undefined"!=typeof window?window:this,function(E){"use strict";function b(){var n={};return Array.prototype.forEach.call(arguments,function(e){for(var t in e){if(!e.hasOwnProperty(t))return;n[t]=e[t]}}),n}function i(e){"#"===e.charAt(0)&&(e=e.substr(1));for(var t,n=String(e),o=n.length,a=-1,r="",i=n.charCodeAt(0);++a<o;){if(0===(t=n.charCodeAt(a)))throw new InvalidCharacterError("Invalid character: the input contains U+0000.");r+=1<=t&&t<=31||127==t||0===a&&48<=t&&t<=57||1===a&&48<=t&&t<=57&&45===i?"\\"+t.toString(16)+" ":128<=t||45===t||95===t||48<=t&&t<=57||65<=t&&t<=90||97<=t&&t<=122?n.charAt(a):"\\"+n.charAt(a)}return"#"+r}function O(){return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight,document.body.offsetHeight,document.documentElement.offsetHeight,document.body.clientHeight,document.documentElement.clientHeight)}function I(e,t,n,o){t.emitEvents&&"function"==typeof E.CustomEvent&&(t=new CustomEvent(e,{bubbles:!0,detail:{anchor:n,toggle:o}}),document.dispatchEvent(t))}var M={ignore:"[data-scroll-ignore]",header:null,topOnEmptyHash:!0,speed:500,speedAsDuration:!1,durationMax:null,durationMin:null,clip:!0,offset:0,easing:"easeInOutCubic",customEasing:null,updateURL:!0,popstate:!0,emitEvents:!0};return function(a,e){function t(e){if(!e.defaultPrevented&&!(0!==e.button||e.metaKey||e.ctrlKey||e.shiftKey)&&"closest"in e.target&&(r=e.target.closest(a))&&"a"===r.tagName.toLowerCase()&&!e.target.closest(g.ignore)&&r.hostname===E.location.hostname&&r.pathname===E.location.pathname&&/#/.test(r.href)){var t;try{n=i(decodeURIComponent(r.hash))}catch(e){n=i(r.hash)}if("#"===n){if(!g.topOnEmptyHash)return;t=document.documentElement}else t=document.querySelector(n);(t=t||"#top"!==n?t:document.documentElement)&&(e.preventDefault(),n=g,history.replaceState&&n.updateURL&&!history.state&&(o=(o=E.location.hash)||"",history.replaceState({smoothScroll:JSON.stringify(n),anchor:o||E.pageYOffset},document.title,o||E.location.href)),v.animateScroll(t,r))}var n,o}function n(e){var t;null===history.state||!history.state.smoothScroll||history.state.smoothScroll!==JSON.stringify(g)||"string"==typeof(t=history.state.anchor)&&t&&!(t=document.querySelector(i(history.state.anchor)))||v.animateScroll(t,null,{updateURL:!1})}var g,r,y,S,v={cancelScroll:function(e){cancelAnimationFrame(S),S=null,e||I("scrollCancel",g)}};v.animateScroll=function(o,a,e){v.cancelScroll();var r,i,s,c,u,l,d,f,m,t,h=b(g||M,e||{}),p="[object Number]"===Object.prototype.toString.call(o),e=p||!o.tagName?null:o;(p||e)&&(r=E.pageYOffset,h.header&&!y&&(y=document.querySelector(h.header)),t=(t=y)?parseInt(E.getComputedStyle(t).height,10)+t.offsetTop:0,c=p?o:function(e,t,n,o){var a=0;if(e.offsetParent)for(;a+=e.offsetTop,e=e.offsetParent;);return a=Math.max(a-t-n,0),a=o?Math.min(a,O()-E.innerHeight):a}(e,t,parseInt("function"==typeof h.offset?h.offset(o,a):h.offset,10),h.clip),u=c-r,l=O(),d=0,t=(e=h).speedAsDuration?e.speed:Math.abs(u/1e3*e.speed),f=e.durationMax&&t>e.durationMax?e.durationMax:e.durationMin&&t<e.durationMin?e.durationMin:parseInt(t,10),m=function(e){var t,n;d+=e-(i=i||e),s=r+u*(t=s=1<(s=0===f?0:d/f)?1:s,"easeInQuad"===h.easing&&(n=t*t),"easeOutQuad"===h.easing&&(n=t*(2-t)),"easeInOutQuad"===h.easing&&(n=t<.5?2*t*t:(4-2*t)*t-1),"easeInCubic"===h.easing&&(n=t*t*t),"easeOutCubic"===h.easing&&(n=--t*t*t+1),"easeInOutCubic"===h.easing&&(n=t<.5?4*t*t*t:(t-1)*(2*t-2)*(2*t-2)+1),"easeInQuart"===h.easing&&(n=t*t*t*t),"easeOutQuart"===h.easing&&(n=1- --t*t*t*t),"easeInOutQuart"===h.easing&&(n=t<.5?8*t*t*t*t:1-8*--t*t*t*t),"easeInQuint"===h.easing&&(n=t*t*t*t*t),"easeOutQuint"===h.easing&&(n=1+--t*t*t*t*t),"easeInOutQuint"===h.easing&&(n=t<.5?16*t*t*t*t*t:1+16*--t*t*t*t*t),(n=h.customEasing?h.customEasing(t):n)||t),E.scrollTo(0,Math.floor(s)),function(e,t){var n=E.pageYOffset;if(e==t||n==t||(r<t&&E.innerHeight+n)>=l)return v.cancelScroll(!0),e=t,n=p,0===(t=o)&&document.body.focus(),n||(t.focus(),document.activeElement!==t&&(t.setAttribute("tabindex","-1"),t.focus(),t.style.outline="none"),E.scrollTo(0,e)),I("scrollStop",h,o,a),!(S=i=null)}(s,c)||(S=E.requestAnimationFrame(m),i=e)},0===E.pageYOffset&&E.scrollTo(0,0),e=o,p||history.pushState&&h.updateURL&&history.pushState({smoothScroll:JSON.stringify(h),anchor:e.id},document.title,e===document.documentElement?"#top":"#"+e.id),"matchMedia"in E&&E.matchMedia("(prefers-reduced-motion)").matches?E.scrollTo(0,Math.floor(c)):(I("scrollStart",h,o,a),v.cancelScroll(!0),E.requestAnimationFrame(m)))};if(v.destroy=function(){g&&(document.removeEventListener("click",t,!1),E.removeEventListener("popstate",n,!1),v.cancelScroll(),S=y=r=g=null)},"querySelector"in document&&"addEventListener"in E&&"requestAnimationFrame"in E&&"closest"in E.Element.prototype)return v.destroy(),g=b(M,e||{}),y=g.header?document.querySelector(g.header):null,document.addEventListener("click",t,!1),g.updateURL&&g.popstate&&E.addEventListener("popstate",n,!1),v;throw"Smooth Scroll: This browser does not support the required JavaScript methods and browser APIs."}}); var LMstickyMenu=function(){var t=document.querySelector("#header-outer").getBoundingClientRect().height,n=document.querySelector("#navmenu-wrap-sticky"),e=document.querySelector(".nav-copy"),i=document.querySelector(".nav-original"),r=document.querySelector(".sidebar-sticky");stickyClass="navsticky-show",null!=i&&(e.innerHTML=i.innerHTML);null!=i&&(window.addEventListener("resize",function(){t=document.querySelector("#header-outer").getBoundingClientRect().height}),window.addEventListener("scroll",function(){var e=Math.round(window.pageYOffset);t<=e?n.classList.add(stickyClass):n.classList.remove(stickyClass)})),null!=r&&(r.style.top="88px");for(var c=document.querySelectorAll(".menu-sticky a"),o=0;o<c.length;o++)c[o].setAttribute("tabindex","-1")};!function(){var e={menuSticky:!0};optionLinkMagz(e),1==e.menuSticky&&LMstickyMenu()}(); function LMmobileMenu(){function e(e){e.preventDefault,i.classList.add(o)}for(var n=document.querySelector(".navmenu-content"),t=document.querySelector("#navmenu-sidebar-body"),u=document.querySelectorAll(".navmenu-button"),l=document.querySelector("#navmenu-overlay"),s=document.querySelector("#navmenu-sidebar-closebtn"),i=document.querySelector("#navmenu"),o="navmenu-activated",r=(null!==n&&(t.innerHTML=n.innerHTML),0);r<u.length;r++)u[r].addEventListener("click",e);function c(e){e.preventDefault,i.classList.remove(o)}null!==l&&l.addEventListener("click",c),null!==s&&s.addEventListener("click",c)}function LMmobileMenuSubMenu(){"use strict";for(var e=document.querySelectorAll("#navmenu-sidebar-body li.has-sub"),n=function(e){var n=this.nextElementSibling,t=n.scrollHeight;n.clientHeight?(n.style.height="0px",this.classList.remove("ms-submenu-shown")):(n.style.height=t+"px",this.classList.add("ms-submenu-shown"))},t=0;t<e.length;t++){u=void 0,(u=document.createElement("span")).setAttribute("class","ms-submenu-button");var u,l=e[t].querySelector("ul");e[t].insertBefore(u,e[t].lastElementChild),l&&(l.style.height="0",l.style.overflow="hidden"),u.addEventListener("click",n)}}LMmobileMenu(),LMmobileMenuSubMenu(); function LMsearchForm(){for(var n=document.getElementById("searchcontainer"),t=document.getElementById("search-terms"),e=document.querySelectorAll(".iconsearch-label"),c=0;c<e.length;c++)e[c].addEventListener("click",function(e){n.classList.toggle("opensearch"),n.classList.contains("opensearch")||(t.blur(),e.preventDefault()),e.stopPropagation()},!1);t.addEventListener("click",function(e){e.stopPropagation()},!1),document.addEventListener("click",function(e){n.classList.remove("opensearch"),t.blur(),e.stopPropagation()},!1),document.addEventListener("keydown",function(e){"Escape"==e.key&&(n.classList.remove("opensearch"),t.blur())})}LMsearchForm(); function LMcheckCheckbox(){for(var e=document.querySelectorAll(".checkbox"),o=0;o<e.length;o++)"darkmode"===localStorage.getItem("mode")?e[o].checked=!0:e[o].checked=!1}function darkMode(){localStorage.setItem("mode","darkmode"===localStorage.getItem("mode")?"light":"darkmode"),"darkmode"===localStorage.getItem("mode")?document.querySelector("body").classList.add("darkmode"):document.querySelector("body").classList.remove("darkmode"),LMcheckCheckbox()}LMcheckCheckbox(); !function(){var e=document.querySelectorAll(".darkmode-switch"),o={tombolDarkmode:!0};if(optionLinkMagz(o),0==o.tombolDarkmode)for(var l=0;l<e.length;l++)e[l].parentNode.removeChild(e[l]);else for(l=0;l<e.length;l++)e[l].style.display="flex"}(); var LMScrollTop=function(){var o=document.querySelector("#goTop");window.addEventListener("scroll",function(){300<=window.pageYOffset?o.classList.add("is-visible"):o.classList.remove("is-visible")})};!function(){var o={scrollToTop:!0};optionLinkMagz(o),1==o.scrollToTop&&LMScrollTop()}(); !function(){var r,e=document.querySelector(".featured-img-bg");function t(e){let t=r.getAttribute(e);t&&(t=t.replace(/-p-k-no-nu/g,"-c-rw"),r.setAttribute(e,t))}e&&(r=e.querySelector("img"),t("data-src"),t("srcset"))}(); //]]> //<![CDATA[ /* TOC js from www.cssscript.com/generating-a-table-of-contents-with-pure-javascript-toc */ !function(e){function t(e){var t=(e=function(e,t){for(var n in t)t.hasOwnProperty(n)&&t[n]&&(e[n]=t[n]);return e}({selector:"h1, h2, h3, h4, h5, h6",scope:"body",overwrite:!1,prefix:"toc"},e)).selector;if("string"!=typeof t)throw new TypeError("selector must be a string");if(!t.match(/^(?:h[1-6],?\s*)*$/g))throw new TypeError("selector must contains only h1-6");var n,c,l,a,o=location.hash;return o&&setTimeout(function(){location.hash="",location.hash=o},0),e=(t=e).selector,n=t.scope,c=document.createElement("ol"),l=c,a=i(t.overwrite,t.prefix),r(e,n).reduce(function(e,t,n){var o=u(t.tagName),e=d(l,o-e)||c,r=document.createElement("li"),i=document.createElement("a");return a(t,i,n),e.appendChild(r).appendChild(i),l=r,o},u(e)),c}var r=function(t,e){var n=[],e=document.querySelectorAll(e);return Array.prototype.forEach.call(e,function(e){e=e.querySelectorAll(t);n=n.concat(Array.prototype.slice.call(e))}),n},u=function(e){if("string"!=typeof e)return 0;e=e.match(/\d/g);return e?Math.min.apply(null,e):1},d=function(e,t){if(t<0)return d(e.parentElement,t+1);if(0<t){for(var n=e,o=t;o--;){var r=document.createElement("ol");n.appendChild(r),n=r}return n}return e.parentElement},i=function(o,r){return function(e,t,n){e.textContent;n=r+"-"+n,t.textContent=e.textContent,n=!o&&e.id||n,n=encodeURIComponent(n);e.id=n,t.href="#"+n}};"function"==typeof define&&define.amd?define("toc",[],function(){return t}):e.initTOC=t}(window);var aside=document.getElementById("toc"),toc=initTOC({selector:"h2, h3",scope:".post-body"});function tocShowHide(){var t={tocHide:!0,showText:"(show)",hideText:"(hide)"},e=(optionLinkMagz(t),document.querySelector(".toc")),n=document.createElement("button"),o=document.querySelector("#toc ol");e.appendChild(n),o.style.height="0",o.style.overflow="hidden",n.innerHTML=t.showText,n.addEventListener("click",function(){var e=o.scrollHeight;o.clientHeight?(o.style.height="0",n.innerHTML=t.showText):(o.style.height=e+"px",n.innerHTML=t.hideText)})}function tocOption(){var e=document.querySelector(".toc"),t={judulTOC:"Daftar Isi",showHideTOC:!0};optionLinkMagz(t),null!=e&&(e.innerHTML=t.judulTOC),tocShowHide()}null!=aside&&(aside.appendChild(toc),tocOption()); //]]> //<![CDATA[ Defer.dom("img.lazyload",100,"loaded",null,{rootMargin:"1px"}),"undefined"!=typeof infinite_scroll&&infinite_scroll.on("load",function(){Defer.dom("img.lazyload",100,"loaded",null,{rootMargin:"1px"})});var scroll=new SmoothScroll('a[href*="#"]',{speed:600,speedAsDuration:!0,easing:"easeInOutCubic"}); //]]> </script> <div class='custom-javascript-footer section' id='custom-javascript-footer'><div class='widget HTML' data-version='2' id='HTML85'> </div></div> <script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/3131230167-widgets.js"></script> <script type='text/javascript'> window['__wavt'] = 'AOuZoY75iN0sJyKcxMnZI7b4DtHkk5BPkw:1746444455591';_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d3974626855444907067','//griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html','3974626855444907067'); _WidgetManager._SetDataContext([{'name': 'blog', 'data': {'blogId': '3974626855444907067', 'title': 'JavaScript Download ', 'url': 'https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html', 'canonicalUrl': 'https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html', 'homepageUrl': 'https://griddle-reviews.blogspot.com/', 'searchUrl': 'https://griddle-reviews.blogspot.com/search', 'canonicalHomepageUrl': 'https://griddle-reviews.blogspot.com/', 'blogspotFaviconUrl': 'https://griddle-reviews.blogspot.com/favicon.ico', 'bloggerUrl': 'https://www.blogger.com', 'hasCustomDomain': false, 'httpsEnabled': true, 'enabledCommentProfileImages': true, 'gPlusViewType': 'FILTERED_POSTMOD', 'adultContent': false, 'analyticsAccountNumber': '', 'encoding': 'UTF-8', 'locale': 'en', 'localeUnderscoreDelimited': 'en', 'languageDirection': 'ltr', 'isPrivate': false, 'isMobile': false, 'isMobileRequest': false, 'mobileClass': '', 'isPrivateBlog': false, 'isDynamicViewsAvailable': true, 'feedLinks': '\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22JavaScript Download - Atom\x22 href\x3d\x22https://griddle-reviews.blogspot.com/feeds/posts/default\x22 /\x3e\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/rss+xml\x22 title\x3d\x22JavaScript Download - RSS\x22 href\x3d\x22https://griddle-reviews.blogspot.com/feeds/posts/default?alt\x3drss\x22 /\x3e\n\x3clink rel\x3d\x22service.post\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22JavaScript Download - Atom\x22 href\x3d\x22https://www.blogger.com/feeds/3974626855444907067/posts/default\x22 /\x3e\n\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22JavaScript Download - Atom\x22 href\x3d\x22https://griddle-reviews.blogspot.com/feeds/3289081708000043903/comments/default\x22 /\x3e\n', 'meTag': '', 'adsenseHostId': 'ca-host-pub-1556223355139109', 'adsenseHasAds': true, 'adsenseAutoAds': false, 'boqCommentIframeForm': true, 'loginRedirectParam': '', 'view': '', 'dynamicViewsCommentsSrc': '//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js', 'dynamicViewsScriptSrc': '//www.blogblog.com/dynamicviews/a558aeb4ec2c6340', 'plusOneApiSrc': 'https://apis.google.com/js/platform.js', 'disableGComments': true, 'interstitialAccepted': false, 'sharing': {'platforms': [{'name': 'Get link', 'key': 'link', 'shareMessage': 'Get link', 'target': ''}, {'name': 'Facebook', 'key': 'facebook', 'shareMessage': 'Share to Facebook', 'target': 'facebook'}, {'name': 'BlogThis!', 'key': 'blogThis', 'shareMessage': 'BlogThis!', 'target': 'blog'}, {'name': 'X', 'key': 'twitter', 'shareMessage': 'Share to X', 'target': 'twitter'}, {'name': 'Pinterest', 'key': 'pinterest', 'shareMessage': 'Share to Pinterest', 'target': 'pinterest'}, {'name': 'Email', 'key': 'email', 'shareMessage': 'Email', 'target': 'email'}], 'disableGooglePlus': true, 'googlePlusShareButtonWidth': 0, 'googlePlusBootstrap': '\x3cscript type\x3d\x22text/javascript\x22\x3ewindow.___gcfg \x3d {\x27lang\x27: \x27en\x27};\x3c/script\x3e'}, 'hasCustomJumpLinkMessage': false, 'jumpLinkMessage': 'Read more', 'pageType': 'item', 'postId': '3289081708000043903', 'pageName': 'Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser', 'pageTitle': 'JavaScript Download : Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser'}}, {'name': 'features', 'data': {}}, {'name': 'messages', 'data': {'edit': 'Edit', 'linkCopiedToClipboard': 'Link copied to clipboard!', 'ok': 'Ok', 'postLink': 'Post Link'}}, {'name': 'template', 'data': {'name': 'custom', 'localizedName': 'Custom', 'isResponsive': true, 'isAlternateRendering': false, 'isCustom': true}}, {'name': 'view', 'data': {'classic': {'name': 'classic', 'url': '?view\x3dclassic'}, 'flipcard': {'name': 'flipcard', 'url': '?view\x3dflipcard'}, 'magazine': {'name': 'magazine', 'url': '?view\x3dmagazine'}, 'mosaic': {'name': 'mosaic', 'url': '?view\x3dmosaic'}, 'sidebar': {'name': 'sidebar', 'url': '?view\x3dsidebar'}, 'snapshot': {'name': 'snapshot', 'url': '?view\x3dsnapshot'}, 'timeslide': {'name': 'timeslide', 'url': '?view\x3dtimeslide'}, 'isMobile': false, 'title': 'Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser', 'description': 'The form below contains a Bootstrap toggle button group that uses checkboxes. I need to listen for click events on the checkbox inputs. Exam...', 'url': 'https://griddle-reviews.blogspot.com/2023/12/onclick-for-bootstrap-btn-group.html', 'type': 'item', 'isSingleItem': true, 'isMultipleItems': false, 'isError': false, 'isPage': false, 'isPost': true, 'isHomepage': false, 'isArchive': false, 'isLabelSearch': false, 'postId': 3289081708000043903}}, {'name': 'widgets', 'data': [{'title': 'Kode Pengaturan Template', 'type': 'HTML', 'sectionId': 'template-settings', 'id': 'HTML70'}, {'title': 'Custom CSS', 'type': 'HTML', 'sectionId': 'custom-css', 'id': 'HTML82'}, {'title': 'JavaScript Download (Header)', 'type': 'Header', 'sectionId': 'header', 'id': 'Header1'}, {'title': 'Kode Icon Media Sosial', 'type': 'HTML', 'sectionId': 'social-button', 'id': 'HTML71'}, {'title': 'Kode Menu Navigasi', 'type': 'HTML', 'sectionId': 'navmenu', 'id': 'HTML72'}, {'title': 'Widget HTML #1', 'type': 'HTML', 'sectionId': 'top-widget', 'id': 'HTML73'}, {'title': 'Widget HTML #2 (homepage)', 'type': 'HTML', 'sectionId': 'top-widget2', 'id': 'HTML421'}, {'title': 'Featured Post', 'type': 'FeaturedPost', 'sectionId': 'main-content', 'id': 'FeaturedPost1', 'postId': '4450193447622565288'}, {'title': 'Blog Posts', 'type': 'Blog', 'sectionId': 'main-content', 'id': 'Blog1', 'posts': [{'id': '3289081708000043903', 'title': 'Onclick For Bootstrap .btn-group Checkbox Works In Jsfiddle But Not Browser', 'showInlineAds': true}], 'headerByline': {'regionName': 'header1', 'items': [{'name': 'share', 'label': ''}, {'name': 'timestamp', 'label': ''}]}, 'footerBylines': [{'regionName': 'footer1', 'items': [{'name': 'comments', 'label': 'Comments'}, {'name': 'icons', 'label': ''}]}, {'regionName': 'footer2', 'items': [{'name': 'labels', 'label': ''}]}], 'allBylineItems': [{'name': 'share', 'label': ''}, {'name': 'timestamp', 'label': ''}, {'name': 'comments', 'label': 'Comments'}, {'name': 'icons', 'label': ''}, {'name': 'labels', 'label': ''}]}, {'title': 'Widget HTML (label produk)', 'type': 'HTML', 'sectionId': 'html-produk', 'id': 'HTML74'}, {'title': 'Widget HTML (label jasa)', 'type': 'HTML', 'sectionId': 'html-jasa', 'id': 'HTML75'}, {'title': 'Kode Iklan Atas', 'type': 'HTML', 'sectionId': 'iklan-atas', 'id': 'HTML76'}, {'title': 'Kode Iklan Tengah 1', 'type': 'HTML', 'sectionId': 'iklan-tengah1', 'id': 'HTML77'}, {'title': 'Kode Iklan Tengah 2', 'type': 'HTML', 'sectionId': 'iklan-tengah2', 'id': 'HTML78'}, {'title': 'Kode Iklan Bawah', 'type': 'HTML', 'sectionId': 'iklan-bawah', 'id': 'HTML79'}, {'title': 'Kode Iklan Matched Content', 'type': 'HTML', 'sectionId': 'matched-content', 'id': 'HTML939'}, {'title': 'Kode Iklan In-Feed (homepage)', 'type': 'HTML', 'sectionId': 'iklan-infeed', 'id': 'HTML83'}, {'title': '', 'type': 'HTML', 'sectionId': 'sidebar', 'id': 'HTML1'}, {'title': 'Top Question', 'type': 'PopularPosts', 'sectionId': 'sidebar', 'id': 'PopularPosts1', 'posts': [{'title': 'Creating Popup Window With Form Content And Then Show Output In Parent Page And Send To Database', 'id': 4779553692933881439}, {'title': 'Get The Value Of Checked Radio Button Without Re-selecting The Buttons', 'id': 3242078600502339458}, {'title': 'JQuery Val Is Undefined?', 'id': 4298644254346310075}, {'title': 'Onsubmit Method Doesn\x27t Stop Submit', 'id': 8164443400991478921}, {'title': '\x22too Much Recursion\x22 Error When Calling JSON.stringify On A Large Object With Circular Dependencies', 'id': 2303542487892808961}, {'title': 'Configuring Any Cdn To Deliver Only One File No Matter What Url Has Been Requested', 'id': 342955257715471227}, {'title': 'Display Modal Form Before User Leaves Page', 'id': 6672604578833458228}, {'title': 'How To To Insert TradingView Widget Into React Js Which Is In Script Tag Link: Https://www.tradingview.com/widget/market-overview/', 'id': 1567608873232339836}, {'title': 'React Mobx - Store Return Proxy Object', 'id': 8194086604709501573}, {'title': 'Angular : Can\x27t Export Excel Using Exceljs - Error Ts2307: Cannot Find Module \x27stream\x27 - Error Ts2503: Cannot Find Namespace \x27nodejs\x27', 'id': 8465381815038983724}]}, {'title': '', 'type': 'BlogArchive', 'sectionId': 'sidebar-sticky', 'id': 'BlogArchive1'}, {'title': 'Widget HTML #3', 'type': 'HTML', 'sectionId': 'footer-widget-html', 'id': 'HTML831'}, {'title': 'Menu Halaman Statis', 'type': 'PageList', 'sectionId': 'page-navmenu', 'id': 'PageList1'}, {'title': 'Teks Footer', 'type': 'HTML', 'sectionId': 'footer-text', 'id': 'HTML80'}, {'title': 'Navbar', 'type': 'Navbar', 'sectionId': 'navbarrr', 'id': 'Navbar1'}, {'title': 'Custom JavaScript Footer', 'type': 'HTML', 'sectionId': 'custom-javascript-footer', 'id': 'HTML85'}]}]); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML70', 'template-settings', document.getElementById('HTML70'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML82', 'custom-css', document.getElementById('HTML82'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HeaderView', new _WidgetInfo('Header1', 'header', document.getElementById('Header1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML71', 'social-button', document.getElementById('HTML71'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML72', 'navmenu', document.getElementById('HTML72'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML73', 'top-widget', document.getElementById('HTML73'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML421', 'top-widget2', document.getElementById('HTML421'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_FeaturedPostView', new _WidgetInfo('FeaturedPost1', 'main-content', document.getElementById('FeaturedPost1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogView', new _WidgetInfo('Blog1', 'main-content', document.getElementById('Blog1'), {'cmtInteractionsEnabled': false, 'lightboxEnabled': true, 'lightboxModuleUrl': 'https://www.blogger.com/static/v1/jsbin/2165624756-lbx.js', 'lightboxCssUrl': 'https://www.blogger.com/static/v1/v-css/3681588378-lightbox_bundle.css'}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML74', 'html-produk', document.getElementById('HTML74'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML75', 'html-jasa', document.getElementById('HTML75'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML76', 'iklan-atas', document.getElementById('HTML76'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML77', 'iklan-tengah1', document.getElementById('HTML77'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML78', 'iklan-tengah2', document.getElementById('HTML78'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML79', 'iklan-bawah', document.getElementById('HTML79'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML939', 'matched-content', document.getElementById('HTML939'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML83', 'iklan-infeed', document.getElementById('HTML83'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML1', 'sidebar', document.getElementById('HTML1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_PopularPostsView', new _WidgetInfo('PopularPosts1', 'sidebar', document.getElementById('PopularPosts1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogArchiveView', new _WidgetInfo('BlogArchive1', 'sidebar-sticky', document.getElementById('BlogArchive1'), {'languageDirection': 'ltr', 'loadingMessage': 'Loading\x26hellip;'}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML831', 'footer-widget-html', document.getElementById('HTML831'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_PageListView', new _WidgetInfo('PageList1', 'page-navmenu', document.getElementById('PageList1'), {'title': 'Menu Halaman Statis', 'links': [{'isCurrentPage': false, 'href': 'https://griddle-reviews.blogspot.com/', 'title': 'Beranda'}], 'mobile': false, 'showPlaceholder': true, 'hasCurrentPage': false}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML80', 'footer-text', document.getElementById('HTML80'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_NavbarView', new _WidgetInfo('Navbar1', 'navbarrr', document.getElementById('Navbar1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML85', 'custom-javascript-footer', document.getElementById('HTML85'), {}, 'displayModeFull')); </script> </body> </html>