At.js @mention - C#Web API

时间:2017-03-11 22:44:27

标签: javascript c# jquery at.js

我正在使用https://github.com/ichord/At.js库来实现自动完成功能。

但它显示了我在使用remoteFilter时的“未定义”下拉列表,就像他们在https://github.com/ichord/At.js/wiki/How-to-use-remoteFilter中所说的那样。

型号:

public class CaseHistory
{
    public int CaseHistoryId { get; set; }


    [Display(Name = "Symptom/Disease")]
    [Required(ErrorMessage = "Please enter symptom or disease")]
    public string SymptomOrDisease { get; set; }

    public string Description { get; set; }

}

API动作代码:

   private ApplicationDbContext db = new ApplicationDbContext();

    // GET api/CaseHistories
    public IQueryable<CaseHistory> GetCaseHistories()
    {
        return db.CaseHistories;
    }

这是我在剃刀视图中的代码:

    var myUrl = 'https://localhost:44301/api/CaseHistories';

    $('#inputor').atwho({
    at: ":",
    callbacks: {
        /*
         It function is given, At.js will invoke it if local filter can not find any data
         query [String] matched query
         callback [Function] callback to render page.
        */
        remoteFilter: function(query, callback) {
            $.getJSON(myUrl, { q: query }, function (data) {
                callback(data);
            });
        }
    }
    });

1 个答案:

答案 0 :(得分:0)

将控制器中的代码更改为:

   public dynamic GetCaseHistories()
    {
        return db.CaseHistories.Select(x => x.SymptomOrDisease).ToList();
    }

问题是传递给回调的参数应该是字符串数组。

如果你真的想在js中这样做:

    var myUrl = 'https://localhost:44301/api/CaseHistories';

    $('#inputor').atwho({
    at: ":",
    callbacks: {
        /*
         It function is given, At.js will invoke it if local filter can not find any data
         query [String] matched query
         callback [Function] callback to render page.
        */
        remoteFilter: function(query, callback) {
            $.getJSON(myUrl, { q: query }, function (data) {
            var targetData = [];
                for(var i = 0;i < data.length;i++){
                        targetData.push(data[i].SymptomOrDisease);
                }
                callback(targetData);
            });
        }
    }
    });