Mr.Combet Webshell 🔥

Edit File Name : AddStoryOrCase.cshtml

@model RER_Project.DataAccess.ViewModels.StoryOrCase.StoryOrCaseVM

@{
    ViewBag.Title = "AddStoryOrCase";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content">
                    <label style="font-size: medium"><b>Create Story/Case</b></label>
                    <div class="pull-right">
                        <strong>Download Templates</strong>
                        <a href="/Knowledgemanagement/DownloadFormat/?type=story"><img src="~/Images/ExternalIcon/word.png" width="25" height="25" title="Download Story/Case Template" alt="file" /></a>
                        <a href="/Knowledgemanagement/DownloadFormat/?type=knowledge"><img src="~/Images/ExternalIcon/word.png" width="25" height="25" title="Download Knowledge Template" alt="file" /></a>
                    </div>
                    <hr />
                    <form id="frmStoryOrCase" enctype="multipart/form-data" method="post">
                        <div class="row">
                            <div class="form-group col-md-6">
                                <strong>Component</strong> <b class="red">*</b>
                                <input type="hidden" name="Id" id="Id" value="@Model.Id" />
                                <input type="hidden" id="StatusId" name="StatusId" value="@Model.StatusId" />
                                <select class="form-control required" name="ComponentId" id="ComponentId" data-api="/component/select" data-api-selected-value="@Model.ComponentId"></select>
                            </div>
                            <div class="form-group col-md-6">
                                <strong>Sub-Component</strong> <b class="red">*</b>
                                <select class="form-control required" name="SubComponentId" id="SubComponentId" data-api="/sub-component/select" disabled="" data-api-selected-value="@Model.SubComponentId"></select>
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-group col-md-6 toggle">
                                <strong>Commodity</strong>
                                <select class="form-control" name="CommodityId" id="CommodityId" data-api="/commodity/select" data-api-selected-value="@Model.CommodityId"></select>
                            </div>
                            <div class="form-group col-md-6 toggle">
                                <strong>Group</strong>
                                <select class="form-control" name="GroupId" id="GroupId" onchange="getChange(this)" data-api="/groups/commodity" data-api-selected-value="@Model.GroupId"></select>
                            </div>
                            <div class="form-group col-md-12 toggle">
                                <strong>Member</strong>
                                <select id="MemberId" name="MemberId" class="form-control" data-api="/groups/members/kms-select" multiple></select>
                                <input type="hidden" id="MemberIds" name="MemberIds" value="@Model.MemberIds" />
                            </div>
                            <div class="form-group col-md-6 financial-toggle">
                                <strong>Cooperative</strong>
                                <select class="form-control" name="CoopId" id="CoopId" data-api="/cooperatives/select" data-api-selected-value="@Model.CoopId"></select>
                            </div>
                            <div class="form-group col-md-6 migrant-toggle">
                                <strong>MRC/MID Detail</strong>
                                <select class="form-control" name="MrcMidStaffId" id="MrcMidStaffId" data-api="/knowledgeManagement/mrcMidStaff" data-api-selected-value="@Model.MrcMidStaffId"></select>
                            </div>
                            <div class="form-group col-md-6 migrant-toggle">
                                <strong>Client Name</strong>
                                <input class="form-control" type="text" name="ClientName" id="ClientName" value="@Model.ClientName" />
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-group col-md-6">
                                <strong>Title </strong> <b class="red">*</b>
                                <input type="text" id="Title" name="Title" class="form-control required" value="@Model.Title" />
                            </div>
                            <div class="form-group col-md-6">
                                <strong>Product Type</strong>  <b class="red">*</b>
                                <select class="form-control required" name="ProductTypeId" id="ProductTypeId" data-api="/common/select/ProductType" data-api-selected-value="@Model.ProductTypeId"></select>
                            </div>
                        </div>
                        <div class="row"> 
                            <div class="form-group col-md-6" style="padding-bottom: 12px">
                                <strong>Upload Story/Case File</strong> <b class="red"> * (Do not include photos in your content - only Word files, Kokila font size 14, max size 4MB.)</b>
                                <input type="file" name="UploadFile" class="" value="@Model.FileName" />
                                <input type="hidden" name="FileName" id="FileName" value="@Model.FileName" />
                                @Html.DisplayFor(m => m.FileName)
                            </div>
                            <div class="form-group col-md-6" style="padding-bottom: 12px">
                                <strong>Supporting Image</strong> <b class="red">* (Max size 4MB) </b>
                                <input type="file" name="UploadImage" class="" />@Html.DisplayFor(m => m.ImageName)
                                <input type="hidden" name="ImageName" id="ImageName" value="@Model.ImageName" />
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-group col-md-6" style="padding-bottom: 12px">
                                <strong>Supporting Video </strong>
                                <input type="file" name="UploadVideo" class="" />@Html.DisplayFor(m => m.VideoName)
                                <input type="hidden" name="VideoName" id="VideoName" value="@Model.VideoName" />
                            </div>

<div class="form-group col-md-6">
                                <strong>Significant Changes</strong>  <b class="red">*</b>
                                <select class="form-control required" name="SignificantChangeId" id="SignificantChangeId" data-api="/common/select/SignificantChanges" data-api-selected-value="@Model.SignificantChangeId"></select>
                            </div>
                        </div>
                        <div class="row">
                            <div class=" form-group col-md-12">
                                <strong>Significant Changes Factors</strong> <b class="red"> * (Please select atleast one.)</b><br />
                                @for (int i = 0; i < Model.IndicatorList.Count; i++)
                                {
                                    <input type="checkbox" name="@Model.IndicatorList[i].Value" class="indicator" value="@Model.IndicatorList[i].Key.ToString()" checked="@Model.IndicatorList[i].IsChecked" />
                                    <span>@Model.IndicatorList[i].Value</span>
                                }
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-group col-md-12">
                                <strong>आयोजनाको सम्बोधनका कारण परिवार र समुदाय स्तरमा देखिएको प्रभाव </strong> <b class="red"> * (Please select atleast one.)</b><br />
                                @for (int i = 0; i < Model.ImpactList.Count; i++)
                                {
                                    <input type="checkbox" name="@Model.ImpactList[i].Value" class="impact" value="@Model.ImpactList[i].Key.ToString()" checked="@Model.ImpactList[i].IsChecked" />
                                    <span>@Model.ImpactList[i].Value</span>
                                }
                            </div>
                        </div>
                        <div class="row">
                            <div class="pull-right">
                                <div class="form-group">
                                    <div class="col-md-12">
                                        <input type="submit" value="Save" class="btn btn-primary" id="btnSubmit" />
                                        <a href="/knowledgeManagement/storyOrCase" class="btn btn-default ">Back</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>
<script>
    $(function () {

window.initializeSelectApis();
        window.initializeCascadeComponent();
        window.initializeCasecadeMembersForStoryCase();

$("#SubComponentId").on("change", function (e) {
            if (e.target.value === "1" || e.target.value === "4") {
                $(".toggle").addClass("show");
                $(".financial-toggle").removeClass("show");
                $(".migrant-toggle").removeClass("show");
            }
            else if (e.target.value === "6") {
                $(".toggle").removeClass("show");
                $(".financial-toggle").removeClass("show");
                $(".migrant-toggle").addClass("show");
            }
            else if (e.target.value === "5") {
                $(".toggle").addClass("show");
                $(".financial-toggle").addClass("show");
                $(".migrant-toggle").removeClass("show");
            }
            else {
                $(".toggle").removeClass("show");
                $(".financial-toggle").removeClass("show");
                $(".migrant-toggle").removeClass("show");
            }

});

})
    function getChange(data) {
        var memberElement = $('#MemberId');

$('#MemberIds').val('@Model.MemberIds');
        $('#MemberId').val([@Model.MemberIds]);

$('#MemberId').select2({
            multiple: true,
            allowClear: true,
        }).change(function () {
            var selectedIDs = $.map($(memberElement).select2('data'), function (val, i) {
                return val.id;
            }).join(",");
            $('#MemberIds').val(selectedIDs);

});
    }

$("form#frmStoryOrCase").submit(function (e) {

e.preventDefault();
        var form = $("#frmStoryOrCase");
        $.validator.unobtrusive.parse(form);

if (!form.valid()) {
            return false;
        };

if (!window.confirmAction()) {
            return;
        };

WorkForce.loader.show();

.toggle, .migrant-toggle, .financial-toggle {
        display: none;
    }

.toggle .show {
        display: block;
    }

.select2-search__field, .select2-container, .select2-selection--multiple {
        width: 100% !important;
    }

.select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default .select2-selection--multiple {
        border: solid #e8e9ea 1px !important;
        border-radius: 1px;
    }
    .red {
        color: red;
        font-size: x-small;
        font-style: italic;
    }
</style>