EnVisageOnline/Main/Source/EnVisage/Views/Scenarios/_copyToModal.cshtml

@using System.Web.Mvc.Html
@using EnVisage.Code
@using EnVisage.Models
@model ScenarioCopyModel

<script type="text/javascript">
    var _copytoDataChanged = false;
    function onCTDataChanged() {
        _copytoDataChanged = true;
    }
    function resetCTDataChanged() {
        _copytoDataChanged = false;
    }
    function isCTDataChanged() {
        return _copytoDataChanged;
    }
    function switchStatusCB() {
        var status = $("#@Html.IdFor(x=>x.TargetStatus)").val();
        if (status === "Active")
            $("#@Html.IdFor(x=>x.TargetStatus)").val("Inactive");
        else
            $("#@Html.IdFor(x=>x.TargetStatus)").val("Active");
    }
    function switchCostSavingsCB() {

        var status = $("#@Html.IdFor(x=>x.includeCostSavings)").val();
        if (status === "true")
            $("#@Html.IdFor(x=>x.includeCostSavings)").val(false);
        else
            $("#@Html.IdFor(x=>x.includeCostSavings)").val(true);
    }

    init.push(function () {
        initControls();
        $('#copyToForm').find('input[type=checkbox],input[type=text],select,textarea').on("change", function () {
            if (typeof onCTDataChanged === 'function')
                onCTDataChanged();
        });
    });

    function initControls() {

        $("#@Html.IdFor(model => model.TargetProjectId)").select2({
            allowClear: true
        }).on('select2-selecting', function (e) {
            if (e.val === '') {
                e.preventDefault();
            }
        });

        $('#chStatus').switcher({
            on_state_content: 'Active',
            off_state_content: 'Inactive'
        });
        $('#chStatus').parent().css("width", "90px");


        $('#includeSav').switcher({
            on_state_content: "Include",
            off_state_content: "Exclude"
        });
        $('#includeSav').parent().css("width", "90px");
    }

</script>

@using (Ajax.BeginForm("CopyTo", "Scenario", 
    new AjaxOptions { HttpMethod = "Post", OnSuccess = "onCopyToSuccess", OnFailure = "onCopyToFailure", OnBegin = "blockUI", OnComplete = "unblockUI" }, 
    new { id = "copyToForm" }))
{
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <h4 class="modal-title">Copy To</h4>
    </div>
    <div class="modal-body" style="max-height:400px;overflow-y:auto;">
        @Html.ValidationSummary(false, "The Scenario could not be copied due to the following errors:")

        @Html.HiddenFor(model => model.ScenarioId)
        @Html.HiddenFor(model => model.TargetStatus)
        @Html.HiddenFor(model => model.includeCostSavings)
        <div class="panel-body" style="border: 0;" id="copy-to-body">
            <div class="row">
                <div class="col-sm-12">
                    <div class="form-group no-margin-hr">
                        <div style="float:left;margin:3px 3px 10px 0;">Copy as </div><input type="checkbox" onclick="switchStatusCB();" id="chStatus" name="chStatus" class="switcher" />
                    </div>
                </div>
            </div>
            <div class="row" style="display:@(Model.hasCostSavings? "block" : "none")">
                <div class="col-sm-12">
                    <div class="form-group no-margin-hr">
                        <div style="float:left;margin:3px 3px 10px 0;">Cost Savings </div>
                        <input type="checkbox" onclick="switchCostSavingsCB();" id="includeSav" name="includeSav" class="switcher" />
                    </div>
                </div>
            </div>


            <div class="row">
                <div class="col-sm-12">
                    <div class="form-group no-margin-hr">
                        @Html.LabelFor(model => model.TargetProjectId, new { @class = "control-label" })
                        @Html.DropDownListFor(m=>m.TargetProjectId, Model.Projects, new
                   {
                       @class = "form-control forselect2 type",
                       data_val = "true",
                       data_val_required = "Target Project is required."
                   })                    
                        
    @*<select class="form-control forselect2 type" data-val="true" data-val-required="Target Project is required." id="@Html.IdFor(m => m.TargetProjectId)" name="@Html.NameFor(m => m.TargetProjectId)">
                            @{
                                bool openGroup = false;
                                foreach (var project in Utils.GetProjectsToScenarioCopy(Model.TargetProjectId, User.Identity.GetUserName()))
                                {
                                    if (project.Value == "")
                                    {
                                        if (openGroup)
                                        {
                                            @Html.Raw("</optgroup>")
                                        }
                                        <text>
                                            <optgroup label="@project.Text">
                                        </text>
                                        openGroup = true;
                                    }
                                    else
                                    {
                                        <text>
                                            <option value="@project.Value">@project.Text</option>
                                        </text>
                                    }
                                }
                            }
                    </select>*@
                    @Html.ValidationMessageFor(model => model.TargetProjectId)
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- / .modal-body -->
    <div class="modal-footer">
        <button type="submit" class="btn btn-primary" id="btnCopySubmit">@Resources.Buttons.Common_Ok</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">@Resources.Buttons.Common_Cancel</button>
        <div class="spinner" style="display:none"></div>
    </div>
}