javascript - Laravel：javascript由于某些原因无法正常工作

问题描述

我必须开发一个 CRUD 功能来管理数据库。按钮 EDIT 和 DELETE 打开模态窗口并与 DB 交互。我无法得到的是该脚本非常适合 EDIT，但似乎被 DELETE 忽略了......有什么问题？

这些是我的路线：

Route::get('/', 'DataController@overview');

Route::get('/myproject', 'ProjectsController@getForm');
Route::post('/myproject/create', 'ProjectsController@create');
Route::post('/myproject/update', 'ProjectsController@update');
Route::post('/myproject/delete', 'ProjectsController@delete');


Route::get('/upload','DataController@showform');
Route::post('/upload', 'DataController@read_xsl');
Route::get('/jobcontents', 'DataController@showscrape');
Route::post('/jobcontents', 'DataController@scrape');

这是我的控制器：

public function update(Request $request)
    {
        #$projectID = \DB::table('projects')->select('id')->get(),
    try
    {
        //Find the project id in Project_model
        #var_dump($request->toArray());
        #var_dump($request->get('id'));
        #exit;
        $project = Project_model::findOrFail($request->get('id'));

        //Set project object attributes
        $project->name = $request->get('name');
        $project->description = $request->get('description');

        // Save/update project.
        $project->save();

        #return view('form_project')->with('project', $project);
        return redirect()->back()->with('project', $project);
        #return back();
    }

    catch(ModelNotFoundException $err)
    {
        return redirect()->action('ProjectsController@getForm');
    }


}


public function delete(Request $request)
{
    try
    {
        var_dump($request->toArray());
        exit;            
        $project = Project_model::findOrFail($request->get('id'));
        $project->delete();
        return redirect()->back()->with('project', $project);
    }

    catch(ModelNotFoundException $err)
    {
        return redirect()->action('ProjectsController@getForm');
    }

}

这是我的刀片：

//search and retrieve data from Modal
$(document).ready(function() {
  $('#editModal').on('show.bs.modal', function(event) {
    var button = $(event.relatedTarget)

    var name = button.data('myname')
    var description = button.data('mydesc')
    var project_id = button.data('projectid')

    var modal = $(this)

    //put the values in modal <input>
    modal.find('.modal-body #name').val(name);
    modal.find('.modal-body #description').val(description);
    modal.find('.modal-body #project_id').val(project_id);
  })

  $('#deleteModal').on('show.bs.modal', function(event) {
    var button = $(event.relatedTarget)
    var projctid = button.data('projid')
    var modal = $(this)
    modal.find('.modal-body #projid').val(projctid);
  })

});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

<div class="container">
  <h3 class="jumbotron">Create here your project</h3>

  <form method="post" id="projectform" class="w3-container w3-light-grey" action={{action( 'ProjectsController@create')}} enctype="multipart/form-data">
    {{csrf_field()}}
    <p>
      <label>Project Name</label>
      <input class="w3-input w3-border w3-round" name="name" type="text"></p>
    <p>
      <label>Project Description</label>
      <input class="w3-input w3-border w3-round" name="description" type="text"></p>

    <button type="submit" class="btn btn-primary" style="margin-top:10px">Create Project</button>
  </form>

</div>

<div class="container-fluid">
  <h3 class="jumbotron">Your Projects</h3>
  <div class="table-responsive">
    <table class="table table-bordered table-striped">
      <thead>
        <tr>
          <th>ID</th>
          <th>name</th>
          <th>description</th>
          <th>created_at </th>
          <th>updated_at </th>
        </tr>
      </thead>
      <tbody>
        @if(isset($project_data)) @foreach($project_data as $project)
        <tr>
          <td> {{$project->id}} </td>
          <td> {{$project->name}} </td>
          <td> {{$project->description}} </td>
          <td> {{$project->created_at}} </td>
          <td> {{$project->updated_at}} </td>
          <td>
            <button type="button" class="btn btn-warning btn-detail open-modal" data-projectid="{{$project->id}}" data-myname="{{$project->name}}" data-mydesc="{{$project->description}}" data-toggle="modal" data-target="#editModal">Edit</button>

            <button type="button" class="btn btn-danger btn-delete open-modal" data-projid="{{$project->id}}" data-toggle="modal" data-target="#deleteModal">Delete</button>

            <button class="btn btn-info">See Jobs</button>
          </td>
        </tr>
        @endforeach @endif
      </tbody>
    </table>
  </div>
</div>

<!-- Modal (Pop up when edit button clicked) -->
<div class="modal" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h3 class="modal-title" id="editModalTitle">Edit your project</h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body">
        <form method="post" action={{action( 'ProjectsController@update')}} id="frmSave" name="frmSave" class="form-horizontal" role="form">
          {{csrf_field()}}
          <input type="hidden" name="id" id="project_id">
          <div class="form-group">
            <label for="name" class="col-sm-3 control-label">Project Name</label>
            <div class="col-sm-9">
              <input type="text" class="form-control" id="name" name="name" placeholder="" value="">
            </div>
          </div>
          <div class="form-group">
            <label for="description" class="col-sm-3 control-label">Description</label>
            <div class="col-sm-9">
              <input type="text" class="form-control" id="description" name="description" placeholder="" value="">
            </div>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="submit" form="frmSave" class="btn btn-primary" id="btn-save" value="add">Save changes</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<!-- Modal (Pop up when delete button clicked) -->
<div class="modal" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h3 class="modal-title" id="deleteModalTitle">Delete your project</h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body">
        <form method="post" action={{action( 'ProjectsController@delete')}} id="frmDel" name="frmDel" class="form-horizontal" role="form">
          {{csrf_field()}}
          <input type="hidden" name="id" id="projid">
          <p class="text-center">
            Are you sure you want to delete this?
          </p>
        </form>
      </div>
      <div class="modal-footer">
        <button type="submit" form="frmDel" class="btn btn-primary" id="btn-delete" value="">Yes, delete!</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">No, don't!</button>
      </div>
    </div>
  </div>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

---编辑---
这些是我运行 console.log(button) 和 console.log(projctid) 时的结果

标签： javascriptlaravelbootstrap-modal

javascript - Laravel：javascript由于某些原因无法正常工作

问题描述

解决方案

推荐阅读