私の特別なケースでPHPからJavaScriptへデータを渡す最も良い方法

私はFacebookの壁のようなホームページでDrupalにオンラインコミュニティを構築しました。最新の25件の投稿が表示されます。最新の2件のコメントはそれらの投稿の下に表示されます。これらのコメントのすぐ下にテキストエリアがあり、特定の投稿に新しいコメントをすばやく投稿することができます。私の特別なケースでPHPからJavaScriptへデータを渡す最も良い方法

Facebookスタイルの投稿には、JavaScriptを使用して多くの機能が組み込まれています。ポストの直下にある「すべてのコメントを見る」リンクをクリックすると、そのポストのすべてのコメントを取得し、そのポストのすぐ下に表示するAJAXコールが作成されます。また、あなたの質問への解決策としてコメントを投稿したり、コメントをインラインで編集したりすることもできます。これらのアクションにはAJAXリクエストが必要です。つまり、リクエストを行うJavaScriptはノードID（ユニークコメントID（コメントの一意の識別子）など。

私の最初の実装では、これらの重要なデータが投稿全体に散在していたため、検索する必要があるJSを書くのがより複雑になりましたそれ。だから私の2番目の実装は、このデータをすべて各ポストのメインラッピング要素のJSON互換文字列に出力するだけです。これにより、JSが必要なデータを見つけるのがはるかに容易になりましたが、JSONを文字列として書くことは苦痛です（エスケープする引用符で、改行はありません）。

私は3番目のアイデアを持っています。実装に先立ってフィードバックを探しています。そのアイデアは、各ポストのデータを保持するオブジェクトをその中に含むこれらすべてのポスト用の単一のグローバルなJS配列を作成することです。その配列の各要素は、AJAX呼び出しに必要なデータを保持します。だから、次のようになります。

Facebookのスタイルのポストテンプレート

<div class="post" data-postindex="<?php echo $post->index; ?>"> 
    <!-- lots of other HTML for the post --> 
</div> 
<script type="text/javascript"> 
    globalPostArray.push({ 
     nid: <?php echo $post->nid; ?>, 
     authorID: <?php $post->authorID; ?>, 
     //etc. etc. etc. 
    }); 
</script>

は、上記のコードの結果は、リンクをクリックますときには、AJAX要求を必要とすることで、JSは、単純にDOMをトラバースうメインの.post要素が見つかるまでそのリンクから上に移動します。 globalPostArrayのどの要素が必要なデータを保持しているかを知るために、data-postindexの値を取得します。

思考？私はこのような何かを達成するための標準的で受け入れられた方法がなければならないように感じる。

出典

2012-02-03 maxedison

なぜ文字列としてのJSONが痛みですか？あなたは 'json_encode'関数を使いませんか？ –

いいえ、私はそれを使用しませんでした。それが痛みだったのです。明らかに私はばかだよ:) – maxedison

PHPとJavascriptの間で情報を「渡す」標準的な方法は、それぞれサーバーサイドとクライアントサイドの言語であるため、私は聞いたことがありません。私は個人的に2番目と3番目のソリューションのハイブリッドを使用します。

post-idをdata-postindex属性に格納します（データ属性は新しいもので、少量のデータを格納するための「正しい」方法です）。しかし、私はまだ残りのためにJSON配列を使用しています。データ属性にたくさんのデータを格納する（そしてそれらをエスケープする）ことは潜在的に問題があります。 PHPはあなたのためにすべてのエスケープのケアと、そのようなを取るjson_encode機能がある - ちょうどあなたが通常と同じようにPHPの配列（たとえば、$postdata）を構築し、その後、あなたの投稿テンプレートでこれを投げる：

<script type="text/javascript"> 
    globalPostArray.push(<?php echo json_encode($postdata) ?>); 
</script>

$postdata次のようなものです：

$postdata = array(
    'nid' => 5, 
    'authorId' => 45 
    ...etc... 
);

既存のコードからこのような配列を生成するのは簡単です。

私はblog postを書いていますが、私のこの種の実装については戻っていますが、必要なのはjson_encodeというポインタだけです。

<div class="post" data-postindex="<?php echo $post->index; ?>" 
        data-nid="<?php echo $post->nid; ?>" 
        data-authorID="<?php echo $post->authorID; ?>">

を...または1のデータ属性に完全なJSON文字列を格納：

出典

2012-02-03 23:59:43 cincodenada

json_encode。ダー。最初に投稿するための答えを与えるだけでなく、ちょうどjson_encodeについて言及するより少し進んでいます。 – maxedison

私は、要素内のデータを格納します

<div data-data="<?php echo htmlentities(json_encode($somedata));?>">

出典

2012-02-04 00:00:26

これは私の元々の解決策でしたが、大量のデータでは扱いにくくなり始めました。 – maxedison

これは、自分でデータの処理を実装する必要がある場合に当てはまります。しかし、たとえば、組み込みデータメソッドでjQueryを使用する場合、デメリットはありませんが、データが要素にバインドされるというメリットがあります。 –

しかし、（json_encodeを使ってJavaScriptに直接渡すのではなく）たくさんの余分なコードが必要です。 – maxedison

いずれかを渡すための最も確実な方法JavaScriptからPHPへの変数はjson_encodeです。

クロージャとリソースは渡すことはできませんが、それ以外のものは渡すためのゲームです。

出典

2012-02-04 00:01:28

私の答えは、他の人とほぼ同じですが、より詳細です。私は通常、このようにそれを行うと私は最善の方法だと思う。（もちろんあなたは、AJAXを使用してデータをつかむことができますが、文脈に依存）

somefile.html

<html> 
    <head>..</head> 
    <body> 
     html code 
     <script> 
      window.my_data = <?php echo json_encode($my_php_var); ?> 
     </script> 
    </body> 
    </html>

somefile.js

 $(function() { 
      window.myitem = new myClass(window.my_data); 
     }); 
     var MyClass = function(init_data) {...}

出典

2013-09-21 14:33:01

私の特別なケースでPHPからJavaScriptへデータを渡す最も良い方法

答えて

関連する問題