2013-05-07 100 views
0

我的ASP.net MVC應用程序包含一個DevExpress DateEdit擴展,該Im能夠選擇日期(http://mvc.devexpress.com/Editors/DateEdit),現在我喜歡發送,每次用戶通過在我的DateEdit擴展的處理程序上作出反應來將日期,日期更改回控制器。如何調用控制器與JavaScript函數在ClientSideEvents.DateChanged上反應

我設置ClientSideEvents.DateChanged的JavaScript函數,現在我的問題開始,我通常用形式發送數據和提交回控制器和粘合劑它們綁定到我的模型......

但現在我想在javascript函數中調用像writeDate(DateTime date)這樣的控制器,ActionLink可能會這樣做,因爲我知道可以通過鏈接調用控制器,例如「\ myController \ Method \參數「,但我不知道如何實現,沒有用戶的行爲。

我的代碼:

@Html.DevExpress().DateEdit(settings => 
        { 
         settings.Name = "Date"; 
         settings.Properties.UseMaskBehavior = true; 
         settings.Properties.EditFormat = EditFormat.Custom; 
         settings.Properties.EditFormatString = "MMMM dd, yyyy"; 
         settings.Properties.DisplayFormatString = "MMMM dd, yyyy"; 
         settings.Date = DateTime.Now; 
         settings.Properties.ClientSideEvents.DateChanged = "OnDateChanged"; 
        }).GetHtml() 
       @Html.DevExpress().Button(settings => { 
        settings.Name = "sendDate"; 
        settings.ClientVisible = false; 
        settings.UseSubmitBehavior = true; 
       }); 

function OnDateChanged(s, e) { 
    // Call Controller 
} 

[HttpPost, ValidateInput(false)] 
    public ActionResult onDateChanged(DateTime date) 
    { 
     // Do something 
    } 

所以我覺得我的一般問題是,我該如何將數據傳遞給控制器​​沒有一個形式,只在一個客戶端事件的反應? :)

回答

0

如果DevExpress的可以調用一個js函數作爲客戶端事件的結果,那麼你可以這樣做:

function OnDateChanged(s, e) { 
    $.ajax({ 
     url: '@Url.Action("onDateChanged","Controller_Name")', 
     type: 'POST', 
     // e here depends on how devexpress pass the value 
     // e.Value? or e.val(), just replace it accordingly 
     data: { date: e } 
    }); 
} 
0

這樣做的正確的方法,是用從的DevExpress的CallbackPanel擴展,將DateTime擴展添加到它的內容中,將面板的CallBackRouteValue設置爲控制器,在DateTime-Extension的ClientSideEvent上作出反應並觸發該服務器的回調。

查看

<script type="text/javascript">  
    var date = null; 
    function OnDateChanged(s, e) { 
     date = Datum.GetValue(); 
     if (!CBPDateEdit.InCallback()) { 
      CBPDateEdit.PerformCallback(); 
     } 
    } 

    function OnBeginCallback(s, e) { 
     e.customArgs["newDate"] = Date.GetValue().toString(); 
    } 
    </script> 
@Html.DevExpress().CallbackPanel(settings => 
{ 
settings.Name = "CBPDateEdit"; 
settings.CallbackRouteValues = new { Controller = "Controller", Action = "onDateChanged" }; 

settings.SetContent(() => 
{ 
    ViewContext.Writer.Write("content"); 
    Html.DevExpress().DateEdit(DateSettings => 
        { 
         DateSettings.Name = "Date"; 
         DateSettings.Properties.UseMaskBehavior = true; 
         DateSettings.Properties.EditFormat = EditFormat.Custom; 
         DateSettings.Properties.EditFormatString = "MMMM dd, yyyy"; 
         DateSettings.Properties.DisplayFormatString = "MMMM dd, yyyy"; 
         DateSettings.Properties.EnableClientSideAPI = true; 
         DateSettings.Date = DateTime.Now; 
         DateSettings.Properties.ClientSideEvents.DateChanged = "OnDateChanged"; 
        }).GetHtml(); 
}); 

settings.ClientSideEvents.BeginCallback = "OnBeginCallback"; 
}).GetHtml() 

控制器

[AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult onDateChanged(String newDate) 
    { 

     viewModel.date= DateTime.ParseExact(newDate, "ddd MMM d HH:mm:ss UTCzzzzz yyyy", CultureInfo.InvariantCulture); 

     return PartialView("_CBPDateEditPartial"); 
    } 
相關問題