6

モデル、ビュー、コントローラーのパラダイムに基づいて、LaravelPHPフレームワークを学んでいます。私はAJAXを私の単純なスターターアプリケーションに組み込むことを試み続けています...電話ロガー。これは私が通常あきらめるところです。だが断る！

だから私は私の電話モデルを持っています：

class Phonecall extends Eloquent
{
// Creates an instance of the database object 
}

これが私の電話の表です：

mysql> desc phonecalls;
+------------+------------------+------+-----+---------+----------------+
| Field      | Type             | Null | Key | Default | Extra          |
+------------+------------------+------+-----+---------+----------------+
| id         | int(10) unsigned | NO   | PRI | NULL    | auto_increment |
| who        | varchar(200)     | NO   |     | NULL    |                |
| what       | varchar(200)     | NO   |     | NULL    |                |
| created_at | datetime         | NO   |     | NULL    |                |
| updated_at | datetime         | NO   |     | NULL    |                |
| initiator  | varchar(200)     | NO   |     | NULL    |                |
| info       | text             | NO   |     | NULL    |                |
+------------+------------------+------+-----+---------+----------------+
7 rows in set (0.00 sec)

マイビューには、現在データベースにあるすべての通話（誰と何による）が一覧表示されます。

<!doctype html>
<html>
<head>
  <title>Title</title>
  <script type="text/javascript" 
           src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js">
</script>
</head>
<body>
<h1>Welcome</h1>
<p>Here's a list of recent phonecalls</p>
    <ul class="call-list">
    @foreach($phonecalls as $call)
        <li>{{ $call->who }} - {{ $call->what }} - 

        <a href="phonecalls/show/{{ $call->id }}">Show</a> | 

        {{ HTML::link('phonecalls/delete/'.$call->id, 'Delete') }} | 
        {{ HTML::link('phonecalls/update/'.$call->id, 'Update') }}
        </li>
    </ul>

    {{-- Placeholder for AJAX content --}}
    <div id="call-info">
    </div>
</body>
</html>

これが私の単純なコントローラーです：

 class Phonecalls_Controller extends Base_Controller {    

// Use $this within a method the same way you
// would use the object name outside of the class

public function get_index()
    {
            $phonecalls = Phonecall::all();
            return View::make('phonecalls.index')->with('phonecalls', $phonecalls);
    }    
// ************************************
// DISPLAY CALL INFO
public function get_show($call_id)
{
    $call = Phonecall::find($call_id);

            // WHAT GOES HERE?

}

ユーザーがビューの[表示]をクリックして、通話情報を...内に表示できるようにしたい。

<div id="call-info">
</div>

ビュー内のタグ。

アップデート：

これが何をしたのか...

私のget_show（）メソッド

// ************************************
// SHOW CALL INFO
public function get_show($call_id)
{
$call = Phonecall::find($call_id);
return $call->info;
}

私のJavascript

//************************************
// Phonecall AJAX Example
//************************************
$(document).ready(function() {
  $('.call-list > li > a').click(function(e) {  // e=event
     e.preventDefault();
     var id = $(this).attr('id');
     $.get(BASE+'/phonecalls/show/'+id, function(data) {
     $("#call-info").html(data);
  })
});
4

3 に答える 3

5

これは、さまざまな方法で実行できます。

まず、これを行うことができます：

public function get_show($call_id)
{
    $call = Phonecall::find($call_id);

    return View::make('phonecalls.single')->with('phonecal', $call);

}

この場合、1回の電話のテンプレートを作成し、それを電話フォルダに配置する必要があります。

もう1つのオプションは、LaravelアプリからJSON応答を返すことです。

public function get_show($call_id)
{
    $call = Phonecall::find($call_id)->first();

    return Response::eloquent($call);

}

もう1つのオプションは、javascript MVCフレームワークを使用して、AJAXデータのフェッチ/更新などを非常に簡単にすることです。たとえば、BackboneJSやAngularJSはそれを実行できます。

いずれにせよ、AJAXデータを実行する場合は、通常のサイトとAJAXデータバックエンドを分離するためのAPIを構築する必要があります。

これを実現する方法の詳細が記載された私のブログ投稿は次のとおりです。http： //maxoffsky.com/code-blog/building-restful-api-in-laravel-start-here/

また、LaravelでのAJAXの優れた紹介は、DayleReesによるCodeHappy、AJAXコンテンツの章です：codehappy.daylerees.com/ajax-content

他にご不明な点がありましたらお知らせください。サポートされたと思われる場合は、このコメントを承認してください。ありがとう！

アップデート：

コントローラ（またはLaravelルート）から実際にデータをロードするには、jQuery ajax、GET（データをロードする）、またはPOST（フォーム結果を投稿する）を使用する必要があります。例を次に示します。

 $('#get-info').click(function(e) {  // e=event
        e.preventDefault();
        var BASE = "<?php echo URL::base(); ?>";
        // attempt to GET the new content
        $.get(BASE+'phonecalls/show/2', function(data) {
            $('#content').html(data);
        });
于 2013-03-25T21:48:33.417 に答える
5

webzの例は、トークンなどheadersを考慮して変更することを参照すると混乱を招くため、理解するのに少し時間がかかりcsrfました。ここに例があり、それが他の誰かに役立つことを願っています。

最初に：あなたの見解に入るフォーム：

{{ Form::open(['id' => 'testForm']) }}

   <p>{{ Form::label('title', 'Title') }}
   {{ Form::text('title') }}</p>

   <p>{{ Form::label('description', 'Description') }}
   {{ Form::text('description') }}</p>

   <p>{{ Form::submit('Submit') }}</p>

{{ Form::close() }}

2番目：ルートを次のように記述しますroute.php：

Route::post('ad', 'AdController@store');

第三に：コントローラー：

public function store()
{

if(Request::ajax()){

    $ad = new ad; 
    $ad -> title = Input::get('title');
    $ad -> description = Input::get('description');
    $ad -> save();

    $response = array(
        'status' => 'success',
        'msg' => 'Option created successfully',
    );

    return Response::json( $response );

    }

}

4番目：jquery ajaxリクエスト：

$('form#testForm').submit(function(e){
  e. preventDefault();


  var str1 = $('input[name="title"]').val();
  var str2 = $('input[name="description"]').val();
  var str3 = $('input[name="_token"]').val();
  var data = {title:str1,description:str2, token:str3};
  //console.log(data);
  var request = $.ajax({
    url: "ad",
    type: "POST",
    data: data ,
    dataType: "html"
  });

  request.done(function( msg ) {
    var response = JSON.parse(msg);
    console.log(response.msg);
  });

  request.fail(function( jqXHR, textStatus ) {
    console.log( "Request failed: " + textStatus );
  });

  });

それでおしまい。保護のためSession::token() == Input::get('_token')に、コントローラーでifチェックとしてを設定できます。これは、始めるのにうまく機能する単なる例です。http://www.pretty.url/adwww.pretty.urlがあなたlocalhostまたはローカルのプライベート開発URLである場合、絶対URLを使用する必要があるかもしれません（その場合は使用してください）。

于 2014-08-24T19:38:49.870 に答える
0

「表示」リンクのクリックを傍受できるようにする必要があります。コントローラーを安らかにする場合は、コントローラーにajaxリクエストを簡単に送信できるはずです。

ユーザーが[表示]リンクをクリックしたときに、 ajaxリクエストを送信する必要があります。

結果をJSONとして出力することをお勧めします。そうすれば、後でjsを使用して結果を出力するのは非常に簡単です。

于 2013-03-25T20:39:11.827 に答える