如何发布表单？

我需要使用Razor和Devexpress控件制作一些表单。当用户打开Devexpress弹出窗口控件时，会出现一个需要输入字段的表单。这是我的观点：如何发布表单？

@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 BACK 
      @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();

我希望，当我的观点被渲染，它会调用HTTP GET方法，但它是不是这样的，它总是调用POST方法（如果有GET后用相同的名称）：

settings.CallbackRouteValues = new { Controller = "Request", Action = "RequestForm" };

这是为什么？如果我改变post方法的名称（这将在提交时调用），它给了我一个错误，说没有方法被调用。

此外，我有我想用于提交表单的按钮： settings.CallbackRouteValues = new {Controller =“Request”，Action =“RequestForm”}; 但它甚至没有进入控制器的任何操作方法。为什么？

这里是我的操作方法：

public ActionResult RequestForm() 
{ 
    //... 
} 

[HttpPost] 
public ActionResult RequestForm([ModelBinder(typeof(DevExpressEditorsBinder))] Request request) 
{ 
    //... 
}

如何回来后我的模型？什么是最好的方式来做到这一点？很明显，它不能以正常方式使用这些Devexpress控件。我可以以某种方式回发这个模型与jQuery？什么是最好的方法？请指教。

来源

2015-08-16 bambi

我总是使用下面的解决方案，当我想显示验证弹出窗体。首先我创建一般只与回调路线值弹出控制（任选地使用开始和结束回调和其它性质）：

@Html.DevExpress().PopupControl(settings => 
{ 
settings.Name = "newRequest"; 
settings.CallbackRouteValues = new { Controller = "Request", Action = "GetRequestForm" }; 
//[Optionally]: If you want pass data to action controller or set popup properties 
settings.ClientSideEvents.BeginCallback = "myLogic.onBeginActionCallback";  
settings.ClientSideEvents.EndCallback = "myLogic.onEndActionCallback"; 
}).GetHtml()

接着我创建控制器操作：

public ActionResult GetRequestForm()  { 
     // … some logic here ... 
     return PartialView("_PartialView", viewModel); 
    } 

    [HttpPost] 
    public ActionResult RequestForm([ModelBinder(typeof(MyBinder))] Request request) 
    { 
     // … some logic here ... 
     return Json(new { success = true }); 
    }

接着我创建视图（名称： “_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() 
}

最后我创造它使用jQuery验证（例如myLogic.js JS脚本）：

var myLogic = function() { 

function saveForm(){ 
var saveForm = $("#saveForm"); 
    saveForm.removeData('validator'); 
    saveForm.validate(validationSettings); 

// jQuery validation 
$("#someProperty_I").rules("add", { 
    required: true, 
    // Connect with server example 
    remote: { 
     url: '/Request/CheckValue', 
     data: { 
      //.. some logic here .. 
     } 
    }, 
    messages: { 
     required: "Required!", 
     remote: "Validation message" 
    } 
}); 

// and 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 
}}();

你当然应该包括jQuery的脚本：

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

来源

2015-08-18 13:09:00

如何发布表单？

回答

相关问题