asp.net mvc - .Net Ajax BeginForm callback not fired -
update 2:
jquery version compatibility issue.
update 1:
there typo in script reference. encounter problem now:
typeerror: $(...).live not function $("a[data-ajax=true]").live("click", function (evt) { =====================================
when submit valid form via ajax.beginform, in controller, returns json displayed in view instead of beingness handled callback functions , cannot figure why is.
i took demo project net, in case looked familiar anyone.
html/js
@model unobtrusive_validation.models.blogpost <html> <head> </head> <body> <script src="~/scripts/jquery-1.9.1.js"></script> <script src="~/scripts/jquery.validate.js"></script> <script src="~/scripts/jquery.validate.unobtrusive.js"></script> <script src="~/scripts/jquery.unobtrusive.ajax.js"></script> @using (ajax.beginform("test", "blogpost", new ajaxoptions{ httpmethod = "post", onsuccess = "onsuccess", onbegin = "alert('onbegin')", oncomplete = "alert('oncomplete')", onfailure = "alert('onfailure')" } ) ) { @html.validationsummary(true) <fieldset> <legend>blogpost</legend> <div class="editor-label"> @html.labelfor(model => model.postedon) </div> <div class="editor-field"> @html.editorfor(model => model.postedon) @html.validationmessagefor(model => model.postedon) </div> <div class="editor-label"> @html.labelfor(model => model.title) </div> <div class="editor-field"> @html.editorfor(model => model.title) @html.validationmessagefor(model => model.title) </div> <div class="editor-label"> @html.labelfor(model => model.content) </div> <div class="editor-field"> @html.editorfor(model => model.content) @html.validationmessagefor(model => model.content) </div> <div class="editor-label"> @html.labelfor(model => model.category) </div> <div class="editor-field"> @html.editorfor(model => model.category) @html.validationmessagefor(model => model.category) </div> <p> <input type="submit" value="create" /> </p> </fieldset> } </body> <script type='text/javascript'> function onsuccess(result) { console.log(result); if (result.success == false) { alert("failed"); } } </script> </html> controller:
public class blogpostcontroller : controller { // get: /blogpost/create public actionresult create() { homecoming view(); } [httppost] public actionresult test(blogpost _model) { homecoming json(new {success = false} ); } } web.config
<add key="clientvalidationenabled" value="true" /> <add key="unobtrusivejavascriptenabled" value="true" /> <script src="~/scripts/jquery.unobtrusive.ajax.js"></script>
should be:
<script src="~/scripts/jquery.unobtrusive-ajax.js"></script> if had used javascript debugging tool such firebug or chrome developer toolbar , looked @ network tab have seen 404 error when browser attempts retrieve non-existent file specified due typo.
i recommend set javascript files @ end of dom, before closing </body> tag.
moral of story: utilize javascript debugging tool such firebug or chrome developer toolbar. cannot perchance imagine person doing web development without using such tool.
update:
also bear in mind in jquery 1.9 .live() method has been removed 1 of breaking changes. unfortunately asp.net mvc's unobtrusive-ajax script depends on function. if want utilize of unobtrusive javascript features in mvc might need utilize older version of jquery.
asp.net-mvc unobtrusive-validation
No comments:
Post a Comment