Question

我有一个基本的模态，我需要将一些选择选项传递给它。我使用服务方法从数据库中检索它们。

        [HttpGet]
        public async Task<IActionResult> CreateNote()
        {
            var model = new CreateNoteViewModel();
            var categories = await this.categoryService.GetAllCategoriesAsync();
            model.CategoryList = categories.Select(t => new SelectListItem(t.Name, t.Name)).ToList();

            return this.View(model);
        }

模式

<div class="modal fade" id="noteModal" tabindex="-1" role="dialog" aria-labelledby="noteModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="noteModalLabel">Creating a note...</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form id="send-feedback-form" asp-action="CreateNote" asp-controller="Management" asp-area="Management">
                    <input type="hidden" name="businessId" value="..." />
                    @Html.AntiForgeryToken()
                    <div class="form-group form-inline">
                        <div class="form-group col-lg-6 col-md-6 name">
                            <input required type="text" name="authorName" class="form-control col-form-label" id="name" placeholder="Enter Name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Name'">
                        </div>
                    </div>
                    <div class="form-group">
                        <textarea class="form-control mb-10" rows="5" name="comment" placeholder="Text" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Text'"
                                  required></textarea>
                    </div>
                    <div class="form-group">
                        <label for="department">Select Department</label>
                        <select class="form-control" id="department">
                            <option>Option1</option>
                            <option>Option2</option>
                            <option>Option3</option>
                        </select>
                    </div>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-success btnSave">Create Note</button>
                </form>
            </div>
        </div>
    </div>
</div>

可以说我检索了以下项目：TODO，Fix，Purchase，是否可以通过ajax将它们作为选择选项添加到模式中？

Answer 1

您将需要一个客户端可访问的文件，该文件将运行您提到的CreateNote函数。这将以某种服务器端语言（例如PHP）或类似的语言编写，并理想地返回JSON对象。然后使用$.getJSON()

运行AJAX调用

应该看起来像这样：

$.getJSON('myFile.php', processReturn);

function processReturn(data){
    $.each(data, function(i, val) {
        $("#department").append("<option>" + val + "</option>");
    });
}

这可能需要进行一些修改，具体取决于数据的格式或服务器的调用方式，但是应该遵循这些原则。

使用jQuery将选择的项目从数据库传递到模式

1 个答案: