根据sql值提供CSS属性

Question

我有一个表，该表的列结果的值如通过，失败。待定等。我应该从数据库中检索值，并且在浏览器中显示时，应该有一个绿色的阴影圆圈表示通过，红色的阴影圆圈表示失败，而蓝色阴影的圆圈表示未决。我该怎么做？我在C＃webmethod中使用SQL命令，任何建议都很好

这是我的网络方法

[WebMethod]
    public static string searchAddress(string address, string zip, string result)
    {

        List<SearchAddress> searchList = new List<SearchAddress>();

        string CS = ConfigurationManager.ConnectionStrings["ConSql"].ConnectionString;
        using (SqlConnection con = new SqlConnection(CS))
        {
            Debug.WriteLine(occupancyType);
            SqlCommand cmd = new SqlCommand(" select result = case when result = 'passed' then 'pass' when result = 'failed' then 'failed' when result = 'pending' then 'pending' end, address + ' ' + city + ' ' + state + ' ' + zip as occupancy, name from Result RES JOIN Person p on RES.resId = p.pId where (address like  '%" + address + "' or address is not null) "
                 + "(insRes.result ='" + result + "' or insRes.result is not null) order by address"
                , con);
            cmd.CommandType = CommandType.Text;
            con.Open();
            Debug.WriteLine(streetNumber);
            Debug.WriteLine(streetName);

            SqlDataReader rdr = cmd.ExecuteReader();

            while (rdr.Read())
            {
                SearchAddress search = new SearchAddress();
                search.status = rdr["result"].ToString();
                search.occupancy = rdr["occupancy"].ToString();
                search.information = rdr["name"].ToString();
                searchList.Add(search);
                Debug.WriteLine(searchList);
            }
        }
        JavaScriptSerializer js = new JavaScriptSerializer();
        return js.Serialize(searchList.ToArray());
    }

这是我的ajax电话

function getAddress() {
            var data = {
                address: document.getElementById('address').value,
                zip: document.getElementById('zip').value, 
                result: document.getElementById('result').value,
            };
            var data_json = JSON.stringify(data);
            console.log(data_json);
            $.ajax({
                type: "POST",
                url: "default.aspx/searchAddress",
                data: data_json,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    console.log(response);
                    r2 = response.d;
                    resp2 = JSON.parse(r2);
                    var searchTable = $('#table tbody');
                    searchTable.empty();
                    $(resp2).each(function (index, sr) {
                        searchTable.append('<tr><td class="col-xs-2">' + sr.status + '</td>' +
                            '<td class="col-xs-2">' + sr.occupancy + '</td>' +
                           '<td class="col-xs-2">' + sr.name + '</td>' );
                    });
                },
                function(err) {
                    console.log(err);
                }
            });
            paginateTable();
        };