Question

我的网站有一个简单的表格，可以输入订单详情。我想最初显示一个“计算价格”按钮。只有计算一次价格后，才会显示“下订单”按钮。

我的观点如下：

@using (Html.BeginForm("PlaceOrder", "Order"))
{
    <div id="OrderEntry" class="listWithoutBullets">
        <ul>
            <li>Name: @Html.TextBoxFor(m => Model.Name)</li>
            <li>Address Line 1: @Html.TextBoxFor(m => Model.Address1)</li>
            <li>Address Line 2: @Html.TextBoxFor(m => Model.Address2)</li>
            <li>Postcode: @Html.TextBoxFor(m => Model.Postcode)</li>

            <li>Number of Single Photos: @Html.TextBoxFor(m => Model.SinglePhotos)</li>
            <li>Number of Show Boxes Filled with Photos: @Html.TextBoxFor(m => Model.ShoeBoxes)</li>

            <li>Require Digital Images on DVD: @Html.CheckBoxFor(m => Model.DVD)</li>
            <li>Require Digital Images on USB Memory Stick: @Html.CheckBoxFor(m => Model.USBMemory)</li>

            <li>Discount Code: @Html.TextBoxFor(m => Model.DiscountCode)</li>                    
        </ul>    
    </div>

    <div id="OrderPricing">
        <ul>    
            <li>Total Exc VAT: £@Html.DisplayFor(m => Model.TotalExcVat,null,"lblTotalExcVat")</li>
            <li>Total Inc VAT: £@Html.DisplayFor(m => Model.TotalIncVat,null,"lblTotalIncVat")</li>            
        </ul>
    </div>

    @Html.HiddenFor(m => Model.CalculatePrice);

    if (Model == null)
    {
        <input type="submit" value="Calculate Price" onclick="setCalculatePriceOn" />
    }
    else
    {
        if (Model.TotalExcVat > 0)
        {
            <input type="submit" value="Place Order" onclick="setCalculatePriceOff" />
            <input type="submit" value="Calculate Price" onclick="setCalculatePriceOn" />
        }
        else
        {
            <input type="submit" value="Calculate Price" onclick="setCalculatePriceOn" />
        }
    }        
}

为了设置隐藏的布尔模型字段“CalcualtePrice”，我添加了以下java脚本（我对java脚本一无所知）：

<script type="text/javascript">

function setCalculatePriceOn() {
    jQuery("#CalculatePrice").val('true');
}

function setCalculatePriceOff() {
    jQuery("#CalculatePrice").val('false');
}

javascript，我只是添加到我的cshtml文件的脚下。

在控制器中，我检查是否已设置“CalculatePrice”的模型布尔字段来决定用户是否正在尝试计算价格或下订单。

我的问题是java脚本似乎没有运行。我是否需要将其绑定到click事件或其他内容？整个cshtml页面现在看起来过于复杂和混乱，因为我试图解决提交计算与下订单的问题。我最初尝试通过检查控制器中的http动词来解决这个问题（GET用于计算价格和PUT用于下订单）但我似乎无法覆盖“Html.BeginForm”使用的动词，这取决于单击了哪个按钮。

希望有人会有一个简洁的解决方案，我认为必须是一个相当常见的用例，计算价格/地点顺序？

Answer 1

仔细看看这个，我认为它会对你有所帮助：How do you handle multiple submit buttons in ASP.NET MVC Framework?听起来你有多个提交按钮问题。

Answer 2

尝试使用onclick的onsubmit事件insteat并添加一个return语句。新按钮就像

<input type="submit" value="Calculate Price" onsubmit="return setCalculatePriceOn();" />

并且javascript函数将是

function setCalculatePriceOn() {
    jQuery("#CalculatePrice").val('true');
    return true;
}

function setCalculatePriceOff() {
    jQuery("#CalculatePrice").val('false');
    return true;
}

这将确保在表单提交之前更新隐藏字段的值。

MVC 4计算价格/下订单模式

2 个答案: