為提交按鈕創建JavaScript函數以返回數據

Question

我正在laravel上創建博客，到目前為止，我已經成功地為包含標題和內容的帖子編寫了js代碼。 但是我在為標簽編寫js函數時遇到了一些麻煩。

我想對標簽做同樣的事情，但是我嘗試的所有內容都出現錯誤。

  <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: '.myeditablediv', 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); }); }); </script>

 <!DOCTYPE html> <html> <head> </head> <body> <h1>Create the title</h1> <form> {{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="myeditablediv">Click here to edit the content of your post!</div> </form> <input type="button" name="Submit" id="SubmitBtn" value="Submit"/> </body> </html>

 <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: '.myeditabletag', // change this value according to your HTML menu: { view: {title: 'Edit', items: 'cut, copy, paste'} }, save_onsavecallback: function () { var content = tinymce.activeEditor.getContent(); console.log(content); } }); $(document).on('click', '#SubmitBtn', function () { var name = tinymce.activeEditor.getContent(); var data = { 'name': name, '_token': '{{csrf_token()}}' }; $.post('/postTags', data, function () { console.log(data); }); }); </script>

 <!DOCTYPE html> <html> <head> </head> <body> <h1>Create a new Tag</h1> <form> {{csrf_field()}} {{--<input type="text" name="name" id="name"/>--}} <div class="myeditabletag">Click here to edit the name of your tag!</div> </form> <input type="button" name="Submit" id="SubmitBtn" value="Submit"/> </body> </html>

這是標簽和帖子的/ postData的路由：

Route::post('/postTags', ['uses' => 'TagController@store']);
Route::post('/postData', ['uses' => 'PostController@store']);

這是PostController和TagController存儲方法：

public function store(Request $request)
{
    $post = new Post;
    $post->title = $request['title'];
    $post->content = $request['content'];
    $post->save();
}

public function store(Request $request)
{
    $tag = new Tag;
    $tag->name = $request['name'];
    $tag->save();
}

Answer 1

您的JS代碼有誤。 您選擇的ID不存在。 您需要選擇更改后的標簽的內容，並將其作為數據['name']發送。 嘗試以下代碼：

<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: '.myeditabletag',  // change this value according to your HTML
        menu: {
            view: {title: 'Edit', items: 'cut, copy, paste'}
        },
        save_onsavecallback: function () {
            var content = tinymce.activeEditor.getContent();
            console.log(content);
        }
    });

    $(document).on('click', '#SubmitBtn', function () {
        var name = tinymce.activeEditor.getContent();

        var data = {
            'name': name,
            '_token': '{{csrf_token()}}'
        };

        console.log(data);
        $.post('/postTags', data, function () {

        });
    });

</script>

為提交按鈕創建JavaScript函數以返回數據

問題描述

1 個解決方案

解決方案1
1 已采納 2017-07-13 10:40:09

為提交按鈕創建JavaScript函數以返回數據

問題描述

1 個解決方案

解決方案1 1 已采納 2017-07-13 10:40:09

解決方案1
1 已采納 2017-07-13 10:40:09