2012-04-19 8 views
4

jQuerys .autocomplete()関数には 'source'オプションの2つのバリエーションがあります。ソースに変数内のJSON値を使用してオートコンプリートしますか?

ストリングの配列:

[ "Choice1", "Choice2" ] 

ラベルと値のプロパティを持つオブジェクトの配列:

[ { label: "Choice1", value: "value1" }, ... ] 

.autocomplete()機能に直接渡され、これらの作業罰金の両方:

$('input').autocomplete({source: [ "Choice1", "Choice2" ], minLength: 0}); 

または

$('input').autocomplete({source: [ { label: "Choice1", value: "value1" } ], minLength: 0}); 

しかし変数として渡されたとき、私はどちらかを動作させることはできません。

var source = '[ "Choice1", "Choice2" ]'; 
$('input').autocomplete({source: source, minLength: 0}); 

これは、文字列に変数の暗黙的キャストで行うことです - オートコンプリートは、どのように同一の変数から値を扱いますAJAX source(文字列)を処理します。

最後に、入力要素のdata-json属性のJSON値を使用します。追加の利益のために

$('input').autocomplete({source: $('input').data('json'), minLength: 0}); 

は、第一の変形のために完璧に動作しますが、第二の変形のための文字列の動作に戻ります。

$('input').attr('data-json')を使用すると、どちらのバリアントでも機能しません。両方の変形のために働くん

A「ハック」は、この操作を行うことです。

$('input').autocomplete({source: eval($('input').attr('data-json')), minLength: 0}); 

私は.data()を対象として第二の変形にJSON明らかに有効なを返すことができるようになる何かを逃しましたか?

別の方法がありますか、それとも恐らくeval()と平和を作る必要がありますか?その周りのすべての知恵にもかかわらず、おそらく良いことではありませんか? 文字列、ない配列であるあなたの思考のための

おかげ..

答えて

4
var source = '[ "Choice1", "Choice2" ]'; 

。引用符なし

試してください:あなたはJSON文字列からデータを取得することの状況で自分自身を見つける場合

var source = [ "Choice1", "Choice2" ]; 

、evalの(それの邪悪な)を使用していないが、JSONを使用しています。あなたは既にjQueryの

var source = $.parseJSON('[ "Choice1", "Choice2" ]'); 
+3

jQueryには、$ .parseJSON(json); http://api.jquery.com/jQuery.parseJSON/というjsonを解析する独自のメソッドがあります。 'JSON.parse'を使用するとブラウザの互換性に問題が生じるかもしれませんが、jQueryはIEのほとんどとヒップモダンな群衆をサポートします。 – jammypeach

+0

ありがとうThilo - 私はまだ.data()が一貫していると思う。 $( 'input')。attr( 'data-json')の値に立っていたので、varソースで文字列を使用しました。これは文字列を返します。 – Grokling

+0

私はまだ立ち往生しています - $ .parseJSON( '[{label: "Choice1"、value: "value1"}、{label: "Choice2"、value: "value2"}]')アラートの中で()。 eval()は動作します。それ以上の考え? – Grokling

1

を使用しているので、(すべての近代的なブラウザが持っている)

var source = JSON.parse('[ "Choice1", "Choice2" ]'); 

を解析したり、根本的な問題はここにあったその「JSON」オートコンプリートプラグインによって受け入れられ、そして中に詳細なdocumentation

[ { label: "Choice1", value: "value1" }, ... ] 

実際に有効なJSONではありません。 JSONLint.comはこれを明らかにしました。

私は文字列にサンプル形式を正確に複製しましたが、オートコンプリートはその構文を直接受け入れますが、eval()を使用する以外はjsオブジェクトに変換できません。

答えは、プロパティ名と値を引用する必要があるということです。有効な表記法は次のとおりです。

[ { "label": "Choice1", "value": "value1" }, { "label": "Choice2", "value": "value2" },...] 

誰かを助ける希望!

関連する問題