欢迎来到.net学习网

欢迎联系站长一起更新本网站!QQ:879621940

您当前所在位置:首页 » ASP.Net » 正文

热门阅读

MVC+jQuery开发B/S系统:表单提交(1)

创建时间:2011年06月12日 23:38  阅读次数:(5376)
分享到:

Jquery是一个优秀的Javascrīpt框架。MVC是一个设计模式,它强制性的使应用程序的输入、处理和输出分开。今天我们就谈如何用JQuery+MVC来处理表单的提交。 

想达到的效果:

1、提交前的表单验证 

2、表单验证 

3、提交后的反馈信息 

ok,先说一下工作的原理。

前台<form action='xxx.aspx' method='post'></form>,action指定了接受表单的处理页面。method这里我们只说post。 如果用ajax提交表单,自然xxx.aspx便是请求的url。ajax请求后的callback便是响应表单的提交结果(错误、成功),我们提交的反馈信息用一个 浮层(lightbox)来表示。 不至于用 alert(""); 这样铛铛铛很囧。

我们引入一个Jquery的插件http://www.malsup.com/jquery/form/#api 这是一个略有名气的插件,方便易用。关于其用法,大家可以搜索下。

那么我们需要做的就是: 

1、jquery.form.js的使用 

2、lightbox的实现 

3、如何验证

代码:

  1. $.fn.submitForm = function(args)   
  2. {          
  3. var url, id, callback, before;   
  4. id = this.attr("id");          
  5. if (typeof (args) == "string")   
  6. {              
  7. url = args;              
  8. before = undefined;              
  9. callback = undefined;          
  10. }          
  11. else   
  12. {              
  13. args = args || new Object();              
  14. url = args.url || this.attr("action");              
  15. if (typeof (args) == "function")   
  16. {                  
  17. callback = args;              
  18. }              
  19. else   
  20. {                  
  21. before = args.before;                  
  22. callback = args.callback;              
  23. }          
  24. }          
  25. //输入验证          
  26. this.inputValidate();          
  27. //form没有url 则是伪提交          
  28. if (url == undefined || url == "")   
  29. {              
  30. $("#" + id).submit(function() {                  
  31. if ($("#" + id).submitValidate()==false)                      
  32. return false;                  
  33. //验证成功就执行callback                  
  34. callback();              
  35. });          
  36. }          
  37. else   
  38. {              
  39. this.ajaxForm({                  
  40. url: url,                  
  41. beforeSubmit: function(a, f, o)   
  42. {                      
  43. //提交验证                      
  44. if ($("#" + id).submitValidate() == false)                          
  45. return false;                      
  46. if (before != undefined && before() == false) {                          s
来源:
说明:所有来源为 .net学习网的文章均为原创,如有转载,请在转载处标注本页地址,谢谢!
【编辑:Wyf

打赏

取消

感谢您的支持,我会做的更好!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

最新评论

共有评论0条
  • 暂无任何评论,请留下您对本文章的看法,共同参入讨论!
发表评论:
留言人:
内  容:
请输入问题 17+84=? 的结果(结果是:101)
结  果: