Cool MVC: Combined with jquery to create a super simple Ajax Extension

Source: Internet
Author: User

I don't know if this title will attract you, but I will first give the simplest Ajax application example statement of this jquery extension:

Replace <input type = "I am submit" value = "Submit"/>

<% = Ajax. Get ("I will not submit") %>

In this way, a simple statement is used to implement Ajax get operations, which is super cool! You can stop submit later (Note: Submit means submission in English)

Of course, no action is specified in the preceding example. By default, data is submitted to the current action. If we want to submit to another action, such as the Action submitted to "savedata", we can write as follows:

<% = Ajax. Get ("I will not submit", "savedata") %>

If it is submitted to another controller, it is:

<% = Ajax. Get ("I will not submit", "savedata", "othercontrollername") %>

Of course, we can also specify the parameters submitted by get:

<% = Ajax. Get ("delete", "ajaxdelete", new {id = model. ID}) %>

And confirm and callback:

<% = Ajax. Get ("delete", "ajaxdelete", new {id = model. ID}, new ajaxoptions {confirm = "do u want to delete this comment? ", Onsuccess =" Certificate ('audio divmodellist'audio .html (data); "}) %>

Here is a simple explanation:CodeTo achieve this, when you click the "delete" hyperlink, a confirmation box will pop up asking you if you want to delete it. If you click "OK", the ajaxdelete Server action will be called, after the operation is successful, the DIV with the ID "divmodellist" will be refreshed. Is it simple?

First, let's take a look at how JavaScript code is implemented.

 
FunctionAjaxdelete (idtodelete ){VaRResult = confirm ('Do u want to delete this comment? ');If(! Result)Return False; $. Get ('/Jquerysample/ajaxdelete /'+ Idtodelete,'',Function(Data) {$ ('# Divmodellist'Pai.html (data );});}

 

Well, it's not a problem, but it's a little bit of a problem to pass the URL. The above is a hard-coded URL.'/Jquerysample/ajaxdelete/'. If rount is changed, an error occurs. Therefore, we may need to write

  function  ajaxdelete (URL) { var  result = confirm ( 'do u want to delete this comment? ');  If  (! Result)  return   false ; $. get (URL,  '',  function  (data) {$ ( '# divmodellist'  pai.html (data) ;}

Call:

 
Ajaxdelete ('<% = URL. Action ("ajaxdelete", "jquerysample", new {id = 1}) %>');

Ah, it seems very troublesome.

Back to the previous topic, the MVC Ajax extension method:

                 Public   Static   String Get ( This Ajaxhelper helper,String Linktext, String Actionname, String Controllername, Object Routevalues, String Jsonparam, Object Htmlattributes, ajaxoptions ){ Return Getposthelper (helper, linktext, actionname, controllername, routevalues, jsonparam, htmlattributes, ajaxoptions, True );} Public   Static   String Post ( This Ajaxhelper helper, String Linktext, String Actionname, String Controllername, Object Routevalues, String Jsonparam, Object Htmlattributes, ajaxoptions ){ Return Getposthelper (helper, linktext, actionname, controllername, routevalues, jsonparam, htmlattributes, ajaxoptions, False );} Private   Static   String Getposthelper (ajaxhelper helper,String Linktext, String Actionname, String Controllername, Object Routevalues, String Jsonparam, Object Htmlattributes, ajaxoptions, Bool Isget ){ String Linkformat = "<A href = \" {0} \ "{1} {3 }>{ 2} </a>" ; String ATTS = String . Empty; String Ajaxs =String . Empty; String Opt = isget? "Get" : "Post" ; If (Htmlattributes! = Null ) ATTS = html. convertobjecttoattributelist (htmlattributes); urlhelper url = New Urlhelper (helper. viewcontext. requestcontext ); String Action = routevalues = Null ? URL. Action (actionname, controllername): URL. Action (actionname, controllername, routevalues, "" ); If ( String . Isnullorempty (jsonparam) jsonparam = "$ ('Form'). serialize ()" ; If (Ajaxoptions! = Null ){ String Confirmscript = String . Empty; If (! String . Isnullorempty (ajaxoptions. Confirm) {confirmscript = String . Format ( "Var result = confirm ('{0}'); If (! Result) return false ;" , Ajaxoptions. Confirm);} ajaxs =String . Format ( "Onclick = \" {0 }$. {1} ('{2}', {3}, {4}); Return false ;\"" , Confirmscript + ajaxoptions. onbegin, opt, action, jsonparam, "Function (data ){" + Ajaxoptions. onsuccess + "}" );} String Result = String . Format (cultureinfo. invariantculture, linkformat, "#" , ATTS, linktext, ajaxs ); Return Result ;}

 

Get and post methods, I reconstructed the 10 versions, and put them in the http://mvcj.codeplex.com /,

Complete code download page: http://mvcj.codeplex.com/SourceControl/ListDownloadableCommits.aspx

I like the JS framework of jquery very much. I hope someone can make more MVC extensions on this framework.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.