Set input value before onClick event
<p>I have a Group of Radio button with different values, I'm trying to call a function based on the value of the input.</p>

<p>HTML:</p>

<pre><code>&lt;form class="form"&gt;
 &lt;div class="btn-group btn-group-justified " data-toggle="buttons" name="chartSelect"&gt;
   &lt;label class="btn btn-info"  onclick="getChart()"&gt;
     &lt;input name="chart" value="" type="radio"&gt;All
   &lt;/label&gt;
   &lt;label class="btn btn-info" onclick="getChart()"&gt;
     &lt;input name="chart" value="total" type="radio"&gt;Total
   &lt;/label&gt;
   &lt;label class="btn btn-info" onclick="getChart()"&gt;
     &lt;input name="chart" value="max" type="radio"&gt;Max
   &lt;/label&gt;
   &lt;label class="btn btn-info" onclick="getChart()"&gt;
     &lt;input name="chart" value="mean" type="radio"&gt;Mean
   &lt;/label&gt;
   &lt;label class="btn btn-info" onclick="getChart()"&gt;
     &lt;input name="chart" value="min" type="radio"&gt;Min
   &lt;/label&gt;
   &lt;label class="btn btn-info" onclick="getChart()"&gt;
     &lt;input name="chart" value="extrapolation" type="radio"&gt;Extrapolation
   &lt;/label&gt;
 &lt;/div&gt;
&lt;/form&gt;
</code></pre>

<p>JS:</p>

<pre><code>function getChart() {
    var startDate = $('#range').val().slice(0, 10) + 'T' + $('#range').val().slice(11, 16) + ':00+00:00';
    var endDate = $('#range').val().slice(19, 29) + 'T' + $('#range').val().slice(30, 38) + ':00+00:00';
    var appName = $('select[name=applicationSelect]').val();
    var envName = $('input[name=env]:checked').val();
    var chartType = $('input[name=chart]:checked').val();
    // Load chart
    ajaxLoadChart(startDate, endDate, appName, envName, chartType);
};

// Function for loading data via AJAX and showing it on the chart
function ajaxLoadChart(startDate, endDate, appName, envName, chartType) {
    // If no data is passed (the chart was cleared)
    if (!startDate || !endDate) {
        return;
    }
    // Otherwise, issue an AJAX request
    $.ajax({
        url: 'http://MyServlet.com',
        crossDomain: true,
        async: true,
        type: "GET",
        dataType: "json",
        data: {
            start: startDate,
            end: endDate,
            env: envName,
            app: appName,
            type: chartType
        },
        success: function (data) {
            defaultChart(data);
        }
        error: function(xhr, status, error) {
        alert(status + " " + error);
        console.log(xhr);
        }
    });
}
</code></pre>

<p>The problem is value of the selected input is set after the function has been called so the previous selected value is fetched in the Ajax request.</p>

<p>I'm new to JS, can I fix this without massive changes to my code?</p>