0

選択ウィジェットのように、一連のオプションに沿って選択する別の方法を作成しようとしています。

私のカスタム選択は、非ネイティブの選択メニューがポップアップまたはダイアログに変換されるため、JQM 選択よりもいくらか軽量な折りたたみ可能なラジオ ボタンのセットで構築されています。特にパネル内で使用すると、データバインドが簡単になります。

ここに画像の説明を入力

パネル内部にマークアップを動的に注入しています。パネルには、panel.onbeforeopen で初期化されるさまざまなコンテンツを含めることもできます。現在、折りたたみ可能なものが作成された後にのみ、ラジオボタンの変更イベントをバインドするのに問題があります。私はこのようなことを試しましたが、うまくいきません:

$("#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");
  });
});

アコーディオンが初期化された後、ラジオボタンの変更イベントを適切なタイミングでバインドするにはどうすればよいですか? ラジオグループ全体の変更イベントを各ラジオボタンにバインドする方法はありますか?

新しいプランカー: http://plnkr.co/edit/OSocuRPQIzuk367dE6XS?p=preview

4

1 に答える 1

1

ページの pagecreate イベントを使用して変更ハンドラーを追加し、name 属性を使用してハンドラーを 1 つだけ追加します。

$(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" );
  });
});

更新されたプランカー

于 2016-02-17T14:09:26.393 に答える