2013-02-27 26 views
0

我完全陌生的jquery移動如此裸露與我。 我有一個簡單的表單,其中包含jQuery UI的日期選擇器,基本上當日期發生變化時,我想刷新我的數據(去基於日期獲取所有記錄)。 但是我不知道如何刷新數據? 所以尋求建議和簡單的例子,如果你能幫助請。ASP.Net MVC 4,Jquery移動和更新數據

@model ViewModels.ScheduleMobileDisplay 
@{ 
    ViewBag.Title = "Test"; 
    Layout = "~/Views/Shared/_AppHomeLayout.Iphone.cshtml"; 

} 


@using (Html.BeginForm()) 
{ 
{ 
    <div data-role="page" id="pageAccount"> 
     <link href="~/Content/CSS/jquery-ui-1.10.1.Redmond/jquery-ui-1.10.1.custom.min.css" rel="stylesheet" /> 
     <script> 
      $(function() { 
       $("#datepicker").datepicker(
        { 
         showButtonPanel: true, 
         dateFormat: "dd-M-yy", 
         onSelect: function (dateText, inst) { 
          var date = $(this).val(); 
          alert('I Need to refresh the data below' + date); 
         } 
        }); 
      }); 

     </script> 
     <div data-role="content"> 

      <input type="text" id="datepicker" placeholder="Select Date" /> 

      <ul data-role="listview" data-divider-theme="b" data-inset="true"> 
       <li data-role="list-divider" role="heading"> 
        @Model.AppointmentDate 
       </li> 
       @foreach (var item in Model.Appointments) 
       { 
        <li data-theme="c"> 
         <a href="/Schedule/MobileAppointmentEdit/@item.Id" data-transition="slide"> 
          @item.StartTime @item.Name 
         </a> 
        </li> 
       } 

      </ul> 
     </div> 

    </div> 

} 

回答

1

你會想打個電話ajax的Web服務來獲取數據,然後更新Ajax調用的回調success你的頁面。

$.ajax('www.mywebsite.com/myserviceurl', { 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    data: messageData, 
    type: 'POST', 
    timeout: 20000, 
    success: function(data) { 
     /* update page here */ 
    }, 
    error: function(jqXHR, textStatus, errorThrown) { 
     console.log(errorThrown); 
    } 
});