私はチャートを作成するDropboxを作成しています。私は、コンボボックスからテキスト値を取得するために関数change()
を使用しています。コンボボックスのjavascriptコードの何が間違っていますか?
\t \t
\t \t //Load the Visualization API and the chart package.
\t \t google.charts.load('current', {'packages':['corechart']});
\t \t //google.load('visualization', '1', {'packages':['corechart','table']});
\t \t //get the selected value
\t \t function change() {
\t \t \t var listbox = document.getElementById("chart");
\t \t \t var selIndex = listbox.seletedIndex;
\t \t \t var selValue = listbox.options[selIndex].value;
\t \t \t var selText = listbox.options[selIndex].text;
\t \t \t
\t \t \t //console.log(selValue);
\t \t
\t \t //chart for apply job post
\t \t google.charts.setOnLoadCallback(dashboardDraw);
\t \t function dashboardDraw(x, y){
\t \t \t //get the location data from table
\t \t \t var jsonLocationData = $.ajax({
\t \t \t \t \t url: "post_location.php",
\t \t \t \t \t data: '{}',
\t \t \t \t \t dataType: "json",
\t \t \t \t \t async: false
\t \t \t \t \t }).responseText;
\t \t \t //create our data table out of json data loaded from server
\t \t \t var LocationData = new google.visualization.DataTable(jsonLocationData);
\t \t \t //get the company data from table
\t \t \t var jsonCompanyData = $.ajax({
\t \t \t \t \t url: "post_company.php",
\t \t \t \t \t data: '{}',
\t \t \t \t \t dataType: "json",
\t \t \t \t \t async: false
\t \t \t \t \t }).responseText;
\t \t \t //create our data table out of json data loaded from server
\t \t \t var CompanyData = new google.visualization.DataTable(jsonCompanyData);
\t \t \t
\t \t \t
\t \t \t //company chart details
\t \t \t var optionsLocation = {
\t \t \t title: 'Job Posts by Location',
\t \t \t pieSliceText: 'label',
\t \t \t tooltip: {isHtml: true},
\t \t \t width: 700,
\t \t \t height: 500,
\t \t \t chartArea: { left:"5%",top:"5%",width:"90%",height:"90%" }
\t \t };
\t \t \t
\t \t //company chart details
\t \t var optionsCompany = {
\t \t \t title: 'Job Posts by Company',
\t \t \t pieSliceText: 'label',
\t \t \t tooltip: {isHtml: true},
\t \t \t width: 700,
\t \t \t height: 500,
\t \t \t chartArea: { left:"5%",top:"5%",width:"90%",height:"90%" }
\t \t };
\t \t \t
\t \t var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
\t \t \t if (selValue == 'location_val') {
\t \t \t x = LocationData;
\t \t \t y = optionsLocation;
\t \t \t }
\t \t \t if (selValue == 'company_val') {
\t \t \t x = CompanyData;
\t \t \t \t y = optionsCompany;
\t \t \t }
\t chart.draw(x, y);
\t }
\t \t
\t \t \t \t
\t } \t
\t <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
\t <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<table>
<th>
<select id="chart" name="select1" onchange="change()">
\t <option selected disabled="select">Select</option>
\t <option value="company_val">By Company</option>
\t <option value="location_val">By Location</option>
</select>
</th>
</table>
<div id="chart_div"></div>
コンソールには、次のエラーを示しています:
TypeError: listbox.options[selIndex] is undefined[Learn More] dashboard.php:25:8
コードの問題の一部がこれです:
var selValue = listbox.options[selIndex].value;
var selText = listbox.options[selIndex].text;
どのようにすることができますこれはコードです私はこの問題を解決する?私はコードをチェックしており、構文上の問題はありません。
'selIndex'が実際にどのような値を含んでいるかチェックしましたか? – CBroe
値は定義されていません – joun