Ckeditor Jquery 发布数据问题

Question

我在jquery中使用MVCCkeditor时遇到了一个问题。

我的代码如下所示：

<textarea id="typingarea" placeholder="select language before entering question" class="textarea" style="height: 150px"></textarea>
<script type="text/javascript">
CKEDITOR.replace('typingarea');
</script>

我正在尝试使用提交按钮上的jQuery发布数据

$('#btnSaveQuestion').click(function() {
var QuestCont = CKEDITOR.instances['typingarea'].getData();
alert(QuestCont)
if ($(this).text() != "Update Question") {
var postData = {
"QuestionCategoryID": $("#ddlQuestionCategory").val(),
"QuestionSubCategoryID": $("#ddlQuestionSubCategory").val(),
"QuestionLanguageID": $("#ddlQuestionLanguageID").val(),
"QuestionTypeID": $("#ddlQuestionType").val(),
"QuestionName": $("#txtQuestionName").val(),
"QuestionTags": $("#tags").val(),
"QuestionContent": QuestCont
};
}
});

我能够从文本区域读取数据作为显示确切值的警报部分。但是无法发布带有"QuestionContent"的数据.post部分在传递空值时工作。模型部件中没有其他问题。

CKEDITOR文本区域中的示例数据

<p>Hi im here</p>

有人可以帮助我吗？

Answer 1

您可以将编辑器内容复制到主文本区域中

var QuestCont = CKEDITOR.instances[$('#typingarea')].getData();
$('#typingarea').val(QuestCont);

然后使用文本区域值作为普通输入

var postData = {
"QuestionCategoryID": $("#ddlQuestionCategory").val(),
"QuestionSubCategoryID": $("#ddlQuestionSubCategory").val(),
"QuestionLanguageID": $("#ddlQuestionLanguageID").val(),
"QuestionTypeID": $("#ddlQuestionType").val(),
"QuestionName": $("#txtQuestionName").val(),
"QuestionTags": $("#tags").val(),
"QuestionContent":$("#typingarea").val() 
};

我会像下面这样编辑代码：

$('#btnSaveQuestion').click(function () {  $("#typingarea").val(CKEDITOR.instances[$(this).attr("id")].getData());
if ($(this).text() != "Update Question") {
var postData = {
"QuestionCategoryID": $("#ddlQuestionCategory").val(),
"QuestionSubCategoryID": $("#ddlQuestionSubCategory").val(),
"QuestionLanguageID": $("#ddlQuestionLanguageID").val(),
"QuestionTypeID": $("#ddlQuestionType").val(),
"QuestionName": $("#txtQuestionName").val(),
"QuestionTags": $("#tags").val(),
"QuestionContent":$("#typingarea").val() 
};

<textarea id="typingarea" placeholder="select language before entering question" class="myckeditor textarea" style="height: 150px"></textarea>

我希望这会有所帮助。

Answer 2

抱歉，我输入了错误的本节。我编辑了它。

$('#btnSaveQuestion').click(function () {  $("#typingarea").val(CKEDITOR.instances[
$("#typingarea").attr("id")].getData());
if ($(this).text() != "Update Question") {
var postData = {
"QuestionCategoryID": $("#ddlQuestionCategory").val(),
"QuestionSubCategoryID": $("#ddlQuestionSubCategory").val(),
"QuestionLanguageID": $("#ddlQuestionLanguageID").val(),
"QuestionTypeID": $("#ddlQuestionType").val(),
"QuestionName": $("#txtQuestionName").val(),
"QuestionTags": $("#tags").val(),
"QuestionContent":$("#typingarea").val() 
};

<textarea id="typingarea" placeholder="select language before entering question" class="myckeditor textarea" style="height: 150px"></textarea>

如果不起作用，请使用以下代码：

$('#btnSaveQuestion').click(function () {  $("#typingarea").val(CKEDITOR.instances[
'typingarea'].getData());
if ($(this).text() != "Update Question") {
var postData = {
"QuestionCategoryID": $("#ddlQuestionCategory").val(),
"QuestionSubCategoryID": $("#ddlQuestionSubCategory").val(),
"QuestionLanguageID": $("#ddlQuestionLanguageID").val(),
"QuestionTypeID": $("#ddlQuestionType").val(),
"QuestionName": $("#txtQuestionName").val(),
"QuestionTags": $("#tags").val(),
"QuestionContent":$("#typingarea").val() 
};

<textarea id="typingarea" placeholder="select language before entering question" class="myckeditor textarea" style="height: 150px"></textarea>

Answer 3

你可以像下面这样通过ajax来做到这一点：

维尤

<script>
$('#btnSaveQuestion').click(function () {
var QuestCont = CKEDITOR.instances['typingarea'].getData();
var postData = {
"QuestionCategoryID": $("#ddlQuestionCategory").val(),
"QuestionSubCategoryID": $("#ddlQuestionSubCategory").val(),
"QuestionLanguageID": $("#ddlQuestionLanguageID").val(),
"QuestionTypeID": $("#ddlQuestionType").val(),
"QuestionName": $("#txtQuestionName").val(),
"QuestionTags": $("#tags").val(),
"QuestionContent": QuestCont
};
if ($(this).text() != "Update Question") {
$.ajax({
url: yourUrl,
contentType: "application/json; charset=utf-8",
dataType: "json",
type: "POST",
data: JSON.stringify(postData),
success: function () { alert('Success'); },
error: function () { alert('Error'); }
});
}
});
</script>

控制器

[HttpPost]
public ActionResult testAction(Question postData) 
{
// Do somethings
}

Question是在Action中使用它所需的类。