0

ダイアログ ページに JQuery Mobile スライダーを実装しようとしています。

ボタンをクリックすると、ダイアログが作成されます。このボタンのコールバックでは、サーバーから JSON データを取得し、そのデータをダイアログに入力します。コード スニペットは次のとおりです。

$('.class-CheckOutList').live ("click", function (event)
{
    $.post("getItemDataForDataEntry.php", {"name":selectedItemID},
        function(data){             
            $.each(data, function(index,value){
                dialogHTML = '<input type="range" name="slider"';
                dialogHTML +=' id="slider-0" value="0" min="0" max="100">';
                $("#itemDataEntryFormContent").html(dialogHTML);                        
                });
            }
            ,"json");
});

問題は、上記のコードではスライダーが正しくレンダリングされないことです。申し訳ありませんが、私はこのフォーラムに不慣れなため、写真を投稿して何が得られるかを示すことはできません.

ただし、次のコードは問題なく動作するようです。

$('.class-CheckOutList').live ("click", function (event)
{
                dialogHTML = '<input type="range" name="slider"';
                dialogHTML +=' id="slider-0" value="0" min="0" max="100">';
                $("#itemDataEntryFormContent").html(dialogHTML);                        
});

誰でも助けることができますか？

ありがとう。

++++++++++++++++++++

更新 --> 問題を解決できましたが、解決策を適用した後に別の同様の問題が発生します。

私がやったこと --> 以前は、コールバックを有効にするために、次のようなものを使用していました。

    <a href='#itemDataEntryDialog' data-rel='dialog' data-role='button'>Change</a>";

ダイアログを作成します。

私が行った解決策は、上記を次のように変更することでした。

    <a data-role='button'>Change</a>";

コードを次のように変更します。

$('.class-CheckOutList').live ("click", function (event)
{
    $.post("getItemDataForDataEntry.php", {"name":selectedItemID},
        function(data){             
            $.each(data, function(index,value){
                dialogHTML = '<input type="range" name="slider"';
                dialogHTML +=' id="slider-0" value="0" min="0" max="100">';
                });
                $("#itemDataEntryFormContent").html(dialogHTML);                        
                          $.mobile.changePage($('#itemDataEntryDialog'), {role: "dialog"} );
            }
            ,"json");
});

これらすべての変更により、ダイアログが適切にレンダリングされます。

ただし、ボタンをもう一度クリックすると、ダイアログのレンダリングが再び失敗します (以前と同様)。

だから、私は一種の振り出しに戻っています.......

ここで助けを得ることができれば幸いです。それは私を夢中にさせています。

4

1 に答える 1

0

$（'＃myInput'）。slider（）を呼び出して、jquerymobileに新しいコントロールを初期化させる必要があると思います。

あなたの場合、私は次のようなものを追加します：

$('#itemDataEntryFormContent input[type="range"]').slider()

... html（）呼び出しとchangepage（）呼び出しの間。

スライダーコントロールのもう1つの便利な関数は、スクリプトを介して値を更新した場合に$（'＃mycontrol'）。slider（'update'）を呼び出すことです。

これが誰かを助けることを願っています:)

于 2012-06-25T12:10:51.863 に答える