11

これを行う方法があるかどうかはわかりませんが、これに対する簡単な解決策があれば、これは私の問題の多くを解決するでしょう。

私ができるようにする必要がある/したいのは、ajaxリクエストの成功でHTMLとJSONを返すことです。その理由は、ファイルをリクエストしてそのページ全体を返したいのですが、jsonのページから指定された情報セットを返したいので、他の用途にも使用できます。

これは私が今していることです:

     $.ajax({
    type: "POST",
    url: "inc/"+page+".php",
    data: "id="+encodeURIComponent(pageID),
    success: function(html){

        $("body > .container").html(html);

      }
      });

これが私がしたいことです:

     $.ajax({
    type: "POST",
    url: "inc/"+page+".php",
    data: "id="+encodeURIComponent(pageID),
    success: function(html){
        $("body > .container").html(html);
            $("title").html(json.PageTitle)
      }
      });

返されるページで、タイトルを指定します。(たとえば、プロファイルの場合は、ユーザーの名前を返します)

4

4 に答える 4

12

JSONでラップされたHTMLとデータ

これを行うには、2要素のJSON配列を返します。最初の要素にはHTMLが含まれ、2番目の要素にはデータを含む別のJSON配列が含まれます。何も壊さずに慎重に開梱する必要があります。

サーバ側

$html = '<div>This is Html</div>';
$data = json_encode(array('page_title'=>'My Page'));
$response = array('html'=>$html, 'data'=>$data);
echo json_encode($response);

クライアント側

//Ajax success function...

success: function(serverResponse){
    $("body > .container").html(serverResponse.html);
    var data = JSON.parse(serverResponse.data);
    $("title").html(data.page_title)
  }

注1:これは@hakreがあなたの質問に対する彼のコメントで意味したことだと思います。

注2:この方法は機能しますが、プレゼンテーションとデータの混合を避けるのはおそらく良い考えであるという@jheddingsに同意します。コーディングカルマは噛み付くように戻ります。

于 2012-11-10T16:23:04.963 に答える
9

プレゼンテーションとデータを含めるためにretun値を混合しようとすると、混乱が生じる可能性があります。それを2つの呼び出しに分割し、もう1つの呼び出しの成功に関するデータをフェッチしてみませんか?

何かのようなもの:

 $.ajax({
  type: "POST",
  url: "inc/"+view_page+".php",
  data: "id="+encodeURIComponent(pageID),
  success: function(html) {
    $("body > .container").html(html);
    $.ajax({
      type: "POST",
      url: "inc/"+data_page+".php",
      data: "id="+encodeURIComponent(pageID),
      success: function(json) {
        $("title").html(json.PageTitle);
      }
    });
  });
于 2012-11-10T15:40:57.433 に答える
1

html5データ属性にデータを含めるオプションもあります

たとえば、動物のリストを返す場合

<ul id="ZeAnimals" data-total-animals="500" data-page="2">
    <li>Cat</li>
   <li>Dog</li>
   ...
</ul>

その後、使用して必要なデータを収集できます

$('#ZeAnimals').data('total-animals')

リクエストを2つの異なるajax呼び出しに分割することも理にかなっている場合があります。

于 2012-11-12T03:32:32.383 に答える
0

http://phery-php-ajax.netのように、それを自動的に行うライブラリを使用できます。使用する

Phery::instance()->set(array(
  'load' => function(){
    /* mount your $html and $json_data */
    return 
      PheryResponse::factory()
      ->json($json_data)
      ->this() // points to the container
      ->html($html); 
  }
))->process();
$(function(){
  var $container = $('body > .container');
  $container.phery('make', 'load'); // or $container.phery().make('load')
  $container.bind('phery:json', function(event, data){
    // deal with data from PHP here
  });
  $container.phery('remote');
});

phery.views同様に、クライアント側の特定のコードを気にすることなく、サイトの一部を自動的にロードするために使用することもできます。containerこの例では、コンテナに一意のIDを設定する必要があります。

$(function(){
  phery.view({
    '#container': {}
  });
});
Phery::instance()->views(array(
  '#container' => function($data, $params){
    /* do the load part in here */
    return 
      PheryResponse::factory()
        ->render_view($html)
        ->jquery('.title')->text($title);
  }
))->process();
于 2012-11-12T03:21:50.290 に答える