HTMLService/Google Apps脚本中的日期选择器

Question

我想使用日期选择器来更轻松地在我正在开发的应用程序中选择日期的方式，但是我不知道如何使用HTML中的HTML服务来实现它的功能Apps脚本。

如果你能提供给我这样的一个例子，我真的很感激它，因为我真的需要它

我想是这样的：http://jqueryui.com/datepicker/

Answer 1

你只需要包括jQuery库您码，一个基本的例子如下：

<div class="demo" > 
<style type="text/css"> .demo { margin: 30px ; color : #AAA ; font-family : arial sans-serif ;font-size : 10pt } 
          p { color : red ; font-size : 14pt } 
</style> 
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/themes/cupertino/jquery-ui.css"> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script> 

<h1>Welcome to some random page</h1> 

<p>Please select a date below :</p> 

click here : <input type="text" name="date" id="datepicker" /> 
<input type="text" id="alternate" size="30"></p> 
<script> 
    $("#datepicker").datepicker({ 
     altField: "#alternate", 
     altFormat: "DD, d MM, yy", 
     showWeek: true, 
     firstDay: 1, 
    }); 
</script> 

</div> 

Code.gs：

function doGet() { 
    return HtmlService.createTemplateFromFile('index').evaluate().setSandboxMode(HtmlService.SandboxMode.NATIVE); 
} 

请注意，建议在不同文件中将html和脚本的样式分开，请参阅best practice article in Google HTML Service documentation，我在这里没有做到这一点，以使示例更简短，更易于阅读。