Submitting a Hidden Field with Form post

pablojoycey

Hi,

Using data tables along with ASP.NET MVC Razor.

I added Datatables to a form and the form no longer submits a hidden ID field

       <div>
            <table id="table_id" class="table table-bordered" style="border-bottom: 0px solid #111 !important;border-top: 1px solid whites !important;">
                <thead>
                    <tr>
                        <th style="border-bottom: 0px solid #111 !important;" class="no-sort">@Html.CheckBox("selectall")</th>
                        <th style="border-bottom: 0px solid #111 !important;">Name</th>
                        <th style="border-bottom: 0px solid #111 !important;" class="no-sort">Notes</th>
                        <th style="border-bottom: 0px solid #111 !important;">Charge<br />per hour</th>
                        <th style="border-bottom: 0px solid #111 !important;" class="no-sort">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @for (int i = 0; i < Model.ProjectRows.Count(); i++)
                    {
                        @Html.HiddenFor(m => m.ProjectRows[i].ProjectID)
                        <tr id="row-@i" data-row-index=@i>                          
                            <td>@Html.CheckBoxFor(m => m.ProjectRows[i].Selected, new { id = "projectSelector-" + @i, @class = "projectSelector" })</td>
                            <td>@Html.DisplayFor(m => m.ProjectRows[i].Name)</td>
                            <td>@Html.Shorten(Model.ProjectRows[i].Notes, MAX_DESC_LENGTH)</td>

ETC....

Any idea how I can get the hidden field to submit?

bindrid

If you are trying to put the hidden between the tbody and the tr tags, that is not going to work. Nothing should be between those tags. Have you checked to see if those fields are even there after your page has loaded?

pablojoycey

Yes the value is there in source.

If I remove Datatables the postback works just fine.

            <table id="table_id" class="table table-bordered" style="border-bottom: 0px solid #111 !important;border-top: 1px solid whites !important;">
                <thead>
                    <tr>
                        <th style="border-bottom: 0px solid #111 !important;" class="no-sort"><input id="selectall" name="selectall" type="checkbox" value="true" /><input name="selectall" type="hidden" value="false" /></th>
                        <th style="border-bottom: 0px solid #111 !important;">Name</th>
                        <th style="border-bottom: 0px solid #111 !important;" class="no-sort">Notes</th>
                        <th style="border-bottom: 0px solid #111 !important;">Charge<br />per hour</th>
                        <th style="border-bottom: 0px solid #111 !important;" class="no-sort">Actions</th>
                    </tr>
                </thead>
                <tbody>
<input data-val="true" data-val-number="The&#32;field&#32;ProjectID&#32;must&#32;be&#32;a&#32;number." data-val-required="The&#32;ProjectID&#32;field&#32;is&#32;required." id="ProjectRows_0__ProjectID" name="ProjectRows[0].ProjectID" type="hidden" value="4849" />                        <tr id="row-0" data-row-index=0>
                            <td><input class="projectSelector" data-val="true" data-val-required="The&#32;Selected&#32;field&#32;is&#32;required." id="projectSelector-0" name="ProjectRows[0].Selected" type="checkbox" value="true" /><input name="ProjectRows[0].Selected" type="hidden" value="false" /></td>
                            <td>Denis&#39; Sexy Project </td>
                            <td>Ni hao!</td>
                            <td>0.00</td>
                            <td>

allan

The problem is that DataTables expects valid HTML and as @bindrid says having an input element as the child of a tbody is not valid HTML.

You could move the input element into the first td in the row and that would make it valid.

Allan

pablojoycey

Thanks that sorted it