@using EnVisage.Models
@model ScenarioDetailModel
<script type="text/javascript">
    function onExpCatsChange()
    {
        if (!changesMade || confirm('Scenario calendar contains unsaved changes that will be lost. Are you sure you want to proceed?')) {
            blockUI();
            $(window).off('beforeunload');
            return true;
        }
        else
            return false;
    }
    function onChangeExpCatsFailure(xhr) {
        $('#expendituresModal').html(xhr.responseText);
        $(".datepicker").datepicker();
        unblockUI();
    }
    function onChangeExpCatsSuccess(data) {
        $(".datepicker").datepicker();
        document.location.href = document.location.href;
        unblockUI();
    }
</script>

@using (Ajax.BeginForm("ChangeExpenditures", "Scenario", new AjaxOptions {HttpMethod = "Post", OnSuccess = "onChangeExpCatsSuccess", OnFailure = "onChangeExpCatsFailure", UpdateTargetId = "expendituresModal"}, new {@id = "expcatsForm"}))
{
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <h4 class="modal-title" >Expenditures</h4>
    </div>
    <div class="modal-body" style="max-height: 400px; overflow-y: auto;">
        @Html.ValidationSummary(false, "The Scenario Expenditure Categories could not be saved due to the following errors:")
        @Html.HiddenFor(x => x.Id)
        @Html.HiddenFor(x => x.ParentId)
        @Html.Partial("_expenditures", Model.ScenarioExpenditures)
    </div>
    <!-- / .modal-body -->
    <div class="modal-footer">
        <button type="submit" class="btn btn-primary" onclick="return onExpCatsChange();">OK</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
}