Question

我在MVC视图中有以下使用代码

@using (Html.BeginForm("BondCompletion", "HrReport", FormMethod.Get))
{
<table class="table-bordered">
    <tr>
        <td>Date : </td>
        <td>@Html.EditorFor(x => x.FirstOrDefault().StartDate)
        </td>
        <td>
            <input id="Submit1" type="submit" value="submit" class="btn btn-primary" />
        </td>
    </tr>
</table>
}

这里我使用的是jQueryUI DatePiker，我修改该piker只显示月份和年份

<script type="text/javascript">
$(document).ready(function () {
    $('input[type=datetime]').datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function (dateText, inst) {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            $(this).datepicker('setDate', new Date(year, month, 1));
        }
    });    

});

</script>

直到这里一切正常，但是当我点击提交按钮时，这个表单不会发布它只显示piker对话框。我想在点击提交按钮时发布表单。我应该修改什么才能在提交按钮点击时发布此表单？

Answer 1

你没有提到你使用的是jQuery UI。

通过定义id为隐藏输入的altField来实现此目的

演示：http://jsfiddle.net/6s9yLem5/1/

<form action="/echo/html/">
    <input type="datetime">
    <input type="hidden" id="myDate" name="myDate">
    <input type="submit">
</form>

$(document).ready(function () {
    $('input[type=datetime]').datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy',
        altField : '#myDate',
        onClose: function (dateText, inst) {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            $(this).datepicker('setDate', new Date(year, month, 1));

        }
    });    

});


$("form").submit(function(){

    $('body').append("Data: "+$(this).serialize());
    return false;
});

如何将此月份和年份的表单发布到控制器操作方法

1 个答案: