如何更新表单内容

时间:2012-08-29 18:17:10

标签: asp.net-mvc-3

我正在使用asp.net mvc 3创建一个Web应用程序。

有一个表格:

@using (Html.BeginForm())
{
<div>
    <fieldset>
        <legend>Approvals</legend>
        <div>
            @Html.Label("Ticket ID")
            @Html.DropDownList("TicketID")
        </div>
        <div>
            @Html.Label("Distributor ID")
            @Html.TextBox("DistributorID", null, new { @readonly = "readonly" })
        </div>
        <div>
            @Html.Label("Description")
            @Html.TextArea("Description", new { @readonly = "readonly" })
        </div>
        <div>
            @Html.Label("Resolved")
            @Html.DropDownList("Resolved")
        </div>
        <div>
            @Html.Label("Date (yyyy/mm/dd)")
            @Html.TextBox("Date")
        </div>
        <div>
            @Html.Label("Time (HH:mm:ss)")
            @Html.TextBox("Time")
        </div>
    </fieldset>
    <input type="submit" value="Approve / Disapprove" />
</div>
}

每当从TicketID下拉列表中选择故障单ID时,如何在从数据库读取值后更新其他字段的数据。即每当票证ID被更改时,相应的其他字段中的数据应该在从特定票证ID的数据库中读取数据后更改,而不提交表单。

2 个答案:

答案 0 :(得分:1)

您可以使用ajax执行此操作:

$('select[name=TicketID]').change(function(){
    var selectedValue = $(this).find('option:selected').val();
    $.getJSON('/mycontroller/MyAction', selectedValue,
    function(result){
        $('input[name=DistributorID]').val(result.DistributorID);
        $('input[name=Description]').val(result.Description);
        $('input[name=Resolved]').val(result.Resolved);
        $('input[name=Date]').val(result.Date);
        $('input[name=Time]').val(result.Time);
    });
});

在控制器中:

public JsonResult MyAction(int selectedValue)
{
    var result = new
    {
        DistributorID = 1,
        Description = 1,
        Resolved= 1,
        Date= 1,
        Time= 1
    };
    return Json(result, JsonRequestBehavour.AllowGet);
}

很抱歉我可能遇到语法错误,我已经直接在这里写了代码

答案 1 :(得分:0)

你可以通过jquery ajax post调用一个返回json结果的动作。

动作会返回你想要的东西。

$('#TicketID').change(function(){
   $.ajax({
     url: '/ActionThatReturnsJsonResult',
     cache: false,
     type: 'post'
     success: function (data) {
         $('#DistributorID').val(data.DistributorIDFromDataBase);
     },
     error: function (e) {
         alert(e.responseText);                            
     }
   });
});