博客 (589)

制作类似下图中的拖拽排序功能:

image.png

1. 首先数据库该表中添加字段 sort,类型为 double(MySQL 中为 double(0, 0))。

2. 页面输出绑定数据(以 ASP.NET MVC 控制器为例):

public ActionResult EditSort()
{
    if (!zConsole.Logined) { return RedirectToAction("", "SignIn", new { redirect = Request.Url.OriginalString }); }

    db_auto2018Entities db = new db_auto2018Entities();

    return View(db.dt_dealer.Where(c => c.enabled).OrderBy(c => c.sort));
}

这里可以加条件列出,即示例中 enabled == true 的数据。

3. 前台页面引用 jQuery 和 jQuery UI。

4. 使用 <ul /> 列出数据:

<ul id="sortable" class="list-group gutter list-group-lg list-group-sp">
    @foreach (var d in Model)
    {
        <li class="list-group-item" draggable="true" data-id="@d.id">
            <span class="pull-left"><i class="fa fa-sort text-muted fa m-r-sm"></i> </span>
            <div class="clear">
                【id=@d.id】@d.name_full
            </div>
        </li>
    }
</ul>

5. 初始化 sortable,当拖拽结束时保存次序:

<script>
    var url_SaveSort = '@Url.Action("SaveSort")';
</script>
<script>
    $("#sortable").sortable({
        stop: function (event, ui) {
            // console.log('index: ' + $(ui.item).index())
            // console.log('id: ' + $(ui.item).data('id'))
            // console.log('prev_id: ' + $(ui.item).prev().data('id'))
            $.post(url_SaveSort, {
                id: $(ui.item).data('id'),
                prev_id: $(ui.item).prev().data('id')
            }, function (json) {
                if (json.result.success) {
                    // window.location.reload();
                } else {
                    toastr["error"](json.result.info);
                }
            }, 'json');
        }
    });
    $("#sortable").disableSelection();
</script>

这里回传到服务端的参数为:当前项的 id 值、拖拽后其前面一项的 prev_id 值(若移至首项则 prev_id 为 undefined)。

不使用 $(ui.item).index() 是因为,在有筛选条件的结果集中排序时,使用该索引值配合 LINQ 的 .Skip 会引起取值错误。

6. 控制器接收并保存至数据库:

[HttpPost]
public ActionResult SaveSort(int id, int? prev_id)
{
    if (!zConsole.Logined)
    {
        return Json(new { result = new { success = false, msg = "请登录后重试!" } }, JsonRequestBehavior.AllowGet);
    }

    db_auto2018Entities db = new db_auto2018Entities();

    dt_dealer d = db.dt_dealer.Find(id);

    // 拖拽后其前项 sort 值(若无则 null)(此处不需要加 enabled 等筛选条件)
    double? prev_sort = prev_id.HasValue
        ? db.dt_dealer.Where(c => c.id == prev_id).Select(c => c.sort).Single()
        : null as double?;

    // 拖拽后其后项 sort 值(若无前项则取首项作为后项)(必须强制转化为 double?,否则无后项时会返回 0,导致逻辑错误)
    double? next_sort = prev_id.HasValue
        ? db.dt_dealer.Where(c => c.sort > prev_sort && c.id != id).OrderBy(c => c.sort).Select(c => (double?)c.sort).FirstOrDefault()
        : db.dt_dealer.Where(c => c.id != id).OrderBy(c => c.sort).Select(c => (double?)c.sort).FirstOrDefault();

    if (prev_sort.HasValue && next_sort.HasValue)
    {
        d.sort = (prev_sort.Value + next_sort.Value) / 2;
    }
    if (prev_sort == null && next_sort.HasValue)
    {
        d.sort = next_sort.Value - 1;
    }
    if (prev_sort.HasValue && next_sort == null)
    {
        d.sort = prev_sort.Value + 1;
    }

    db.SaveChanges();

    return Json(new { item = new { id = d.id }, result = new { success = true } });
}

需要注意的是,当往数据库添加新项时,必须将 sort 值设置为已存在的最大 sort 值 +1 或最小 sort 值 -1。

var d = new dt_dealer
{
    name_full = "新建项",
    sort = (db.dt_dealer.Max(c => (double?)c.sort) ?? 0) + 1,
};


xoyozo 6 年前
6,521

工作这几年碰到的版本检测升级的接口也算是五花八门,啥样的都有,但肯定有的功能是有个 apk 的下载链接,能间接或直接提示你是强制还是非强制更新:

  • 间接是指提供你后台最新版本号,让你自己与本地版本号通过比较得出是否升级;

  • 直接就是后台接口直接返回个 Boolean 类型告诉你是强制或者非强制更新。

个人认为一个好的版本检测接口需要设计的更灵活更清晰用起来更方便,下面就我理解的接口设计如下(如思路有误,欢迎指正):

总字段如下(并不是所有字段都要返回给客户端):
  1.最新版本号 :newVersion
  2.最小支持版本号 : minVersion
  3.apk 下载 url : apkUrl
  4.更新文案 : updateDescription
  5.是否有更新 : isUpdate
  6.是否强制更新 : forceUpdate 可选字段:
  7.apk 文件大小:apkSize
  8.apk 的文件 MD5 值:md5

方案一(后端处理逻辑):
在客户端请求参数中添加当前版本号 currentVersion 传输给后台,由后台根据客户端传过来的当前版本号 currentVersion 做相应的判断后给出是否强制更新。
后端逻辑如下:

  1. 如果 currentVersion < newVersion, 则 isUpdate = true;

    • 如果 currentVersion < minVersion, 则 forceUpdate = true;

    • 如果 currentVersion >= minVersion, 则 forceUpdate = false;

    • 如果有特殊需求可指定某个版本必须强制更新,如 currentVersion == XXX, 则 forceUpdate = true;

  2. 如果 currentVersion == newVersion,则 isUpdate = false.

结论:
返回客户端的字段仅需要 apk 下载 url : apkUrl更新文案 : updateDescription是否有更新 : isUpdate是否强制更新 : forceUpdate 这四个字段即可。

方案二(前端处理逻辑):
逻辑和后端处理逻辑大体上一致,只是把逻辑判断移到前台,故需要后端提供最新版本号 :newVersion最小支持版本号 : minVersionapk下载url : apkUrl更新文案 : updateDescription 这四个字段。

客户端逻辑如下:

  1. 如果 currentVersion < newVersion, 则有更新信息;

    • 如果 currentVersion < minVersion, 则需要强制更新;

    • 如果 currentVersion >= minVersion, 则不需要强制更新;

  2. 如果 currentVersion == newVersion,则没有更新信息。


总结:
细心的你可能会发现上面的可选字段 apkSize 和 md5 并没有用到,既然是可选字段也就是可用可不用,根据需要决定是否采用,这里来讲下他们的用处。

  • apk 文件大小 apkSize
    这个用处可以说出于考虑用户体验,需要在升级弹框出来展示给用户将要更新的内容多大,让用户决定在非 WIFI 状态是否要更新,不能为了拉用户下载量或所谓的 UV 数直接让用户在不知道大小的情况下去直接下载(土豪用户绕路)

  • apk 的文件 MD5 值
    这个主要是出于安全考虑吧,因为文件内容固定的话对应的 md5 是一样的,我们可以通过这个 md5 值来和下载的 apk 的 md5 值进行比较去保证我们从服务器更新下载的 apk 是一个完整的未被篡改的安装包,也就是说如果我们下载的 apk 的 md5 值和服务器返回的 md5 值相等,则说明我们下载的 apk 是完整的,且没有被相关有心人处理过的 apk。

综上所述,这个版本更新的处理逻辑客户端和后端谁来做都可以,无关乎懒不懒的问题,个人感觉灵活性后端比客户端方便多了,毕竟后端可以指定 minVersion 与 newVersion 中间的任意一个版本强制更新,而客户端做起来就没有那么灵活了,个人见解,如有更好的方案,欢迎指教。



转自 闲庭CC 7 年前
3,635

当我们初始化一个 Swiper 时,

var mySwiper = new Swiper ('.swiper-container');

如果页面上只有一个 .swiper-container,那么 mySwiper 是一个对象,如果有多个 .swiper-container,则 mySwiper 是一个数组。

处理不当会报以下错误:

Uncaught TypeError: Cannot read property 'appendSlide' of undefined

Uncaught TypeError: Cannot read property 'prependSlide' of undefined

xoyozo 7 年前
3,857

ASP.NET MVC 如果从控制器输出的是匿名类的集合,那么绑定到视图时会报错:

“object”未包含“xxx”的定义

简单的解决方法是 JSON 序列化再反序列化,例如:

ViewBag.list = JsonConvert.DeserializeObject(JsonConvert.SerializeObject(q.ToList()));

上面是 ViewBag 的情形,如果是直接 return View(匿名类集合);

那么在视图页面:

@model IEnumerable<dynamic>


xoyozo 7 年前
3,766

Font Awesome 从 5.0 版本开始,在保持经典的 Web Fonts with CSS 外,还提供更现代化,功能更强大的 SVG with JS 部署方式。


升级为 SVG with JS 后,如果部分图标不显示,可能的原因是:

· 部分在老版本中的图标不再 5.0 版本上提供,解决的方法是引用 fa-v4-shims.js;

· 此方式把 <i /> 标签通过 JS 替换为 <svg /> 标签,须要改动 CSS 样式。


如果仍然使用 Web Fonts with CSS,部分图标不显示,可能的原因是:

· 新版本不再推荐以 fa 的 class 引用,对 Solid(实心)、Regular(标准)、Light(简洁)、Brands(品牌)四大分类分别使用新的命名方式:fas、far、fal、fab。具体可以在 Font Awesome 官网上找到相应图标后,点击打开图标详情,复制已经生成的 HTML 代码。fa 将被视为 fas。

xoyozo 7 年前
7,169

UEditor 的 ASP 版本在虚拟空间上传文件失败,提示“上传错误”或“上传失败,请重试”等,是因为其文件上传组件在创建目录时,没有网站目录外的访问权限。


例如上传文件的磁盘保存路径为:

D:\web\sitename\wwwroot\upload\20180523\123.jpg


百度编辑器的上传组件会依次判断以下目录是否存在,不存在则创建:

D:\

D:\web\

D:\web\sitename\

D:\web\sitename\wwwroot\

D:\web\sitename\wwwroot\upload\

D:\web\sitename\wwwroot\upload\20180523\


虚拟空间自动配置的网站根目录可能是:

D:\web\sitename\wwwroot\


所以,判断存在或创建以下目录没有问题:

D:\web\sitename\wwwroot\upload\

D:\web\sitename\wwwroot\upload\20180523\


但判断存在以下目录时会因为权限不足而失败:

D:\

D:\web\

D:\web\sitename\


解决方法是找到文件 asp/Uploader.Class.asp

找到 CheckOrCreatePath 这个 Function,替换为:

Private Function CheckOrCreatePath( ByVal path )    
   Set fs = Server.CreateObject("Scripting.FileSystemObject")    
   Dim parts    
   Dim root : root = Server.mappath("/") & "\"    
   parts = Split( Replace(path, root, ""), "\" )    
   path = root    
   For Each part in parts    
       path = path + part + "\"    
       If fs.FolderExists( path ) = False Then    
           fs.CreateFolder( path )    
       End If    
   Next    
End Function


另外,如果服务端无法通过 Request.Form 来接收该值,把 <form /> 放到 <table /> 外面试试。

或者绑定 contentChange 事件来赋值(不推荐):

ue.addListener("contentChange", function() {
    document.getElementsByName('xxxxxx')[0].value = ue.getContent();
});

此方法的缺点是,不是所有操作都能触发 contentChange 事件,比如剪切、上传图片等。

改进方法(推荐):在 form 提交之前赋值。

xoyozo 7 年前
4,860

WGS-84(地球坐标)

用于 GPS 模块 及 Google Earth


GCJ-02(火星坐标、国测局坐标系)

用于 Google Map必应-中国地图高德腾讯图灵阿里地图,是对地理位置的一次加密


BD-09(百度坐标)

仅用于百度地图,是对火星坐标的再次加密


CGCS 2000(国家大地坐标系)

用于天地图,与 WGS-84 最大差异 0.11mm


坐标转换:https://github.com/wandergis/coordtransform



微信网页开发的获取地理位置接口(wx.getLocation)默认使用 wgs84,可选 gcj02。

微信网页开发的使用微信内置地图查看位置接口(wx.openLocation)支持 gcj02。

xoyozo 7 年前
9,324

一: 执行sql语句,返回受影响的行数

在mysql里面,如果没有影响,那么返回行数为  -1 ,sqlserver 里面  还没有测试过

 (var ctx =  MyDbContext())
{
    ctx.Database.ExecuteSqlCommand("");
}


二 : Database.SqlQuery<T>   EF5执行sql查询语句 Database.SqlQuery 带返回值

这个准确的说是  IEnumerable<T> SqlQuery<T>(string sql, params object[] parameters)  ,注意返回值是 IEnumerable

这个是执行sql语句,返回你想要的类型的列表

dbMain.Database.SqlQuery<int>("select max(UserId) from tb_user_account").First();


或者假如你自己有个类别

  PersonView
{      PersonID { ; ; }      Name { ; ; }
}


那么就可以直接返回这个 PersonView类

 (var ctx =  MyDbContext())
{
    var peopleViews = ctx.SqlQuery<PersonView>("").ToList();
}

直接返回你想要的数据. 例如这里是 List<PersonView> 列表


转自 梨花驿路 7 年前
4,713

“/”应用程序中的服务器错误。

无法为具有固定名称“MySql.Data.MySqlClient”的 ADO.NET 提供程序加载在应用程序配置文件中注册的实体框架提供程序类型“MySql.Data.MySqlClient.MySqlProviderServices, MySql.Data.Entity.EF6, Version=6.10.7.0, Culture=neutral, PublicKeyToken=c5687fc88969c44d”。请确保使用限定程序集的名称且该程序集对运行的应用程序可用。有关详细信息,请参阅 http://go.microsoft.com/fwlink/?LinkId=260882。

打开 nuget,卸载并重新安装 MySql.Data 和 MySql.Data.Entity

如果没有效果,打开 web.config,检查是否多次定义了 MySql.Data.MySqlClient

xoyozo 7 年前
7,982

“/”应用程序中的服务器错误。

未能加载文件或程序集“MySql.Data.Entity.EF6, Version=6.10.7.0, Culture=neutral, PublicKeyToken=c5687fc88969c44d”或它的某一个依赖项。找到的程序集清单定义与程序集引用不匹配。 (异常来自 HRESULT:0x80131040)


6.10.7 版本的 MySql.Data.Entity.EF6.dll 文件发布后会自动变成 6.10.6,文件大小一样,只要用 FTP 上传覆盖一下即可。

xoyozo 7 年前
5,319