jquery - How to post back form? -


i need make form using razor , devexpress controls. when user opens devexpress popup control there appear form fields needs enter. here view:

@model models.request @html.devexpress().popupcontrol( settings => {     settings.name = "newrequest";     settings.callbackroutevalues = new { controller = "request", action = "requestform" };     settings.enableclientsideapi = true;     settings.width = 450;     settings.showheader = true;     settings.showshadow = true;     settings.popupanimationtype = animationtype.fade;     settings.allowdragging = true;     settings.modal = true;     settings.setcontent( () =>     {         using ( html.beginform( ))         {             viewcontext.writer.write( "<div id = 'products'>" );             foreach(var product in model.products)             {                 html.renderpartial( "productpartial", product );             }             viewcontext.writer.write( "</div>" );              //total days field             @html.devexpress().spinedit(                             csettings =>                             {                                 csettings.name = "numberofproducts";                                 csettings.properties.enableclientsideapi = true;                                 csettings.width = 125;                                 csettings.properties.minvalue = 0;                                 csettings.properties.maxvalue = 100;                                 csettings.controlstyle.backcolor = system.drawing.color.fromargb( 82, 82, 82 );                                 csettings.controlstyle.forecolor = system.drawing.color.white;                             } ).bind( model.numberofproducts ).gethtml();              //post             @html.devexpress().button( savesett =>             {                 savesett.name = "save";                 savesett.text = "save";                 savesett.width = 40;                 savesett.height = 25;                 savesett.controlstyle.cssclass = "button";                 savesett.styles.enabledefaultappearance = false;                 savesett.enableclientsideapi = true;                 savesett.usesubmitbehavior = true;                 //savesett.clientsideevents.click = "function(s, e) { if(checkvalidation(s, e)) {} }";             } ).gethtml();         }     } );     } ).gethtml(); 

i expected when view being rendered call http method, not case, calling post method (if there post same names) defined this:

settings.callbackroutevalues = new { controller = "request", action = "requestform" }; 

why so? , if change post method name (that called on submit) gives me error, saying there no method called.

further more, have button wanted use submitting form: settings.callbackroutevalues = new { controller = "request", action = "requestform" }; not come action method in controller. why so?

here action methods:

public actionresult requestform() {     //... }  [httppost] public actionresult requestform([modelbinder(typeof(devexpresseditorsbinder))] request request) {     //... } 

how post model? best way that? not working these devexpress controls in normal way. can somehow post model jquery? best way? please advise.

i use below solution when want show popup form validation. first of create popup control callback route value (optionally use begin , end callback , other properties):

@html.devexpress().popupcontrol(settings => { settings.name = "newrequest"; settings.callbackroutevalues = new { controller = "request", action = "getrequestform" }; //[optionally]: if want pass data action controller or set popup properties settings.clientsideevents.begincallback = "mylogic.onbeginactioncallback";      settings.clientsideevents.endcallback = "mylogic.onendactioncallback"; }).gethtml() 

next create controller actions:

    public actionresult getrequestform()        {         // … logic here ...         return partialview("_partialview", viewmodel);     }      [httppost]     public actionresult requestform([modelbinder(typeof(mybinder))] request request)     {         // … logic here ...         return json(new { success = true });     } 

next create view (name: "_partialview"):

@using (ajax.beginform("requestform", "request", new ajaxoptions {  httpmethod = "post"  }, new { id = "saveform" })) {     @html.devexpress().textbox(settings =>     {         settings.name = "someproperty";     }).gethtml()  // … other properties…  @html.devexpress().button(settings => {    settings.name = "savebutton";    settings.text = "save";     settings.clientsideevents.click = "function(s,e) { mylogic.saveform(); }";    settings.usesubmitbehavior = false;  }).gethtml() } 

and create js script use jquery validation (for example mylogic.js):

var mylogic = function () {  function saveform(){ var saveform = $("#saveform");     saveform.removedata('validator');     saveform.validate(validationsettings);  // jquery validation $("#someproperty_i").rules("add", {     required: true,     // connect server example     remote: {         url: '/request/checkvalue',         data: {             //.. logic here ..         }     },     messages: {         required: "required!",         remote: "validation message"     } });  // , add other jquery validation  if (saveform.valid()) {         saveform.submit();     } }  var validationsettings = {     errorplacement: function (error, element) {         error.appendto(element.parent("td").parent("tr").parent("tbody").parent("table").parent("td"));     } }  return {     saveform: saveform }}(); 

of course should include jquery scripts:

1. jquery.validate.min.js 2. jquery.validate.unobtrusive.min.js 

Comments

Popular posts from this blog

dns - How To Use Custom Nameserver On Free Cloudflare? -

python - Pygame screen.blit not working -

c# - Web API response xml language -