Question

大家好我已经在view的{{1}}中找到了一个显示数据的表格。当用户选择要删除的行时，弹出显示询问他们是否确定要删除此行。当他们点击确认我删除了行，我还想从laravel-4

中删除数据

然而，这是我的问题，如何在不离开当前database然后再返回的情况下执行此操作。我希望用户留在页面上。

我知道在view内拨打controller方法并不是一个好主意，所以我想避免这种情况。我不知所措，我还把代码放到我的view中思考它可能会执行并保留在页面上但是没有用。

这是我的route

view

这是我的<div class="panel panel-default"> <div class="panel-heading"> All Tweets <div class="pull-right btn-toolbar"> <a href="#" class="btn btn-danger" id="delete_selected">Delete Selected</a> </div> </div> <div class="panel-body"> <table class="table table-hover" id="tweets_table"> <thead> <tr> <th>Select</th> <th>Tweet</th> <th>Username</th> <th>Name</th> <th>Tweeted at</th> </tr> </thead> @foreach(Tweet::orderBy('created_at', 'DESC')->get() as $tweet) <tr id="{{$tweet->tweet_id}}"> <td><a class="btn btn-danger" id="delete">Delete</a></td> <td id="tweet_text">{{$tweet->tweet_text}}</td> <td id="tweet_user">{{$tweet->screen_name}}</td> <td>{{$tweet->name}}</td> <td id="tweet_date">{{$tweet->created_at}}</td> </tr> @endforeach </table> </div> </div>  <div class="modal" id="myModal"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">Warning: Delete Tweet</h4> </div> <div class="modal-body"> <p>Are you sure you would like to delete this Tweet from the database?</p> <br/> <strong>Tweet: </strong><p class="modal_tweet_text"></p> <strong>Username: </strong><p class="modal_tweet_user"></p> <strong>Tweet Date: </strong><p class="modal_tweet_date"></p> </div> <div class="modal-footer"> <a href="#" data-dismiss="modal" class="btn">No</a> <a href="{{action('AdminBaseController@deleteTweet')}}" class="btn btn-primary" id="confirm_btn">Yes</a> </div> </div> </div> </div>  <script> //When the delete button is clicked open the pop up. $('#delete').click(function(){ $('#myModal').modal({show:true}); //Get the clicked row var row = $(this).closest('tr'); //Get the tweet, user and date var tweet = row.find('#tweet_text'); var user = row.find('#tweet_user'); var date = row.find('#tweet_date'); //Display details in the pop up $('.modal_tweet_text').text(tweet.text()); $('.modal_tweet_user').text(user.text()); $('.modal_tweet_date').text(date.text()); //Confirm Action $('#confirm_btn').click(function(){ row.remove(); //remove the row $('#myModal').modal('hide');//Hide the popup }); }); </script>

routes.php

这是Route::get('dashboard/delete-tweet', 'AdminBaseController@deleteTweet');//delete tweet from db - dashboard.

controller

我知道我在动作中没有任何逻辑，我只想知道如何在不离开视图的情况下调用此逻辑。

Answer 1

您可以查看执行这些操作的JSON（get）请求，而无需重新加载或重定向回页面。例如，您可以将点击事件附加到删除按钮。该事件将触发对URL ./dashboard/delete-tweet/ {id}的JSON get-request。根据该ID，您的“推文”可以删除。之后，您通常会使用

return Redirect::to('page');

在控制器的末尾，但在这种情况下，您可以使用

return Response::json(array('message' => 'Success, or w/e'));

在您的JSON请求中，您可以检查它是否已成功执行 - 这样您也可以从视图中删除该行。有关如何设置这些JSON请求的详细信息，请参阅this页面。

Answer 2

您将需要触发一个ajax调用，该调用将向Laravel发出请求，该请求将删除该记录，然后可能返回某种成功消息。

我目前看到的一个问题是你的所有元素id都应该是唯一的，所以你可能想要改变它以使其正常工作。我在名为tweet_delete的删除行中添加了一个类，为您提供了抓取和修改jquery的功能，并添加了相关的ajax和data-id属性，该属性将保存推文的ID，以便我们知道要删除哪一个。

<div class="panel panel-default">
    <div class="panel-heading">
        All Tweets
        <div class="pull-right btn-toolbar">
            <a href="#" class="btn btn-danger" id="delete_selected">Delete Selected</a>
        </div>
    </div>
    <div class="panel-body">
        <table class="table table-hover" id="tweets_table">
            <thead>
                <tr>
                    <th>Select</th>
                    <th>Tweet</th>
                    <th>Username</th>
                    <th>Name</th>
                    <th>Tweeted at</th>
                </tr>
            </thead>
            @foreach(Tweet::orderBy('created_at', 'DESC')->get() as $tweet)
                <tr id="{{$tweet->tweet_id}}">
                    <td><a class="btn btn-danger tweet_delete" data-id="{{ $tweet->tweet_id }}">Delete</a></td>
                    <td id="tweet_text">{{$tweet->tweet_text}}</td>
                    <td id="tweet_user">{{$tweet->screen_name}}</td>
                    <td>{{$tweet->name}}</td>
                    <td id="tweet_date">{{$tweet->created_at}}</td>
                </tr>
            @endforeach
        </table>
    </div>
</div>

<!-- Twitter Bootstrap Modal -->
<div class="modal" id="myModal">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
          <h4 class="modal-title">Warning: Delete Tweet</h4>
        </div>
        <div class="modal-body">
          <p>Are you sure you would like to delete this Tweet from the database?</p>
          <br/>
          <strong>Tweet: </strong><p class="modal_tweet_text"></p>
          <strong>Username: </strong><p class="modal_tweet_user"></p>
          <strong>Tweet Date: </strong><p class="modal_tweet_date"></p>
        </div>
        <div class="modal-footer">
          <a href="#" data-dismiss="modal" class="btn">No</a>
          <a href="{{action('AdminBaseController@deleteTweet')}}" class="btn btn-primary" id="confirm_btn">Yes</a>
        </div>
      </div>
    </div>
</div>
<!-- PUT THIS INTO EXTERNAL JS -->
<script>
    //When the delete button is clicked open the pop up.
    $('.tweet_delete').click(function(){
        $('#myModal').modal({show:true});
        //Get the clicked row
        var row = $(this).closest('tr');
        //Get the tweet, user and date
        var tweet = row.find('#tweet_text');
        var user = row.find('#tweet_user');
        var date = row.find('#tweet_date');

        //Display details in the pop up
        $('.modal_tweet_text').text(tweet.text());
        $('.modal_tweet_user').text(user.text());
        $('.modal_tweet_date').text(date.text());

        //Confirm Action 
        $('#confirm_btn').click(function() {
            row.remove();                   //remove the row
            $('#myModal').modal('hide');    //Hide the popup

            // Fire ajax call to delete row from database.
            $.post('dashboard/delete-tweet', {id: $(this).attr('data-id')}, function(data, textStatus, xhr) {
                if(data.success)
                    alert('Tweet successfully deleted');
                else
                    alert('Something went wrong!');
            });
        });
    });
</script>

你的路线看起来像这样......

Route::post('dashboard/delete-tweet', function()
{
    $tweet = Tweet::find(Input::get('id'));
    $tweet->delete();
    return Response::json(array('success' => true));
})

从数据库和表中删除行但保留在同一页面Laravel

2 个答案: