Javascript HTML选择字段通过ajax调用web服务

我有一些带有表单的模式，我在其中创建要存储到数据库中的对象。 在这些表单中，我有一个选择字段，如下所示：

<div class="form-group" id=existingUser>
    <label>Username</label> <select class="form-control select2"
        style="width: 100%;" th:field="*{user}">
        <option th:each="user: ${users}" th:value="${user.username}"
            th:text="${user.username}"></option>
    </select>
</div>

$.ajax(url).done(function(){
    $('#my-select').append('<option>').html('your data')
}).fail(function(){
    // show error message...
});

当调用modal时，有没有方法调用ajax？或者，如果单击add按钮时检索值，则可以将数据从javascript传递到HTML。 有时我还会检查select字段是否为空，在本例中，在modals表单中显示一条消息。谢谢

更新。我认为以下代码：

要仅从成功管理开始，请执行以下操作：

function freeUserController($scope) {
   $http.get("https://localhost:8080/users/")
    .success(function(data) {
      $scope.users = data;          
    });
}

在我的html页面中：

<div ng-controller="freeUserController" class="form-group" id=existingUser>
    <label>Username</label> <select class="form-control select2"
        style="width: 100%;" name="user">
        <option ng-repeat="user in users" value="{{user.username}}">
        {{user.username}}</option>
    </select>
</div>

---

我假设您正在服务器上呈现HTML。可能无法使其仅重新渲染该元素。但是，有不同的方法可以做到这一点：

首先，您可以开始使用客户端MVC/渲染，比如Angular.js。这样，您可以在添加新字段时自动刷新“选择”字段

第二，您可以在不使用MVC系统的情况下将新选项放入select字段。这需要从视图中分离数据，所以我不推荐这样做。但是，您可以让submit按钮执行ajax调用，以确保服务器正确响应，并且只在服务器响应到达时添加新选项。您的代码如下所示：

<div class="form-group" id=existingUser>
    <label>Username</label> <select class="form-control select2"
        style="width: 100%;" th:field="*{user}">
        <option th:each="user: ${users}" th:value="${user.username}"
            th:text="${user.username}"></option>
    </select>
</div>

$.ajax(url).done(function(){
    $('#my-select').append('<option>').html('your data')
}).fail(function(){
    // show error message...
});

---

一种解决方法可能是使用javascript编写html，如您的示例中所示，但我会有很多回复代码。我从未使用过angularjs，但我知道它可以创建动态绑定，我可以将ajax调用插入angularjs控制器吗？是的，angularjs有很多ajax功能。它甚至有自己的AJAX函数包装器：我用一个可能的代码更新选择字段，这是正确的方法吗？它怎么知道什么时候刷新？看起来你走对了路。当基础数据模型更改时，视图应自动更新。只需查看AngularJS文档了解详细信息。