Question

我的控制器中具有以下功能。

public function index()
{
    $number = DB::table('counters')->first();

    return view('app', compact('number'));
}

public function count()
{
    DB::table('counters')->where('id', 1)->increment('number');
}

路线

Route::get('/', 'CounterController@index');
Route::get('/count', 'CounterController@count');

查看

<a href="{{action('CounterController@count')}}">
    <div class="button lighter-blue" id="form-button-1" data-attribute="1">
    Ja
    </div>
</a>

count函数有效，但是我想用Ajax来实现，因为我在视图中看到了数字。

<h3>Nummer: {{ $number->number }}</h3>

我想单击按钮，然后数字递增，它直接向我显示。我该怎么办？

Answer 1

我在这里看不到任何异常-看起来像是标准的ajax响应。那里有很多不错的教程，例如this one

但是，要回答您的问题，请首先将按钮设为按钮，以便jQuery / js可以接受操作，而不必刷新页面。像这样：

<button id = 'getCount'>Get Count</button>

这将替换上面的整个锚链接。

然后，使用ID在js中捕获它：

$("#getCount").on('click', function(){ 
    // AJAX HERE
}

然后您进行调用以获取上述onClick内的计数（可以简化更多操作，但这显示了清晰的ajax方法-您需要调整代码）：

$.ajax({
      url: APP_URL + "/count" ,
      type: "GET",
       success: function (countResult) {
          showResult(countResult)
       },
       error: function () {
         alert ('Problem');
       }
  });

为了清晰起见，我对显示屏进行了细分。您可以向<h3>添加ID以覆盖：

<h3 id='count'>Nummer: {{$number->number}}</h3>

然后，您的show方法可以只写计数：

function showResult(count){
    $("#count").text('Nummer '+count);
}

您需要进行调整，但这将使您到达需要的位置。看看上面的教程，它将帮助您了解其发展方向，最终可以简化下来。

如何在Laravel中使用Ajax？

1 个答案: