Note that there are some explanatory texts on larger screens.

plurals
  1. POConvert script from Mootools to Jquery
    primarykey
    data
    text
    <p>I have this script written in Mootools.</p> <p>When any checbox is checked, then hidden input is changed. Script check every checked image, makes string from checkced images - separated by commas. I need this Mootools script convert to jQuery.</p> <p><a href="http://jsfiddle.net/ynternet/pfJYh/8/" rel="nofollow">jsFiddle Mootools script</a></p> <p>HTML :</p> <pre><code>&lt;form&gt; &lt;div class="img_container"&gt; &lt;img src="http://ynternet.sk/test/bg_1.png" style="border:2px solid gray;" /&gt;&lt;br /&gt; &lt;input type="checkbox" name="bg_1.jpg" checked="yes" /&gt; &lt;/div&gt; &lt;div class="img_container"&gt; &lt;img src="http://ynternet.sk/test/bg_2.png" style="border:2px solid gray;" /&gt;&lt;br /&gt; &lt;input type="checkbox" name="bg_2.jpg" checked="yes" /&gt; &lt;/div&gt; &lt;div class="img_container"&gt; &lt;img src="http://ynternet.sk/test/bg_3.png" style="border:2px solid gray;" /&gt;&lt;br /&gt; &lt;input type="checkbox" name="bg_3.jpg" checked="yes" /&gt; &lt;/div&gt; &lt;input type="hidden" value="bg_1.jpg,bg_1.jpg,bg_3.jpg" name="selected_img"&gt; </code></pre> <p>Mootools</p> <pre><code>var checks = document.getElements('input[type="checkbox"]'); var hidden = document.getElements('input[type="hidden"][name="selected_img"]')[0]; checks.addEvent('change',function(e){ var checkbox = e.target; var img = checkbox.getPrevious('img'); var checked = checkbox.get('checked'); if(checked){ img.setStyle('border','2px solid gray'); } else{ img.setStyle('border',null); } setInputHidden(); }); function setInputHidden(){ var inputs_checked = document.getElements('input[type="checkbox"]:checked'); var arr_names = inputs_checked.get('name'); hidden.set('value',arr_names.join(',')); alert(hidden.value); } </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload