jquery如何进行多个ajax调用[重复]

Question

我在ajax上卡住了，我有第一个选择框，这列出了所有国家的发送者，我也有第二个选择框，这也列出了国家的接收者。我使用ajax追加国家，但现在的问题是，第二个选择框没有填充。

我用php函数调用国家

public function country()
{
    return $this->countries->getCountries();
}

我的路线

 Route::get('/country', [ 'as' => 'customer.country', 'uses' => 'IndexController@country' ]);

现在我的ajax

$.ajax({
    type: "get",
    url: "/country",
    success: function (res) {
        if (res) {
            $.each(res,function(key,value){
                $("#country").append('<option value="'+value+'">'+value+'</option>');
            });
        }
    }
});

我的选择框如下所示

对于发件人:

    <div class="col col-md-6">
        <div class="form-group">
           <label  class="required">Receiver Country</label>
              <select id="country" class="form-control" required>
                  <option selected disabled>Select Country</option>
              </select>
         </div>
    </div>

那么对于接收方:

<div class="col col-md-6">
        <div class="form-group">
           <label  class="required">Receiver Country</label>
              <select id="country" class="form-control" required>
                  <option selected disabled>Select Country</option>
              </select>
         </div>
    </div>

现在只有发送方的选择框总是被填充，而接收方不会。请告诉我如何使用AJAX填充两个选择框。

null

Answer 1

您对两个Select使用了相同的id，请尝试如下所示:

if (res) {
        $.each(res,function(key,value){
         $("#country_sender").append('<option value="'+value+'">'+value+'</option>');
         $("#country_receiver").append('<option value="'+value+'">'+value+'</option>');
        });
    }