148 lines
6.5 KiB
Text
148 lines
6.5 KiB
Text
@model EditQuestionnaireViewModel
|
|
|
|
@{
|
|
ViewData["Title"] = "Edit";
|
|
}
|
|
|
|
<div class="container mt-4">
|
|
<div class="card justify-content-center p-4 shadow rounded">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Edit Survey</h5>
|
|
|
|
<div class="row">
|
|
<form asp-action="Edit">
|
|
<input type="hidden" asp-for="Id" />
|
|
<div class="form-group">
|
|
<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="form-group">
|
|
<label asp-for="Description" class="control-label"></label>
|
|
<textarea asp-for="Description" class="form-control"></textarea>
|
|
<span asp-validation-for="Description" class="text-danger"></span>
|
|
</div>
|
|
<div class="card shadow rounded">
|
|
<div id="questionsContainer">
|
|
@for (int i = 0; i < Model.Questions.Count; i++)
|
|
{
|
|
<div class="question">
|
|
<input type="hidden" asp-for="Questions[i].Id" />
|
|
<div class="form-group">
|
|
<label asp-for="Questions[i].Text" class="control-label"></label>
|
|
<input asp-for="Questions[i].Text" class="form-control" />
|
|
<span asp-validation-for="Questions[i].Text" class="text-danger"></span>
|
|
</div>
|
|
<div class="form-group">
|
|
<label asp-for="Questions[i].Type" class="control-label"></label>
|
|
<select asp-for="Questions[i].Type" asp-items="@ViewBag.QuestionTypes" class="form-control"></select>
|
|
<span asp-validation-for="Questions[i].Type" class="text-danger"></span>
|
|
</div>
|
|
<div class="answers">
|
|
@for (int j = 0; j < Model.Questions[i].Answers.Count; j++)
|
|
{
|
|
<div class="answer">
|
|
<input type="hidden" asp-for="Questions[i].Answers[j].Id" />
|
|
<div class="form-group">
|
|
<label asp-for="Questions[i].Answers[j].Text" class="control-label"></label>
|
|
<input asp-for="Questions[i].Answers[j].Text" class="form-control" />
|
|
<span asp-validation-for="Questions[i].Answers[j].Text" class="text-danger"></span>
|
|
<button type="button" class="btn btn-danger removeAnswer">Remove Answer</button>
|
|
</div>
|
|
|
|
</div>
|
|
}
|
|
</div>
|
|
<button type="button" class="btn btn-primary addAnswer">Add Answer</button>
|
|
|
|
</div>
|
|
}
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<button type="submit" class="btn btn-primary">Update</button>
|
|
| <a asp-action="Index" class="btn btn-info">Back to list</a>
|
|
</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("Description");
|
|
</script>
|
|
@{
|
|
<partial name="_ValidationScriptsPartial" />
|
|
}
|
|
|
|
<script>
|
|
$(document).ready(function () {
|
|
// Function to add a new answer
|
|
$(document).on('click', '.addAnswer', function () {
|
|
var questionContainer = $(this).closest('.question');
|
|
var newQuestionIndex = questionContainer.index();
|
|
|
|
// Correctly find the length of answers for the specific question
|
|
var newAnswerIndex = questionContainer.find('.answers .form-group').length;
|
|
|
|
var answerHtml = `
|
|
<div class="form-group">
|
|
<label class="control-label">Answer</label>
|
|
<input type="text" name="Questions[${newQuestionIndex}].Answers[${newAnswerIndex}].Text" class="form-control" />
|
|
<button type="button" class="btn btn-danger removeAnswer">Remove Answer</button>
|
|
</div>`;
|
|
|
|
// Append the new answer to the specific question
|
|
questionContainer.find('.answers').append(answerHtml);
|
|
});
|
|
|
|
// Function to remove an answer (including dynamically added answers)
|
|
$(document).on('click', '.removeAnswer', function () {
|
|
$(this).closest('.form-group').remove();
|
|
});
|
|
});
|
|
</script>
|
|
|
|
|
|
|
|
|
|
@* this script is working for adding mutiple answers for a question *@
|
|
|
|
|
|
@* <script>
|
|
$(document).ready(function () {
|
|
// Function to add a new answer
|
|
$(document).on('click', '.addAnswer', function () {
|
|
var questionContainer = $(this).closest('.question');
|
|
var newQuestionIndex = questionContainer.index();
|
|
var newAnswerIndex = questionContainer.find('.answers .form-group').length; // Correct way to find the length
|
|
|
|
var answerHtml = `
|
|
<div class="form-group">
|
|
<label class="control-label">Answer Text</label>
|
|
<input type="text" name="Questions[${newQuestionIndex}].Answers[${newAnswerIndex}].Text" class="form-control" />
|
|
</div>`;
|
|
|
|
$(this).siblings('.answers').append(answerHtml);
|
|
});
|
|
|
|
// Function to remove an answer
|
|
$(document).on('click', '.removeAnswer', function () {
|
|
$(this).closest('.form-group').remove();
|
|
});
|
|
});
|
|
</script>
|
|
*@
|
|
}
|
|
|
|
|
|
|