@model ParcelWeb.Core.Domain.City

@{
    ViewBag.Title = "Create";
}



<div class="content-header row">
    <div class="breadcrumb-wrapper col-xs-12">
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="index.html">Home</a>
            </li>

            <li class="breadcrumb-item active">
                City
            </li>
        </ol>
    </div>
</div>



<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header">
                <h4 class="card-title">Add City</h4>
                <a class="heading-elements-toggle"><i class="icon-ellipsis font-medium-3"></i></a>
                <div class="heading-elements">
                    <ul class="list-inline mb-0">
                        <li><a data-action="collapse"><i class="icon-minus4"></i></a></li>
                        <li><a data-action="reload"><i class="icon-reload"></i></a></li>
                        <li><a data-action="expand"><i class="icon-expand2"></i></a></li>

                    </ul>
                </div>
            </div>
            <div class="card-body collapse in">
                <div class="card-block">
                    @using (Html.BeginForm("Create", "Cities", FormMethod.Post, new { @class = "form form-horizontal" }))
                    {
                        @Html.AntiForgeryToken()
                        <div class="form-body">
                            <h4 class="form-section"><i class="icon-plus"></i> City Detail</h4>

                            @Html.ValidationSummary(true, "", new { @class = "text-danger" })

                            <div class="form-group row">
                                @Html.LabelFor(model => model.CountryId, "Country", htmlAttributes: new { @class = "label-control col-md-2" })
                                <div class="col-md-6">
                                    @Html.DropDownList("CountryId", null, htmlAttributes: new { @class = "form-control select2" })
                                    @Html.ValidationMessageFor(model => model.CountryId, "", new { @class = "text-danger" })
                                </div>
                            </div>
                            <div class="form-group row">
                                @Html.LabelFor(model => model.StateId, "State", htmlAttributes: new { @class = "label-control col-md-2" })
                                <div class="col-md-6">
                                    @Html.DropDownListFor(model => model.StateId, Enumerable.Empty<SelectListItem>(), "--Select State--", new { @class = "form-control" })
                                    @Html.ValidationMessageFor(model => model.StateId, "", new { @class = "text-danger" })
                                </div>
                            </div>
                            <div class="form-group row">
                                @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "label-control col-md-2" })
                                <div class="col-md-6">
                                    @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                                    @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
                                </div>
                            </div>

                            <div class="form-group row">
                                @Html.LabelFor(model => model.CityCode, htmlAttributes: new { @class = "label-control col-md-2" })
                                <div class="col-md-6">
                                    @Html.EditorFor(model => model.CityCode, new { htmlAttributes = new { @class = "form-control" } })
                                    @Html.ValidationMessageFor(model => model.CityCode, "", new { @class = "text-danger" })
                                </div>
                            </div>

                     

                          
                            <div class="form-group row">
                                @Html.LabelFor(model => model.Active, htmlAttributes: new { @class = "label-control col-md-2" })
                                <div class="col-md-6">
                                    <div class="checkbox">
                                        @Html.EditorFor(model => model.Active)
                                        @Html.ValidationMessageFor(model => model.Active, "", new { @class = "text-danger" })
                                    </div>
                                </div>
                            </div>

                            <div class="form-actions right">
                                <button type="submit" id="btnSave" class="btn btn-primary"><i class="icon-check2"></i> Save</button>
                                <a href="@Url.Action("Index", "Cities")" class="btn btn-warning mr-1"><i class="icon-cross2"></i> Cancel</a>
                            </div>

                        </div>
                    }
                </div>
            </div>
        </div>
    </div>
</div>


<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    <script type="text/javascript">
        

        $(document).ready(function () {


            $('#CountryId').on('change', function () {

                var value = $(this).val();

                var s = $('#StateId');

                $.ajax({
                    type: "POST",
                    url: "/Countries/GetAllStatesByCountryId?param=" + value,
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        s.empty();
                        $("<option />", { value: "", text: "--Select State--" }).appendTo(s);
                        $(data).each(function (idx, obj) {
                            $("<option />", { value: obj.Id, text: obj.Name }).appendTo(s);
                        });
                    },
                    failure: function () {
                        alert("Failed!");
                    }
                });

            });


        });


 </script>
   
 }