JQueryのドロップダウンリストの値に基づいてページを読み込む方法

Question

フィルタ基準に基づいてレポートを生成するために構築しているASPX Webページがあります。

var sourceRptType = [ 
      { value: '0', label: 'Hours & Labour Cost By Employee' }, 
      { value: '1', label: 'Hours & Labour Cost By Project' }, 
      { value: '2', label: 'Premiums & Allowances By Employee' }, 
      { value: '3', label: 'Premiums & Allowances By Project' }, 
      { value: '4', label: 'Daily Labour Costs & Allowances By Employee' }, 
      { value: '5', label: 'Daily Labour Costs & Allowances - Raw Data' }, 
      { value: '6', label: 'Daily Labour Costs & Allowances By Employee w/ Premiums' }, 
      { value: '7', label: 'Daily Labour Costs & Allowances By Employee w/ Allowance Breakout' }, 
      { value: '8', label: 'Daily Labour Costs & Allowances w/ Premiums - Raw Data' }, 
     ]; 

が、私は私のボタンは、上記選択された値に基づいてWebページをロードしたい：私は、私が作成したVARからの値を取得し、私は私のドロップダウンリストを取得するために使用jqxwidgetを、持っています。選択したドロップダウンリストの値をロードするためにボタンを取得するにはどうすればよいですか？

Answer 1

HTML出力を共有したか、select要素IDと記載しましたが、それはreport_typeと思われます。レポートデータが表示されるID report_tableの表があるとします。

$('select').first().on('change', function() { 
    // get the report ID 
    var reportID = $(this).val(); 

    // pass that to your API endpoint or any file to process your request 
    // via AJAX 
    $.ajax({ 
     url: 'someFile.asp', 
     data: { 
      report: reportID 
     }, 
     success: function(response) { 
      // let's suppose your response is in JSON 

      // target table 
      var table = $('#reports_table'); 

      // insert the data 
      response.each(function(index, row){ 
       table.append('<tr><td>' + row.title + '</td></tr>'); 
       // depends on your data but should not be hard to guess 
      }) 
     } 
    }) 
}); 

注：上記のコードはテストされていないため、エラーが発生する可能性があり、データや環境によって異なる場合があります。

さらに助けが必要な場合や助けが必要な場合はお知らせください。