栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

单击时使用Javason / Jquery和Json数据填充选择框选项

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

单击时使用Javason / Jquery和Json数据填充选择框选项

这是我用来填充选择框的Javascript。

$.getJSON("/Users/GetUsers", null, function(data) {    $("#UsersList option").remove(); // Remove all <option> child tags.    $.each(data.Users, function(index, item) { // Iterates through a collection        $("#UsersList").append( // Append an object to the inside of the select box $("<option></option>") // Yes you can do this.     .text(item.Description)     .val(item.Id)        );    });});

我建议您在页面加载时而不是在用户单击选择框时触发此操作。jQuery
AJAX默认情况下是异步的(应该是异步的),因此有一两分钟的选择框为空,这可能会使用户感到困惑。

这是您的问题范围吗?还是在MVC方面也需要帮助?如果您使用的是ASP.Net
MVC,则实际上是JsonResult的特定结果类型,这使创建JSON控制器方法更加简单,因为它们不需要相应的视图。它还允许您使用匿名数据结构,这使方法特定的投影更加简单。


编辑 这是返回上面的jQuery代码将理解的JSON结构的基本方法。请注意,属性

u.Username
u.ID
取决于您的Users对象。

[HttpPost] public JsonResult GetUsers() {     return Json(new {        Users = from u in _usersRepository.Get()     select new { Description = u.Username, ID = u.ID }    }); }

但是,我建议您尽快放弃这种方法,并使用标准的JSON消息结构。我使用的是这样的:

{    Success: bool,    LoggedIn: bool,    ClientErrors: [        { Number: int, Description: string, Parameter: string },        { Number: int, Description: string, Parameter: string }...    ],    ServerErrors: [        { Id: int, Message: string },        { Id: int, Message: string }...    ],    data: {}}

这样做的原因如下:

  1. 没错,您的JSON方法库是各种协议,因此它受益于标准标头。
  2. 错误处理从中受益最大。具有一致的方法让用户知道出了什么问题对您而言是非常宝贵的。
  3. 区分客户端错误(用户名错误,密码错误等)和服务器错误(数据库离线)非常重要。一个用户可以修复,另一个则不能。
  4. 客户错误不仅应返回一条消息,还应返回导致该错误的方法中的参数(如果适用),以便您可以在相应的输入字段旁边轻松显示这些错误消息。
  5. 客户错误还应该提供唯一的编号(每种方法)以标识错误。这允许多语言支持。
  6. 服务器错误应提供所记录错误的ID。这样,您可以允许用户联系支持人员并参考他们遇到的特定错误。
  7. 登录的布尔值允许使用需要身份验证的方法的任何页面在必要时将用户轻松地重定向回登录屏幕,因为JSON方法的重定向操作结果将无效。
  8. 最后,“数据”字段是应提供方法特定数据的位置。

绝不要你考虑我的结构 做到这一点的方式。显然,您的应用程序需求可能与我的有很大不同。一致性,比任何特定的结构都重要。

编辑:06/01/2016-
看到人们仍然在看这个答案。关于填充下拉列表,我建议研究使用双向绑定框架。我个人更喜欢Knockout.JS,尽管Angular.JS也能做到,但它是如此的轻巧和轻便。除此之外,此答案的其余部分仍然是最新的。

编辑:2016 年8月10日-代码缺少逗号。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/385472.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号