Question

我发出了一个GET请求，要求所有用户显示姓名，姓氏，职业和Is_active，这是我的ajax请求

$.ajax({
  url: "/see/user",
  success: function(users){
    $user = $("#add_usr");
    $.each(users, function(i, user){
      userArr.push({
        'id': user.id,
        'firstName': user.profile.FirstName,
        'lastName': user.profile.LastName,
        'fullName': user.profile.FirstName + ' ' + user.profile.LastName,
        'profesion': user.profesion,
        'Is_active': user.Is_active

      });
    });

现在我希望用户必须将所有职业附加到我的选择选择器而不是重复，例如。我的ajax请求有3个用户，第一个职业是Plumber第二个程序员和第三个教师，我希望这三个职业出现在我的选择选择器中，因为我想通过专业来过滤用户，我现在不知道如何启动它，提前谢谢

Answer 1

您必须执行以下操作：

提取所有专业（例如使用地图）
对它们进行排序
删除重复项
创建选择

Heres'how

function extractProfessions(userArr) {
  return userArr
      .map(function(el) {
        return el.profession
      })
      .sort()
      .filter(function(el,i,a) {
        return i==a.indexOf(el);
      });
}

你可以从你的ajax回调中调用它

$.ajax({
  url: "/see/user",
  success: function(users){
    $user = $("#add_usr");
    var userArr = []; // YOU DIDN'T HAVE THIS IN YOUR ORIGINAL CODE
    $.each(users, function(i, user){
      userArr.push({
        'id': user.id,
        'firstName': user.profile.FirstName,
        'lastName': user.profile.LastName,
        'fullName': user.profile.FirstName + ' ' + user.profile.LastName,
        'profesion': user.profesion,
        'Is_active': user.Is_active

      });
      var professions = extractProfessions(userArr); // HERE!!!
    });

然后将结果添加到select。

Answer 2

使用你所拥有的，你可以做的是拥有另一个数组，并将其命名为options来存储所有唯一的数组，然后填充你的元素。通过这样做，当您调用此ajax请求时，您将始终刷新选择菜单。

    $.ajax({
      url: "/see/user",
      success: function(users){
        $user = $("#add_usr");
        var options = [];

        $.each(users, function(i, user){
          /* HERE WE CREATE AN OPTIONS LIST FOR THE SELECT*/
          if (-1 != options.indexOf (user.profesion))
            options.push (user.profesion);


          userArr.push({
            'id': user.id,
            'firstName': user.profile.FirstName,
            'lastName': user.profile.LastName,
            'fullName': user.profile.FirstName + ' ' + user.profile.LastName,
            'profesion': user.profesion,
            'Is_active': user.Is_active

          });

          /* HERE WHEN FINISHED YOU CAN POPULATE THE SELECT MENU WITH THESE*/
          $ ('#SELECT_ELEMENT').html (''); // FIRST CLEAR IT

          /* THEN POPULATE IT */
          $.each (options, function (k, v) {
            $ ('#SELECT_ELEMENT').append (v);
          });


        });

在选择选项中附加ajax响应

2 个答案: