@model BannerViewModel

@{
    ViewData["Title"] = "Create";
}


<div class="container mt-4">
    <div class="card justify-content-center">
        <div class="card-body">
            <h5 class="card-title">Create banner</h5>

            <div class="row ">
                <!-- 12 columns for textboxes -->

                <form asp-action="Create">
                    <div asp-validation-summary="All" class="text-danger"></div>
                  
                    <div class="mb-3 col-12">
                        <label asp-for="Title" class="control-label"></label>
                        <input asp-for="Title" class="form-control" />
                        <span asp-validation-for="Title" class="text-danger"></span>
                    </div>
                    <div class="mb-3 col-12">
                        <label asp-for="Description" class="control-label"></label>
                        <input asp-for="Description" class="form-control" />
                        <span asp-validation-for="Description" class="text-danger"></span>
                    </div>
                    <div class="mb-3 col-12">
                        <label asp-for="Content" class="control-label"></label>
                       <textarea asp-for="Content"></textarea>
                        <span asp-validation-for="Content" class="text-danger"></span>
                    </div>
                    <div class="mb-3 col-12">
                        <label asp-for="LinkUrl" class="control-label"></label>
                        <input asp-for="LinkUrl" class="form-control" />
                        <span asp-validation-for="LinkUrl" class="text-danger"></span>
                    </div>
                    <div class="mb-3 col-12">
                        <label asp-for="ImageUrl" class="control-label"></label>
                        <input asp-for="ImageUrl" class="form-control" />
                        <span asp-validation-for="ImageUrl" class="text-danger"></span>
                    </div>
                    <div class="mb-3">
                        <input type="submit" value="Create" class="btn btn-outline-primary" /> |    <a asp-action="Index" class="btn btn-primary">Back to list</a>
                    </div>
                   
                </form>
            </div>
        </div>
    </div>
</div>


@section Scripts{

    <script src="https://cdnjs.cloudflare.com/ajax/libs/ckeditor/4.11.4/ckeditor.js"></script>
    <script>
        CKEDITOR.replace("Content");
    </script>
  @{
        <partial name="_ValidationScriptsPartial"/>
  }
}




@* <div class="container mt-4">
    <div class="card justify-content-center">
        <div class="card-body">
            <h5 class="card-title">Create Survey</h5>

            <div class="row ">
                <!-- 12 columns for textboxes -->

                <form asp-action="Create" asp-controller="Questionnaire">
                    <div asp-validation-summary="All" class="text-danger"></div>

                    <div class="mb-3 col-12">
                        <label asp-for="Title" class="control-label"></label>
                        <input asp-for="Title" class="form-control" />
                        <span asp-validation-for="Title" class="text-danger"></span>
                    </div>
                    <div class="mb-3 col-12">
                        <label asp-for="Description" class="control-label"></label>
                        <input asp-for="Description" class="form-control" />
                        <span asp-validation-for="Description" class="text-danger"></span>
                    </div>
                    @foreach (var item in Model.Questions)
                    {
                        <label asp-for="@item.Id" class="control-label"></label>
                        <input asp-for="@item.Id" class="form-control" />
                        <label asp-for="@item.Text" class="control-label"></label>
                        <input asp-for="@item.Text" class="form-control" />

                        <select name="Questions.Type" class="form-control question-type">
                            <option value="">Select Question Type</option>
                            @foreach (var questionType in ViewBag.QuestionTypes)
                            {
                                <option value="@questionType.Value">@questionType.Text</option>
                            }
                        </select>
                    }
                   <div class="container">
                    <div id="questions-container">
                    <h3>Create Questions</h3>
                    <div class="form-group">
                    @for (int i = 0; i < Model.Questions?.Count; i++)
                    {
                    <div class="question-group">
                    <input type="hidden" name="Questions[0].Id" value="1" />
                    <label>Question @(i + 1)</label>
                    <textarea name="Questions[@i].Text" class="form-control">@Model.Questions[i].Text</textarea>

                    <select name="Questions[@i].Type" class="form-control question-type">
                    <option value="">Select Question Type</option>
                    @foreach (var questionType in ViewBag.QuestionTypes)
                    {
                    <option value="@questionType.Value">@questionType.Text</option>
                    }
                    </select>

                    </div>
                    }
                    </div>


                    </div>
                    <button type="button" class="btn btn-primary" id="add-question">Add Question</button> |
                    <button type="submit" class="btn btn-primary">Submit</button>
                    | <a asp-action="Index" class="btn btn-info">Back to list</a>
                    </div> 
                    <button type="submit" class="btn btn-primary">Submit</button>

                </form>
            </div>
        </div>
    </div>
</div>
<hr />




@section Scripts {

    @{
        <partial name="_ValidationScriptsPartial" />
    }
    <script>
        $(document).ready(function () {
            var Questions = @Model.Questions?.Count;

            $("#add-question").on("click", function () {
                var newQuestionHtml = '<div class="form-group">' +
                    '<label>Question ' + (++Questions) + '</label>' +
                    '<textarea type="text" name="Questions[' + Questions + '].Text" class="form-control"></textarea>' + '<br>' +
                    '<select name="Questions[' + Questions + '].Type" class="form-control">';

                newQuestionHtml += '<option value="">Select Question Type</option>';


        @foreach (var questionType in ViewBag.QuestionTypes)
        {
            @:newQuestionHtml += '<option value="@questionType.Value">@questionType.Text</option>';
        }

                    newQuestionHtml += '</select></div>';

                $("#questions-container").append(newQuestionHtml);
            });
        });
    </script>

} *@