Question

I am having trouble understanding why this is not working. I have two fields on my form and when I click a button another text field value is changed to that if the function. How can I get this to work?

function calculate()
{
    var odometerStart = parseFloat (document.getElementById('odometerStart').value);
    var odometerEnd = parseFloat(document.getElementById('odometerEnd').value);
    var distance = document.getElementById('distance');
    var amount = document.getElementById('amount');

    distance.value = odometerEnd - odometerStart;       
}

var val = $("#taskentry").validate({
    rules: {
        tripDate: {required: true}
        tripContact: {required: true}
        odometerStart: {required: true}     
    }
});


Odometer: Start <input type="number" name="odometer[Start]" id="odometerStart" min="0" max="999999" placeholder="0" class="required"/><br/>
Odometer: End <input type="number" name="odometer[End]" id="odometerEnd" min="0" max="999999" placeholder="999999" class="required"/><br/>
Comments <textarea name="comments" id="comments" rows="2" cols="2"></textarea><br/>
Distance <input type="text" name="distance" id="distance" value="" placeholder="0.00"/><br/>
<input type="button" name="calculate" value="Calculate" onclick="calculate()"/>

I am debuging this in Google Chrome using the developer tools and am getting the error “uncaught TypeError: Object is not a function” at the point where the calculate button is.

Answer 1

Perhaps you need commas:

var val = $("#taskentry").validate({
    rules: {
        tripDate: {required: true},
        tripContact: {required: true},
        odometerStart: {required: true}     
    }
});