Razor Ajax form not submitting when converting string to html string

Question

I'm new to razor and display templates so please correct me where I'm wrong. I'm working with a string that contains HTML. If I try converting it directly to a HtmlString, my Ajax form refuses to submit. As a workaround I tried to use Display templates with the goal of achieving something like this:

I have a partial view with an ajax form:

MyPartialView.cshtml

@model IEnumerable<MyProject.Areas.MyArea.Models.MyComment>

@using (Ajax.BeginForm("ActionThatHandlesMulipleSubmits", null,
new AjaxOptions
{
    HttpMethod = "POST", // HttpPost
    InsertionMode = InsertionMode.Replace, // empty the target first
    UpdateTargetId = "commentTbl" // place content within #commentTbl
}, new { @class = "form-inline" }))
{
<div class="ibox float-e-margins">
    <div class="ibox-title">...</div>
    <div class="ibox-content">
        <div class="table-responsive">
            <table id="dataTables-comments">
                <thead>...</thead>
                <tbody>
                    @{int i = 0;}
                    @foreach (var myModel in Model)
                    {
                        <tr>
                            <td>
                               <div id="summernote_@i" onclick="loadRichTextEditor(@i);">@Html.DisplayFor(modelItem => myModel.myString, "HtmlString")
                            </td>
                            <td>
                                <button type="submit" id="save_@i" class="btn   btn-primary" name="Save" value='submitAction'>Save</button>
                                <button type="submit" id="delete_@i" class="btn   btn-primary" name="Delete" value='submitAction'>Delete</button>
                            </td>
                        </tr> i++;
                    }
                </tbody>
            </table>
        </div>
    </div>
</div>
}

My @foreach loop contains this

 @Html.DisplayFor(modelItem => myModel.myString, "HtmlString")

My DisplayTemplate contains this

HtmlString.cshtml

@model String

@{
    @Html.Raw(Model)
}

So if myString = "<ul><li>my text</li></ul>"

I would like my ajax form to display

my text

Now the the text displays correctly, but the form refuses to submit. If I were to display the string as normal, the form would submit with no problems. Please help with what I'm doing wrong.

UPDATE: Below is the rendered HTML source of the form

is the problem that the form does not submit, or that the post does not contain the mytext string? — Glubus, May 11 '16 at 11:59
Can you post the html source of the form after the page has been rendered? — Glubus, May 11 '16 at 12:15
I tried `` and got the same result. Form doesn't submit. I checked that the spelling of the action was correct as this works without `@Html.Raw`. I tried checking the console and I get `Failed to load resource: the server responded with a status of 500 (Internal Server Error) http://localhost:59328/MyArea/MyComment/ActionThatHandlesMultipleSubmits?Length=7` — usr4896260, May 11 '16 at 12:47
First of all you need to do ``. Secondly, if the response status is 500, it means that the action you're sending the form to is getting a runtime error. This means that you need to debug your server side code. Your form is actually pushing, otherwise you would not get a response from the server! — Glubus, May 11 '16 at 12:50

score 0 · Accepted Answer · answered May 11 '16 at 16:46

So it turns out this is had nothing to do with my view but rather the controller. From my understanding, since I was sending HTML back to the server, this was causing issues. I added

[ValidateInput(false)]

to the Action in the controller and it works perfectly now. So my controller looks like this:

[HttpPost]
[ValidateInput(false)]
public void ActionThatHandlesMultipleSubmits(MyComment mycomment, String submitAction)

Razor Ajax form not submitting when converting string to html string

1 Answers1