“Uncaught ReferenceError: google is not defined”仅在使用load函数时出

我有一个带有两个DatePickers的页面，其中我选择开始日期和结束日期。当按钮名为"提交"按下部分视图应该加载，但我得到错误"谷歌没有定义"，下面是加载分部视图的父视图中的代码:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script>
    $(function () {
        $("#txtdatepicker1").datepicker();
        $("#txtdatepicker2").datepicker();
    });
    function CalendarClick() {
        $("#divul").load("/Greenhouse/Calendarul?startDate=" + $("#txtdatepicker1").val() + "&endDate=" + $("#txtdatepicker2").val());
    }
</script>

<h2>
    Datepicker Calender
</h2>
@using (Html.BeginForm())
{
    <table>
        <tr>
            <td>
                <p>
                    Start Date: @Html.TextBoxFor(m => m.StartDate, new { @id = "txtdatepicker1", @style = "width:200px;" })
                </p>
            </td>
            <td>
                <p>
                    End Date: @Html.TextBoxFor(m => m.EndDate, new { @id = "txtdatepicker2", @style = "width:200px;" })
                </p>
            </td>
        </tr>
    </table>
    <input type="button" name="btnSubmit" value="Submit" onclick="CalendarClick()"/>
    <div id="divul"></div>
 } 

这是部分视图，但函数从未被调用:

@model Plotting.Models.ChartDate
@{
    ViewBag.Title = "How To Create Dynamic Google Column Chart In an Asp.Net MVC Application Using C# ";
}
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("visualization", "1", { packages: ["corechart"] });
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        alert("aaa");
        // Create and populate the data table.
        var days = [@Model.DateData.Date];
        var humidities1 = [@Model.DateData.Humidity1];
        var humidities2 = [@Model.DateData.Humidity2];
        var data = new google.visualization.DataTable();
        data.addColumn('string', '@Model.DateTitle');
        data.addColumn('number', '@Model.HumidityTitle1');
        data.addColumn('number', '@Model.HumidityTitlle2');
        for (i = 0; i < days.length; i++) {
            data.addRow([days[i].toString(), humidities1[i], humidities2[i]]);
        }
        var options = {
            title: 'Humidities Values',
            hAxis: { title: '@Model.DateTitle', titleTextStyle: { color: 'black' } }
        };
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
    }
</script>
<fieldset>
    <legend><strong>Greenhouse</strong></legend>    
    <div id="chart_div" style="width: auto; height: auto;">
    </div>
</fieldset>

谢谢!