在TinyMCE textarea中,只需单击两次即可提交textarea的值

时间:2015-01-09 15:01:51

标签: php jquery html forms tinymce

我在提交表单之前使用Tinymce作为文本编辑器来编辑一些文本。然后我使用jQuery提交表单而不加载页面,但是当我提交表单时,需要两次单击才能提交​​textarea的值..

以下是我的表单代码:

<div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">Write News Release</h1>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <span id="result"></span>
            <div class="panel panel-default">
            <div class="panel-heading">News release form</div>
                <div class="panel-body">
                    <form id="myForm" action="dataentry/save_data.php" method="post">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Story date</label>
                                <div class="controls">
                                    <div class="input-group">
                                        <input type="text" name="date_story" id="date_story" class="datepicker form-control"  placeholder="choose date">
                                        <label for="date-picker-2" class="input-group-addon btn"><span class="glyphicon glyphicon-calendar"></span></label>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label>Writer/Author</label>
                                <input type="text" name="writer" id="writer" class="form-control"  placeholder="Enter Name">
                            </div>
                            <div class="form-group">
                                <label>Headline</label>
                                <input type="text" name="headline" id="headline" class="form-control"  placeholder="Enter headline">
                            </div>
                            <div class="form-group">        
                                <label>Source</label>
                                <input type="text" name="source" id="source" class="form-control"  placeholder="Enter source">
                            </div>
                        </div>
                        <div class="col-lg-10">
                            <div class="form-group">
                                <label>Story</label>
                                <textarea name="story" id="story" class="form-control" rows="10"></textarea>
                            </div>
                            <div class="form-group">        
                                <label>Keywords</label>
                                <input type="text" name="keywords" id="keywords" class="form-control"  placeholder="Enter keywords separated by comma(,)">
                            </div>
                            <input type="hidden" name="save" value="nr">    
                            <button id="submit" name="submit" class="btn btn-primary">Submit</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script src="../js/save_data_admin.js"></script>
    <script src="../js/jquery-1.11.2.js"></script>
    <script src="//tinymce.cachefly.net/4.1/tinymce.min.js"></script>
    <script>tinymce.init({selector:'textarea'});</script>

,这是在save_data_admin.js中:

我alredy使用tinyMCE.triggerSave()和其他getContent但是当我尝试按钮时不提交表单。

 $("#submit").click(function() {
    //tinyMCE.triggerSave();
    $.post( $("#myForm").attr("action"), $("#myForm :input").serializeArray(), function(save){   $("#result").html(save); } );
    clearInput();
});

$("#myForm").submit(function(){
    return false;
});

function clearInput(){
    $('input[type="text"], input[type="date"], textarea').val('');
}

和save_data.php:

<?php
session_start();
include_once '../../include/CsppoAdmin.php';
$csppoAdmin = new CsppoAdmin();

//echo $_POST['date_story']." ".$_POST['writer']." ".$_POST['headline']." ".$_POST['source']." ".$_POST['story']." ".$_POST['keywords'];

if ($_REQUEST['save']=='nr')
{
   if (!empty($_REQUEST['date_story']) && !empty($_REQUEST['writer']) && !empty($_REQUEST['headline']) && !empty($_REQUEST['source']) &&!empty($_REQUEST['story']) && !empty($_REQUEST['keywords'])) {
    extract($_REQUEST);
    $register = $csppoAdmin->add_news_release($date_story,$writer,$headline,$source,$story,$keywords);
    if ($register)
        echo '<p style="color:green">News release was successful saved!</p>';
    else
        echo '<p style="color:red">Failed. Inputted already exits please try again.</p>';
    }else
        echo '<p style="color:red">Fill up all fields</p>';
}
?>

1 个答案:

答案 0 :(得分:0)

Maby是这样的:

$("#myForm").submit(function(){

    tinyMCE.triggerSave(); //must called. fills the hidden textarea

    //format some data maby?

    //post the data 
    $.post( $("#myForm").attr("action"), $("#myForm :input").serializeArray(), function(save){   $("#result").html(save); } );

    return false;
});