0

I try to create an alternative way to choose along a set of options, like in a select widget.

My custom select is built with a collapsible and a set of radio buttons, which are somewhat lighter than JQM select, since non-native selectmenu is converted into a popup or dialog. especially when used inside a panel, and moreover it is for me easier to data-bind.

enter image description here

I'm dynamically iniecting markup into the panel inner. The panel can also have different content that will be initialized in panel.onbeforeopen. Now, i have some trouble to bind the radio buttons change event only after the collapsible gets created. I tried something like this but don't works:

$("#collapsible-select").on("collapsiblecreate", function(event, ui) {
  $("#radio-choice-1").change(function() {
    var label = $("label[for='" + $(this).attr('id') + "']");
    $("#collapsible-select").collapsible("option", "collapseCueText", label);
    $("#collapsible-select").collapsible("collapse");
  });
});

How can i bind the radio button change event at the right time, after the accordion has been initialized? Is there a way also to bind the change event for the whole radio group instead to each single radio buttons?

NEW Plunker: http://plnkr.co/edit/OSocuRPQIzuk367dE6XS?p=preview

deblocker
  • 7,629
  • 2
  • 24
  • 59

1 Answers1

1

Use the pagecreate event of the page to add the change handler, and use the name attribute to add only one handler:

$(document).on("pagecreate","#one", function(){ 
  $('[name="radio-choice"]').change(function(e) {
    var label = $(this).parent(".ui-radio").find("label").text();
    $("#collapsible-select").collapsible("option", "collapseCueText", label).collapsible( "collapse" );
  });
});

Updated Plunker

ezanker
  • 24,628
  • 1
  • 20
  • 35
  • this don't works for me, as I'm injecting html into the panel. When i create the markup that goes into the panel inner, the page "one" and the panel are already initialized. – deblocker Feb 17 '16 at 17:10
  • i moved your code plus some new code of me in panel onbeforeopen and onclose handlers, could you please check my new sample to give me your ready-to-go? – deblocker Feb 17 '16 at 17:29
  • 1
    @deblocker your new sample works fine. Where and when are you adding the dynamic content? You could ass the change handler after inserting and enhancing the content... – ezanker Feb 17 '16 at 18:59