在laravel中將視圖綁定在一起以創建博客
[英]Binding views together in laravel to create a blog
問題描述
我是Laravel的新手，在將視圖綁定在一起時遇到了一些困難。 我正在使用Bootsrap，也正在使用tinyMCE作為帖子（標題，內容）的編輯器。 我的創建視圖工作完美，同時也顯示視圖。 我需要的是，當頁面重定向到show.blade.php之后，在創建完所有帖子后，我都希望我的“更新”按鈕將我重定向到我的編輯視圖，在這里我可以進行實際的編輯和更新，最后返回顯示視圖。 先感謝您 ：）
這是我的創建視圖：
<script src="https://cloud.tinymce.com/stable/tinymce.min.js?apiKey=fg5tc8gb4rtw6p9n3njd2hi4965rketxda84pbcfs09hb5x2"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.6.4/tinymce.min.js"></script> <script type="text/javascript"> tinymce.init({ selector: '.editor1', plugins: 'code , save, autoresize , textcolor colorpicker , emoticons, textpattern , wordcount', toolbar: 'save , restoredraft , forecolor backcolor, emoticons', save_onsavecallback: function () { var content = tinymce.activeEditor.getContent(); console.log(content); } }); $(document).on('click', '#SubmitBtn', function () { var content = tinymce.activeEditor.getContent(); var data = { 'title': $('#title').val(), 'content': content, '_token': '{{csrf_token()}}' }; $.post('/postData', data, function () { console.log(data); window.location.href="/posts/show" }); }); </script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> <!DOCTYPE html> <html> <head> </head> <body> <h1>Create the title</h1> <form method="POST" action="{{route("postData")}}"> {{csrf_field()}} <label for="title">Click here to edit the title of your post!</label> <input type="text" name="title" id="title"/> <h1>Create the content</h1> <div class="editor1">Click here to edit the content of your post!</div> <input type="button" name="Submit" id="SubmitBtn" value="Submit"/> </form> </body> </html>
這是我的表演視圖：
<!DOCTYPE html> <html> <head> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> </head> <body> <div class="container"> <table class="table table-bordered"> <thead> <tr> <th>#</th> <th>Id.</th> <th>Title</th> <th>Content</th> <th>Views</th> <th>Action</th> </tr> </thead> <tbody> @foreach($posts as $post) <tr> <th scope="row"></th> <td>{{$post->id}}</td> <td>{{$post->title}}</td> <td>{!! html_entity_decode($post->content) !!}</td> <td>{{$post->view_count}}</td> <td><div class="btn pull-right"> <a href="{{ url('/posts/' . $post->id . '/edit') }}" class="btn btn-primary float-left">Update</a> </div></td> </tr> @endforeach </tbody> </table> </div> </body> </html>
這是我當前的編輯視圖，在瀏覽器中沒有返回任何內容：
<!DOCTYPE html> <html> <head> </head> <body> <h1>Edit Post</h1> <form method="POST"><a href="{{route('posts.show', $post->id)}}"></a> {{csrf_field()}} <div class="form-group"> <label for="title">Title</label> <input type="text" id="title" class="form-control" name="title" placeholder="Title" value="{{$post->title}}"> </div> <div class="form-group"> <label for="content">Content</label> <textarea>{{$post->content}}</textarea> </div> <input type="button" name="Update" value="Update" /> </form> </body> </html>
這是我的路線：
Route::resource('/posts', 'PostController');
Route::get('/posts/create', ['uses' => 'PostController@create', 'as' => 'posts.create']);
Route::post('/postData', ['uses' => 'PostController@store', 'as' => 'postData']);
Route::get('/posts/{id}/edit', ['uses' => 'PostController@edit', 'as' => 'posts.edit']);
Route::get('/post/show', ['uses' => 'PostController@show', 'as' => 'posts.show']);
Route::get('/post/find/{id}', ['uses' => 'PostController@find']);
Route::get('/posts/{id}', ['uses' => 'PostController@update', 'as' => 'posts.update']);
最后是我的控制器：
public function index()
{
$posts = Post::all();
return view('posts.index', compact('posts'));
}
public function create()
{
return view('posts.create');
}
public function store(Request $request)
{
$post = new Post;
$post->title = $request['title'];
$post->content = $request['content'];
$post->save();
return redirect()->route("posts.show");
}
public function show()
{
$posts = Post::all();
return view('posts.show', compact('posts'));
}
public function find($id)
{
$post = Post::find($id);
return $post->title." ".$post->content;
}
public function edit($id)
{
$post = Post::findOrFail($id);
return view('posts.edit', compact('post'));
}
2 個解決方案
解決方案1
0 2017-07-17 14:44:15
基本上，您需要學習laravel中的整個CRUD（創建，讀取，更新和刪除）。 這里有一些基本技巧。 我希望您知道一些基本點，例如Routemodel binding. 非常簡單。
現在，您需要運行php artisan make:controller PostController --resource （資源標志並不重要。）在您的route \\ web.php中，編寫Route::resource('posts', 'PostController');
您的鏈接將是<a href="{{route('posts.index')}}">View all</a> 。 要創建的表單操作將是{{route('posts.store')}} ，您將在其中填寫詳細信息。 在存儲功能中添加
public function store(Request $request){
$data = $request->all();
Post::create($data);
return redirect('posts');
}
確保已放置protected $fillable = []; 值。 在您的刀片中顯示單個帖子，添加：
<td>{{$post->title}}</td>
<td>{{$post->caption}}</td>
<td>{!! html_entity_decode($post->body) !!}</td>
編輯時，正文的文本區域還應具有
<textarea name="body">{!! html_entity_decode($post->body) !!}</textarea>
顯示頁面的鏈接為<a href="{{route('posts.show', $post->id)}}"></a> ，編輯內容為<a href="{{route('posts.edit', $post->id)}}"></a>
確保為每個功能在控制器中添加變量。
public function show($id){
return view('posts.show', [ 'posts' => Post::findorfail($id), ]);
}
與編輯相同。
解決方案2
0 2017-07-18 11:51:44
通過將新的tinymce編輯器添加到編輯視圖中，我解決了很長的路要走：
<script src="https://cloud.tinymce.com/stable/tinymce.min.js?apiKey=fg5tc8gb4rtw6p9n3njd2hi4965rketxda84pbcfs09hb5x2"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.6.4/tinymce.min.js"></script> <script type="text/javascript"> tinymce.init({ selector: '.editor2', plugins: 'code , save, autoresize , textcolor colorpicker , emoticons, textpattern , wordcount', toolbar: 'save , restoredraft , forecolor backcolor, emoticons', save_onsavecallback: function () { var content = tinymce.activeEditor.getContent(); console.log(content); } }); $(document).on('click', '#SubmitBtn', function () { var content = tinyMCE.getContent('.editor1'); var inst, contents = new Post(); for (inst in tinyMCE.editors) { if (tinyMCE.editors[inst].getContent) contents[inst] = tinyMCE.editors[inst].getContent(); } }); </script>
<!DOCTYPE html> <html> <head> </head> <body> <h1>Create the title</h1> <form method="POST" action="{{route("postData")}}"> {{csrf_field()}} <label for="title">Click here to edit the title of your post!</label> <input type="text" name="title" id="title" value="{{ old('title', $post->title)}}"/> <h1>Create the content</h1> <label for="content">Click here to edit the content of your post!</label> <input type="text" name="content" class="editor2" value="{{ old('content', $post->content)}}"/> <input type="button" name="Update" id="SubmitBtn" value="Update"/> <input action="action" type="button" value="Back" onclick="window.history.go(-1); return false;" /> </form> </body> </html>
將兩個變量綁定在一起
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.