JQuery Mobile根據Datepicker值獲取Json數據

我在phonegap項目。我使用jqm框架。我有一個web api服務來獲取數據到我的移動應用程序，在這裏我想在這個項目上使用Jquery Mobile Datepicker。JQuery Mobile根據Datepicker值獲取Json數據

不久，我需要根據選定的日期獲取數據。

例如，在這裏; http://jqueryui.com/datepicker/

有沒有像使輸入自動回發的任何用法，讓程序根據文本框的值獲取數據？

我也在這裏閱讀; http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/

有沒有我要檢查的例子？我Google搜索，但無法看到像我的想法的例子。

謝謝。

來源

2013-05-06 Kuthay Gümüş

這裏有一個工作示例：http://jsfiddle.net/Gajotres/r2CuF/

我已刪除JSON從我的例子，因爲它是一個私人數據。

HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>jQM Complex Demo</title> 
     <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/> 
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />   
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>   
     <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>  
    </head> 
    <body> 
     <div data-role="page" id="index"> 
      <div data-theme="a" data-role="header"> 
       <h3> 
        First Page 
       </h3> 
      </div> 

      <div data-role="content"> 
       <p>Date: <input type="text" id="datepicker" /></p>     
      </div> 
     </div> 
     <div data-role="page" id="info"> 
      <div data-theme="a" data-role="header"> 
       <h3> 
        Info 
       </h3> 
       <a href="#index" class="ui-btn-left">Back</a> 
      </div> 

      <div data-role="content"> 

      </div> 
     </div>   
    </body> 
</html>

的Javascript：

$(document).on('pageinit', '#index', function(){  
    $("#datepicker").datepicker({ dateFormat: 'yy-mm-dd', 
     onSelect: function(date, instance) { 
      selectedDate.date = date; 
      $.mobile.changePage("#info", { 
       transition: "slide", 
       reverse: false, 
       changeHash: false 
      });    
     } 
    }); 
}); 

$(document).on('pagebeforecreate', '#info', function(){  
    var json = $.parseJSON(dateHandler.json); 
    $.each(json.Dates, function(id,date) { 
     console.log(date.Date + '-' + selectedDate.date); 
     var patt = new RegExp(selectedDate.date); 
     if(patt.test(date.Date)) { 
      $('#info [data-role="content"]').append(JSON.stringify(date.Date)); 
     } 
    }); 
});  

var selectedDate = { 
    date : null 
} 

var dateHandler = { 
    json : '' 
}

來源

2013-05-07 09:55:23 Gajotres

感謝您的回答，這將是對我來說非常有用。 – 2013-05-07 11:29:04

JQuery Mobile根據Datepicker值獲取Json數據

回答

相關問題