使用HTTP响应填写表单

Question

这是医院的HTML表单，其中必须在加载页面时使用API​​ GET调用填充字段。 我使用的是HTML，Javascript，AngularJS，我的API是用java编码的。

我可以通过GET请求API填充所有输入字段，f1 <- function(seed){ set.seed(seed) results <- data.frame(elevation = rnorm(12)) results$location <- data.frame(lat = sample(50:100, 12, replace=TRUE), lng = sample(-15:20, 12, replace=TRUE)) results } result1 <- list(results = f1(24), status = "OK") result2 <- list(results = f1(42), status = "OK") result3 <- list(results = f1(343), status = "OK") 除外。 我的问题在于select基于API响应的表单中的选项。表单中有4个选择标记，它们是相关的。

以下是HTML代码：

select

在页面加载期间加载国家/地区选项，通过API调用，他获得该国家/地区的相应州。通过选择一个州，他获得了各自的城市，并与当地一样。同样，这通过API调用发生。

这是用于获取结果的API调用。 除了<form role="form"> <div class="form-group"> <label class="control-label">Name of Hospital</label> <input type="text" class="form-control" id="name" ng-model="hospital.name" required="true"> <!-- <p class="help-block">Name of the hospital</p> --> </div> <div class="form-group"> <label>Address</label> <textarea class="form-control" rows="3" ng-model="hospital.address" id="address"></textarea> <!-- <p class="help-block">Address of the hospital</p> --> </div> <div class="row"> <div class="col-lg-6"> <div class="form-group"> <label>Country</label> <select class="form-control" id="countries" onchange="countries(this.value)" ng-model="hospital.countryItemSelected"> <option ng-repeat="country in countries" value="{{country.id}}">{{country.name}}</option> </select> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>State</label> <select class="form-control" id="states" onchange="states(this.value)" ng-model="hospital.stateItemSelected"> <option ng-repeat="state in states" value="{{state.id}}">{{state.name}}</option> </select> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>City</label> <select class="form-control" id="cities" onchange="cities(this.value)" ng-model="hospital.cityItemSelected"> <option ng-repeat="city in cities" value="{{city.id}}">{{city.name}}</option> </select> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>Locality</label> <select class="form-control" id="localities" onchange="localities(this.value)" ng-model="hospital.localityItemSelected"> <option ng-repeat="locality in localities" value="{{locality.id}}">{{locality.name}}</option> </select> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>PIN</label> <input type="text" class="form-control" id="pin" ng-model="hospital.pin"> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>General Timings</label> <input type="text" class="form-control" id="generalTimings" ng-model="hospital.timings"> </div> </div> <div class="col-lg-12"> <div class="form-group"> <label>Website</label> <input type="text" class="form-control" id="website" ng-model="hospital.website"> <!-- <textarea class="form-control" rows="6"></textarea> --> </div> </div> <div class="col-lg-12"> <div class="form-group"> <label>Email ID</label> <input type="email" class="form-control" id="emailID" required="true" ng-model="hospital.emial"> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>Mobile No.</label> <input type="text" class="form-control" id="mobile" required="true" ng-model="hospital.mobile"> </div> </div> <div class="col-lg-6"> <div class="form-group"> <label>Phone No.</label> <input type="text" class="form-control" id="phone" ng-model="hospital.phone"> </div> </div> </div> <button type="submit" class="btn btn-primary" id="formSubmit" disabled>Save</button> 之外，所有其他输入字段都已填充。

select

我在此结果中获得了国家，州，城市，地区的名称。 在加载页面时，必须选择与这些结果相关的选项，以及所有其他字段。

每个选择字段的名称存储在不同的表中。

如何解决选择项目的问题？是否需要获取这些名称的ID来解决这个问题？

还可以选择在表单中编辑详细信息。因此，选择选项通过GET API加载。