0

エンドユーザーが写真家と、写真家ごとに異なる関連するロール番号を選択する必要があるプロジェクトがあります (データは、ページの読み込み時に JSON データベース呼び出しによって取り込まれ、値をすばやく表示するために Javascript 配列にドロップされます)。 . 必要なものすべてを備えた jsFiddle を作成しましたが、動的に作成されたスライダーが作成後に移動しません。最小値と最大値に関係があると確信していますが、正しいように「思われます」。オートコンプリート セクションは写真家の選択を表示するだけで、その下に既存の HTML 要素からスライダーを動的に作成します。問題を解決するために、私が使用している余分なコードの多くを削除しました。

[jsFiddle リンク] http://jsfiddle.net/sN63W/2/

(Ommiting data array named 'Photographer' - But it is in the jsFiddle Link)

$(function () {
   $("#photographer-label").autocomplete({
      minLength: 0,
      source: Photographer,
      focus: function (event, ui) {
          $('#photographer-label').val(ui.item.label);
          return false;
      },
      select: function (event, ui) {
          $('#photographer').val(ui.item.value);
          $('#photographer-label').val(ui.item.label);
          var slider_min = ui.item.rollnum_from;
          var slider_max = ui.item.rollnum_to;
          alert('Selected Rolls: ' + slider_min + ' : ' + slider_max); // For Debugging
          $('#rollnum-slider').slider({
              min: slider_min, // ui.item.rollnum_from,
              max: slider_max, // ui.item.rollnum_to,
              change: function (event, ui) {
                  $('#rollnum').val(ui.value);
              }
          });
      }
   });
});

皮肉なことに、スライダーの最小値と最大値の中にハードコードされた数値を挿入すると、正しく機能します。しかし、(アラート ボックスによると) 値は正しいようです。私は何が欠けていますか?おそらく単純な答えであることはわかっていますが、私はそれについて大きな脳のけいれんを起こしているだけです.

PS副次的な問題として、スライダーにフォーカスを移動したときにオートコンプリートに「データ」ではなく「ラベル」を表示させたいのですが、そうしていないようです。しかし、それはそれほど大したことではありません。

4

1 に答える 1

0

これは、JSON データが文字列であるためです。これらの値の引用符を削除してください。

{
      "photographer_id": "2",
          "label": "Tommy Stay (TS)",
          "value": "TS",
          "rollnum_from": 1,
          "rollnum_to": 10
}

それ以外の

{
      "photographer_id": "2",
          "label": "Tommy Stay (TS)",
          "value": "TS",
          "rollnum_from": "1",
          "rollnum_to": "10"
}

これがJsfiddleです。

http://jsfiddle.net/ufv9T/1/

注:「変更」を「スライド」に変更し、「値」を追加しまし$( "#rollnum" ).val( $( "#rollnum-slider" ).slider( "value" ) );た。これにより、スライダーの初期ロード時に数値が表示されるようになりました。これは、例が機能するために必要ではありません。

于 2013-02-14T17:49:09.950 に答える