mercredi 15 juillet 2020

jQuery checkbox gallery select

how can I create jquery function for this: When I checked the images I want to click the button and copy that images to another for working with that selected images.

here is the sample I made, but it's not working good:

        $(document).ready(function () {
            $('input[name="obrazky"]').click(function () {
                getSelectedCheckBoxes('obrazky');
            });

            var getSelectedCheckBoxes = function () {
                var result = $('input[name="obrazky"]:checked');
                if (result.length > 0) {
                    var resultString = result.length + " checkbox checked<br/>";
                    result.each(function () {
                        var selectedValue = $(this).val();
                        resultString += selectedValue + " - "
                            + $('label[class="obrazek' + selectedValue + '"]').html() + "<br>";
                    });
                    $('#showselected').html(resultString);
                }
                else {
                    $('#showselectedk').html("No checkbox checked");
                }
            };
        });
   <label class="obrazek1"><input type="checkbox" name="obrazky" class="filled-in" value="1"><span></span><img alt="" height="100" width="100" src="https://tvorbawebu.net/eshopserver/uploads/Pentair-Led-Pool-Lights.jpg"></label>   
   <label class="obrazek2"><input type="checkbox" name="obrazky" class="filled-in" value="2"><span></span><img alt="" height="100" width="100" src="https://tvorbawebu.net/eshopserver/uploads/f823888da14805caf9a229986595f06c.jpg"></label>
   <label class="obrazek3"><input type="checkbox" name="obrazky" class="filled-in" value="3"><span></span><img alt="" height="100" width="100" src="https://tvorbawebu.net/eshopserver/uploads/Downunda-perimeter-overflow-pool-raised-spa-fire-bowls_490.jpg"></label>
   

    <div id="showselected"></div>

I wanna make like wordpress files library, where you choice your file and put in the main post thumbnail. Thank you for help.




Aucun commentaire:

Enregistrer un commentaire