Factoring in weights

We now have two addresses – the start and end markers for the journey. All the visitor needs to do now is enter a weight and we'll be able to calculate and display the distance and cost.

Engage Thrusters

All we need to do in this task is add a handler for the <input> element in the UI area so that once a weight is entered the <button> becomes clickable. We can achieve this with the following code, which can be added directly after the markerDrag() function from the previous task:

$("#weight").on("keyup", function () {
    if (timeout) {
        clearTimeout(timeout);
    }

    var field = $(this),
        enableButton = function () {
            if (field.val()) {
                $("#getQuote").removeProp("disabled");
            } else {
                $("#getQuote").prop("disabled", true);
            }
        },
        timeout = setTimeout(enableButton, 250);
});

Objective Complete - Mini Debriefing

We can add the event handler for the user-generated keyup...