javascript - Trying to cycle through a group of radio buttons with Jquery using swipe -
javascript - Trying to cycle through a group of radio buttons with Jquery using swipe -
i trying utilize matt bryson's jquery touchswipe plugin (https://github.com/mattbryson/touchswipe-jquery-plugin) advance through grouping of radio buttons show/hide content on page.
i need go next radio button on left swipe , previous radio button on right swipe, , trying generalize much possible works many button groups on same page.
ideally i'd attach name of button grouping , not specific ids or classes associated thing beingness displayed, can't seem working. if has ideas how might achieved i'd appreciate it!
my code below. "you swiped..." line that's commented out original event demo , work...
$(function() { //enable swiping... $("#log1").swipe( { //left swipe swipeleft:function(event, direction, distance, duration, fingercount, fingerdata) { //$(this).text("you swiped " + direction ); $("input:radio[name=log1-slab-selector]").next(":checked") }, //right swipe swiperight:function(event, direction, distance, duration, fingercount, fingerdata) { //$(this).text("you swiped " + direction ); $("input:radio[name=log1-slab-selector]").prev(":checked") }, //default 75px, set 0 demo distance triggers swipe threshold:0 }); });
i found related article (select next/prev radio button external button) helped set me on right track, , encouraged me wrap buttons in ul&li.
unfortunately still wasn't working, figured out there non semantic div getting in way of targeting right li
in tree. dar! 1 time moved within li
worked great!
this code fixed issue me:
$(function() { //enable swiping... $("div#log1").swipe( { //left swipe swipeleft:function(event, direction, distance, duration, fingercount, fingerdata) { $(this).find('li:has(input:checked)').next('li').children('input').prop("checked", true); }, //right swipe swiperight:function(event, direction, distance, duration, fingercount, fingerdata) { $(this).find('li:has(input:checked)').prev('li').children('input').prop("checked", true); }, //default 75px, set 0 demo distance triggers swipe threshold:25 }); });
javascript jquery button radio next
Comments
Post a Comment