Enter Zipcode and auto fill city / auto select State

[heatherwebdev]

I'm using this method for auto detecting city and state based on zipcode
https://css-tricks.com/using-ziptastic/

It pulls from a free api that allows for 100 requests per day.

I have it working with the city field, but since the state field is a select box, it is not working for it.

How do I get the state to be selected?

If I change #ShipStateSelect to #ShipState then it does fill in the state in the Other State/Province field.

<script>
function is_int(value) {
  if ((parseFloat(value) == parseInt(value)) && !isNaN(value)) {
    return true;
  } else {
    return false;
  }
}


$("#ShipZip").keyup(function() {

  // Cache
  var el = $(this);

  // Did they type five integers?
  if ((el.val().length == 5) && (is_int(el.val()))) {

    // Call Ziptastic for information
    $.ajax({
      url: "https://zip.getziptastic.com/v2/US/" + el.val(),
      cache: false,
      dataType: "json",
      type: "GET",
      success: function(result, success) {

        $(".zip-error, .instructions").slideUp(200);

        $("#ShipCity").val(result.city);
     $("#ShipStateSelect").val(result.state);

      },

    });

  } 

});

</script>

[Bruce - PhosphorMedia]

The VALUE of the OPTION to be selected has to match the value being passed in via jQuery. So, if my zip produced the value of 'WA' and my select dropdown option value was 'washington' it wont select. If the values don't match, you'd have to create a lookup table to convert them.

[heatherwebdev]

Thanks for the help! I actually managed to find a quicker solution!
I went to the Ziptastic website and looked at their documentation
https://www.getziptastic.com./documentation

And I replaced
$("#ShipStateSelect").val(result.state); in my code to
$("#ShipStateSelect").val(result.state_short); This now works with my option values, without needing to do additional coding.

[Bruce - PhosphorMedia]

Yup, basically getting the Option VALUE and the value you are asking to select to be the same.