如何基于ID向列表框添加Astric标记

Question

在我的Asp Web应用程序中，我使用JSON数据填充列表框。

我的JSON的一部分如下，

[  
   {  
      "UserId":10259,
      "FullName":"jhno doil",
      "BID":""
   },
   {  
      "UserId":10405,
      "FullName":"Adam mark",
      "BID":"10261"
   },
   {  
      "UserId":16224,
      "FullName":"silvester",
      "BID":""
   },
   {  
      "UserId":10416,
      "FullName":"Arnetta Chatcho",
      "BID":"1"
   },
   {  
      "UserId":10244,
      "FullName":"Ashanti Bueti",
      "BID":"1000"
   }
]

使用上面的JSON，我像这样填充列表框

function GetSupervisorComplete(result, status) {
    "use strict";
    var data = jQuery.parseJSON(result.d);
    var lstsupervisor = $("[id*=lbSupervisor]");
    lstsupervisor.empty();
    $.each(data, function () {

        lstsupervisor.append($("<option></option>").val(this['UserId']).html(this['FullName']));
    });
}

如果astric mark(*)，如何将BID = ""添加到选项？如下图所示。当我单击列表中的星号*中的选项时，无法在占位符中显示。如何将 * 添加到列表中？

Answer 1

具有基本的三元运算。像下面这样修改最后一行应该可以解决问题。

lstsupervisor.append($("<option></option>").val(this['UserId']).html(this['FullName'] + (this['BID'] === '' ? '*' : '')));

Answer 2

您可以使用三元基于*的值将html()添加到BID。

您还可以使用map()构建单个HTML字符串数组。您只需调用一次append()，就可以使用它来提高性能。试试这个：

function GetSupervisorComplete(result, status) {
  var data = jQuery.parseJSON(result.d);
  var $lstsupervisor = $("[id*=lbSupervisor]").empty();

  var html = data.map(function(o) {
    var name = o.FullName + (!o.BID ? ' *' : '');
    return `<option value="${o.UserId}">${name}</option>`;
  });
  $lstsupervisor.append(html);
}

Answer 3

尝试一下：

lstsupervisor.append($("<option></option>").val(this['UserId']).html(this['FullName'] + this['BID']?"":"*" ));

Answer 4

您可以使用额外的变量，该变量首先会发现是否应添加星号。您可能会喜欢如下：

function GetSupervisorComplete(result, status) {
    "use strict";
        var data = jQuery.parseJSON(result.d);
        var lstsupervisor = $("[id*=lbSupervisor]");
        lstsupervisor.empty();
        $.each(data, function () {
             var astric_style = this['BID'] == '' ? '*' : '';
             lstsupervisor.append($("<option></option>").val(this['UserId']).html(this['FullName']+astric_style));
    });