zoukankan      html  css  js  c++  java
  • bootstrap-paginator 分页插件笔记

     

        bootstrap-paginator基于bootstrap框架,使用起来非常简单。官网:http://harttle.github.io/bootstrap-paginator/ 

        在bootstrap框架下只需要引入一个bootstrap-paginator.js

    <script src="~/Content/js/bootstrap-paginator.min.js"></script>

       html:

      <div id="logtable">
          @Html.Action("GetExamLogs")
       </div>
     <div id="example"></div>

     GetExamlogs一个显示图表的partview:

     View Code

     js:

    复制代码
    <script >
        $(function () {
            var options = {
                currentPage: 1,//当前页
                totalPages: $("#totalpage").val(),//总页数
                numberofPages: 5,//显示的页数
                
                itemTexts: function(type, page, current) { //修改显示文字
                    switch (type) {
                    case "first":
                        return "第一页";
                    case "prev":
                        return "上一页";
                    case "next":
                        return "下一页";
                    case "last":
                        return "最后一页";
                    case "page":
                        return page;
                    }
                }, onPageClicked: function (event, originalEvent, type, page) { //异步换页
                    $.post("/Exam/GetExamLogs",{page:page,take:2},function(data) {
                        $("#logtable").html(data);
                    });
                },
                        
        };
            $("#example").bootstrapPaginator(options);
        });
    </script>
    复制代码

    Action

    复制代码
     public ActionResult GetExamLogs(int page = 1, int take = 10)
            {
                //先简单的取出成绩吧
                var id = CheckValid();
                var res = _repository.GetExamResultsByUserId(id).ToList();
                ViewBag.TotalPage = Math.Ceiling(((float)res.Count() / take));
                var targets = res.Skip(take * (page - 1)).Take(take);
                return PartialView(targets);
            }
    复制代码

    最后效果:

     之前一直使用 一直使用的 jPaginate,感兴趣的同学可以移步。先对而言,还是paginator简单好用。

     mvc 开发
    摘要: 第一次看到ACE模板,有种感动,有种相见恨晚的感觉,于是迅速来研究。它本身是基于bootstrap和jqueryui,但更nice,整合之后为后台开发节省了大量时间。目前已经投入到了两个项目中。发现虽然不是完美,整体效果还是不错,特此分享给园友。这一节先讲其中的Jqgrid。按照国际惯例,先上两张图。阅读全文
    posted @ 2014-06-30 00:42 stoneniqiu 阅读(3066) | 评论 (112) 编辑
     
    摘要: BlogEngine.Net 是个功能点很全面的开源博客系统,容易安装和实现定制,开放接口支持TrackBack,可以定义主题配置数据源等等。可谓五脏俱全,这里先记录一下它基于Membership的权限管理,文章有点长了,花了不少时间。这只是对知识的一个梳理,并不是要推荐用这种方式做权限管理,分享一下BlogEngine实现的方式。所以园友们各取所需。阅读全文
    posted @ 2014-05-19 08:21 stoneniqiu 阅读(1154) | 评论 (3) 编辑
     
    摘要: 很多时候需要这样的功能,对表格进行分页、排序和检索。这个有很多实现的方式,有现成的表格控件、用前端的mvvm,用户控件。但很多时候看着很漂亮的东西你想进一步控制的时候却不那么如意。这里自己实现一次,功能不是高大全,但求一个清楚明白,也欢迎园友拍砖。前端是bootstrap3+jPaginate,后台基于membership。没什么难点阅读全文
    posted @ 2014-05-08 08:05 stoneniqiu 阅读(3117) | 评论 (28) 编辑
     
    摘要: 之前就早耳闻前端MVC的一些框架,微软自家的Knockout.js,google家的AngularJs,还有Backone。但未曾了解,也不解为什么前端也要这么分。这两天看了AngularJs的官方教程倒是吃了一惊(专业前端的就不要见怪我的out了),这小小的js,五脏俱全,不但有model,controller,view,这三个重要元素,还有Templates,Filter,Routing,依赖注入的DI都有,还有一套 Jasmine 框架下的单元测试!阅读全文
    posted @ 2014-04-20 00:58 stoneniqiu 阅读(1021) | 评论 (0) 编辑
     
    摘要: MVC中的Filte 简单又优雅的实现了AOP ,在日志,权限,缓存和异常处理等方面用的比较多。但本文不是讨论Filter这些功能点,而是总结Filter实现的方式。说实现也不太准确,也就是它的呈现方式。自带有四种Filter(借用了Liam wang的图)阅读全文
    posted @ 2014-04-10 08:22 stoneniqiu 阅读(866) | 评论 (2) 编辑
     
    摘要: 之前上传图片的做法都是上传到服务器上的文件夹中,再将url保存到数据库。其实在MVC中将图片上传到数据库很便捷的事情,而且不用去存url了。而且这种方式支持ie6(ie6不支持jquery自动提交form,认为其不安全,这里form是主动点击提交的,所以就没有这个问题,而uploadify自动提交是flash的方式)。一、建立模型 场景是假设我们需要给一个Product编辑一张图片。在模型中,先定义好两个属性,ImageData和ImageType public class Product { [HiddenInput(DisplayValue=false)] ...阅读全文
    posted @ 2014-03-17 08:30 stoneniqiu 阅读(1318) | 评论 (5) 编辑
     
    摘要: 刚开始用xml存储东西的时候都是不断的在xml文件里面添加或者修改xml的节点,这个是很常见的做法,这方面的博客也很多我也就不介绍了。但其实在小批量存储的时候我们可以直接将对象存进xml/xaml,使用的时候将整个对象加载出来,操作完成后再保存下去,这种做法没有什么技术难点,但我只是觉得更加的面相对象,模型和存储可以分开,模型的接口可以暴露出来,让前端的或者后台的调用,而存储可以换成xml/xaml和数据库。这样的好处就不言而喻了。阅读全文
    posted @ 2014-02-10 14:10 stoneniqiu 阅读(724) | 评论 (2) 编辑
     
    摘要: 看过几款分页插件,觉得Jpaginate比较简约,样式也比较容易的定制,而且体验也比较好,支持鼠标滑动效果。先上效果图:阅读全文
    posted @ 2013-12-09 09:19 stoneniqiu 阅读(1632) | 评论 (5) 编辑
     
    摘要: 在园友的强烈呼唤下,我还是负责任的分享给大家,因为对代码比较熟悉一下,还是有些问题要说明,不然别人看起来会比较费劲。说实话除了这个bootstrap的界面风格和这件事情本身对大家有吸引力之外,内部的逻辑,结构,可能有些捉襟见肘,会让大家见笑,大牛们完全可以略过.现在源码已经让我推到GitHub上面去了。我先从头到尾的介绍一下,然后说一些存在的问题。也希望大家给出更好的建议。阅读全文
    posted @ 2013-12-04 10:26 stoneniqiu 阅读(6194) | 评论 (126) 编辑
     
    摘要: 起因: 那是七月份了,看见单身的同事在上花田网,当时觉得风格比较清新,还没有世纪佳缘等那些网站那么商业化,加上又看到了bootrstrap,于是就想做个demo出来玩玩。中间自己又在做其他的事情,和web没有关系,也想没事的时候也可以练练web,到上个星期,干脆就发布在公司的内网了。没想到同事们mail一传,现在都有200多个人(我的公司是个制造业,这边全部的职工有2w+的人,除了产线上的小妹妹们,有电脑的也有好几千)注册了。阅读全文
    posted @ 2013-12-02 16:28 stoneniqiu 阅读(5772) | 评论 (93) 编辑
     
    摘要: 图片上传的插件很多,但很多时候还是不能切合我们的需求,我这里给大家分享个我用一个form,file实现上传四张图片的小demo。完全是用jquery前后交互,没有用插件。 基本思路:用户点击相关div触发file元素打开浏览框----》用setInterval不断检测file文件是否选中文件---》选中之后触发form自动提交到后台---》后台将文件存储到临时文件夹返回图片在临时文件夹的地址---》窗口提示上传功能并预览图片---》用户点击发布---》后台保存图片(移动到指定文件夹,并存入数据库)阅读全文
    posted @ 2013-11-19 19:32 stoneniqiu 阅读(2123) | 评论 (25) 编辑
     
    摘要: ASP.NET MVC QQ面试阅读全文
    posted @ 2013-09-26 22:28 stoneniqiu 阅读(4718) | 评论 (36) 编辑
     
    摘要: 用了Codefirst后最大的困扰就是数据变化引起数据库的删除再新建,这样会造成数据丢失,musicstore中介绍的播种办法也只能满足下测试的需要。在EntityFrameWork5.0中引入了数据迁移功能能很好的解决这个问题。 步骤一:需要EF5.0,最好用NuGet来安装。工具-->库程序包管理器-->程序包管理控制台(我用的VS2012) 输入命令,安装最新的ef。如下 输入get-help NuGet 可以查看其它的命令主题 about_NuGet 简短描述提供有关 NuGet 程序包管理器命令的信息。 详细描述本主题介绍 NuGet 程序包...阅读全文
    posted @ 2013-06-04 17:29 stoneniqiu 阅读(1119) | 评论 (6) 编辑
     
    摘要: form.js 这个插件已经是很有名的,结合MVC的html辅助方法异步上传就很简单了。jQuery Form Plugin :http://www.malsup.com/jquery/form/#file-upload1.引入js,构建form。本身的BeginForm已经能够提交,但是如果有返回值的话,页面会跳转,这样体验就很不好。网上有说把反馈结果写在ViewData中,来绕开return。其实这是浏览器的默认行为,用form.js可以阻止掉。@using (Html.BeginForm("Upload", "Home", FormMethod.P阅读全文
    posted @ 2013-05-02 10:20 stoneniqiu 阅读(1442) | 评论 (3) 编辑
     
    摘要: 说明:现在jquery上传图片的插件很多了,但还是想弄清楚下MVC 图片是怎么传上去的。结果反馈,效果还需要改善。1.在View中还是用beginform 再加上 一个file,一个submit,用post的方式将file传递过,表单标签中设置enctype="multipart/form-data"来确保匿名上载文件的正确编码。默认情况下的form是不能用来上传的。@using (Html.BeginForm("Upload","Home",FormMethod.Post,new {enctype="m...阅读全文
    posted @ 2013-04-25 16:13 stoneniqiu 阅读(176) | 评论 (0) 编辑
     
    摘要: 1.使用数据库单例模式容易造成数据库连接冲突,因此最好的方案应该是访问一次数据库后应该马上断开连接。即使用Using。2.需要仓库,即实现接口的方法。 public interfaceIUserDbRepository:IBaseDbRepository ....... public classUserDbRepository: IUserDbRepository.........3.运用反射获取到对象类型再来各自处理4.建立空的对象,避免重复代码5.用字典来传递需要修改的属性 这样就比较灵活。 如果全部修改对象 容易造成错误6.深浅复制。copier public void Update(.阅读全文
    posted @ 2013-04-08 19:22 stoneniqiu 阅读(1098) | 评论 (2) 编辑
    分类: Jquery
  • 相关阅读:
    Mvc+三层(批量添加、删除、修改)
    js中判断复选款是否选中
    EF的优缺点
    Git tricks: Unstaging files
    Using Git Submodules
    English Learning
    wix xslt for adding node
    The breakpoint will not currently be hit. No symbols have been loaded for this document."
    Use XSLT in wix
    mfc110ud.dll not found
  • 原文地址:https://www.cnblogs.com/Leo_wl/p/4000207.html
Copyright © 2011-2022 走看看