Question

我认为这是一个简单的场景，我必须生成具有RTE功能的多个textareas。我正在使用TinyMce，如果我只有一个textarea，但其他人没有。我创建了一个简单的示例MVC 4应用程序，试图在将我的新知识迁移到真实应用程序之前将其全部工作。此页面上还有其他项目都可以编辑，因此问题可能源于html帮助程序。或者从结果html显示所有三个textareas具有相同id的事实。但是，由于代码显然没有引用id我不认为我会重要。有人知道吗？

我有一个简单的模型：

TextModel text = new TextModel();
text.P1 = "This is an editable element.";

我在我的BundleConfig文件中包含了TinyMce，然后在我的_Layout中。然后我有一个强烈的类型视图。

@model TinyMCE_lite.Models.TextModel

一个脚本部分，用于扩展我的textareas焦点：

<script>
$(window).load(function () {
$('textarea.expand').focus(function () {
        $(this).addClass("expanding")
        $(this).animate({
            height: "10em"
        }, 200);
    });
    $('textarea.expand').blur(function () {
        $(this).animate({
            height: "28px"
        }, 100);
        $(this).removeClass("expanding")
    });
});

然后我在循环中敲出三个：

@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
<fieldset>
    <h1 class="editable">Editable header</h1>

    @for (int count = 0; count < 3; count++ )
    {
        int index = count + 1;
        <h3>@index</h3>
        <p class="editable">@Html.DisplayFor(model => model.P1)</p>
        @Html.TextAreaFor(model => model.P2, 0,0, new { @class = "expand" })
    }

    <div style="margin-top: 25px;"><input type="submit" value="Save" /></div>
</fieldset>
}

第一个按预期运行，显示编辑器元素，但不显示其他元素。三者都如预期一样扩大。希望我忽略了一些简单的事情。有什么想法吗？

Answer 1

哇！原来它是相同的ID。我所要做的就是创建独特的ID，它可以很好地工作。我改变了这个：

@Html.TextAreaFor(model => model.P2, 0,0, new { @class = "expand" })

到此：

@Html.TextAreaFor(model => model.P2, 0,0, new { @class = "expand", id = @count })

希望这可以防止其他人在数小时的痛苦中试图解决这个问题。

如何在MVC 4应用页面中动态地在同一页面上使用TinyMCE获取多个textareas？

1 个答案: