[AaronYang原创] 大话ASP.NET MVC3+ (C#与DOM与JS页面上的很炫的技巧)

案例一:比如我要传递一个新闻标题和新闻内容 存储到数据库去

1.最简单的通用Url公式就是

function getUrl() {
        var d = $("#表单ID").serialize();
        return "/控制器名称/Action名称?" + d;
    }

   1.1 假如不用jQuery的serialize()方法,有些情况需要手动拼接URL,传到后台去,这里会遇到第一个问题,假如新闻内容可以1000字以内,新闻内容为500-1000字之间比较多的时候,

可能你拼接的时候会遇到第一道坎

或者页面会弹出一个alert,提示这类错误,你只需要在站点的根目录的web.config添加如下配置,这里最大是2097151,不要还想要大的了

<system.web>
   <httpRuntime maxQueryStringLength="2097151" />
</system.web>

 1.2  假如我们不采用第三方富文本框插件,而是使用textarea。如果新闻里面含有html,英文的双引号,提交时候就会报一类错误。因为你提交的内容含有MVC默认因为安全机制而认为的不符合要求的字符串,这是防止别人注入脚本攻击网站,MVC默认自带的。

第一种解决办法,也是不考虑安全问题的临时解决办法

在请求的Action上加上  ValidateInput(false),如果你在Controller上加,那就是影响整个Controller中所有的Model,当然你可以在Web.config配置,影响整个web,但是不建议那样做

例如

或者单独在Model中的属性上加上一个特性 AllowHtml

这两个小方法你可以试试

 

1.3  就像你假如是这样子拼接过去的

$.ajax中的url参数,你是  

"/XX/XX?Content="+$("#Content").val()+ ...

这样子,你别得意的太早,第三道坎就是     IE8下传输到后台中文会乱码,IE6,7没有测试,谷歌,火狐没事

解决办法:

使用  escape() 方法可以解决

"/XX/XX?Content="+escape($("#Content").val())+ ...

 

特别备注:我不太建议URL中这样带参数,因为URL过长会有一些意想不到的错误

强烈建议大参数(长的),例如我用$.ajax方法,把值获得后放入data参数中,大家都知道Post都是把请求的参数放入header中,Get方式都是放入URL中,我们使用post,传入的后台的值是没有大小限制的,这里也不需要使用escape()了

例如,这里的Content参数,就是textarea中的值,字数很多,这样子,我们不用担心字数过长而出现的各种错误

 

 

 

 

 

 

1.4 第四道坎,如何显示定义的HTML,MVC提供了几个方法我不清楚,目前我也只是用了两个

假设cshtml页面顶部我们声明了一个News新闻的Model,这个Model中有两个属性,一个是标题,第二个是内容

则页面中我们可以这样使用

普通的显示

或者直接

但是假设含有\r\n这种换行的,我觉得可以使用试试

@Html.Raw(@Model.Content)

如果太复杂的html可以试试

 

关于拼接HTML,还有很多技巧,感觉就像C#代码和HTML标签灵活组合,可以省去很多冗余的代码,还有C#代码和Javascript的赋值技巧,C#的值可以赋值给Javascript变量和方法等,这里闲聊传参而已

给你们展示一下我的C#和HTML拼接技巧

  场景: 现在有个编辑页面,传入学生ID,打开学生信息,有个性别的radio,默认显示页面要选中性别,Model中是哪个就选中哪个,入门的童鞋都会用if else,我的办法如下(C#结合HTML)

 

  入门级赋值如下(这里只是展示了,不要生气我贴图,应该能看的懂的,模仿的会的呀)

 

给你们展示一下我的C#和Javascript赋值技巧

  第一种: 我们在return view之前放了一个集合和一个Id到ViewBag中,对应的View就可以在页面上获得

       

案例分析: 在这里,我存储了bid就是所谓的某张表的主键,后台在显示return view之前我存放了几个我前台页面会用到的值到ViewBag中,在页面使用时,我把值取了出来,第二个是个集合,cnt就是这个集合的大小,这里不是不太好理解的。这里我同时也掩饰了 string,int,集合的从ViewBag中拿值得方法

第一个铁律: @(C#变量名称)  无攻不破,你可以任意的结合HTML

         

第二个铁律: 

结合JS

   

②结合jQuery

③JS其他场景

作为JS方法中的参数,这里Expand是个普通的js方法

作为在HTML标签中的JS传参

至于@(C#代码)  的使用还有一些,就看你敢不敢尝试摸索了。这里注意重点理解原理,C#代码,我加粗描红的字

当然我们可以举一反三:

②说明一下,这里的var是js中的var,不是C#的

③传参的时候,我们经常需要隐藏字段作为辅助,下面简单列举几个小写法,注意这里的Hidden默认的第一个参数,都是 html  DOM元素中的name属性,jQuery序列化的时候也是根据name属性来的

这里的Model,熟悉MVC的一看就知道,整个页面的全局Model属性,当然这里也可以是一个 拓展方法,关于HTML结合拓展方法优化页面的显示,这里有兴趣的童鞋可以去研究下

这里举个我用到的场景,比如 说说和评论数,这里的评论数,我们就可以通过拓展方法得到,页面上直接  拓展方法A(该说说的ID),拓展方法返回一个string即可,是int还可以特殊处理下,比如是0,显示无评论

 

 

===================================本文来自博客园 茗洋AaronYang     博客地址:aaronyang.cnbolgs.com==========================

 

 

 关于MVC中的@ 一些用法,其实还可以结合@:  这个MVC大餐结合JS输出

我们大脑的印象中都是 利用@:可以在@的作用域内 输出一些文本,效果也等同于<text></text>

具体的初级用法请参考,这篇文章:   立即查看

今天我顺便讲一下 @: 在js中的另一个技巧,不琢磨难吃透   

 这里我可以我这样个人理解,@标记着这里以后的代码是C#代码,而@:则是标记着C#以外的代码(当然包括js,估计js不能换行写,当然你可以采取多个@: 有兴趣的童鞋可以试试,我看@和@:的普通用法是讲@:是输出文本的,没想到自己琢磨能不能调用js,竟然可以了)

左边是我简单的列举的一个大致简单小样子

其他备注: C#将值给JS的时候,例如赋的值是int型的时候,可以不加双引号或者单引号,是string的必须加单引号

最后一次强调,要使MVC页面代码 精彩出色,这里的@(C#代码),是C#代码,例如我想要显示客户端请求的浏览器的信息,我们直接像后台那样做就行了

 

最后5分钟,啰嗦最后一句话,基本URL的小技巧,我的写法不是直接 /XX/XX

第一种:

$('#表单ID').attr('action') +"?"+其他参数

第二种(就是结合JS结合C#代码):

 

 还有一种传参技巧,就是结合过滤器Filters,这里时间不早了,不说了

 关于前台POST后面的讲解技巧也有很多,特别在做Insert操作时候,单表还容易,但是多表的插入,我这里还是有一些很炫的技巧,有机会再说吧

 如果你喜欢,欢迎投上你宝贵的一个推荐,谢谢你

 本文来自博客园 茗洋AaronYang     博客地址:aaronyang.cnbolgs.com

 

 

 

posted @ 2013-10-08 17:31  AYUI框架  阅读(2392)  评论(11编辑  收藏  举报