使用表单的多个输入提交到url

Question

I have a form with 3 multiple choice questions. The questions lead to one of 5 pages (url) depending on the selected choices of each question.

I searched here for a javascript that works with a similar situation yet the script doesn't work in my site.

My form code is:

        <fieldset id="second">

<h3 class="mbot_0"><label>How many miles does your auto have</label>
</h3>
<select id="mileage" data-hint="" name="mileage">
        <option id="m1" selected value="0-15,000">
          0-15,000
        </option>
        <option id="m2" value="15,001-30,000">
          15,001-30,000
        </option>
        <option id="m3" value="30,001-65,000">
          30,001-65,000
        </option>
        <option id="m4" value="65,001-100,000">
          65,001-100,000
        </option>
        <option id="m5" value="100,000+">
          100,000+
        </option></select>

<h3 class="mbot_0"><label>Does your car have a GDI engine?</label></h3>
<select id="gdi" data-hint="" name="gdi">
<option id="" selected value="--">Select one
        </option>
        <option id="" value="yes">Yes</option>
<option id="" value="no">No</option>
</select>

<h3 class="mbot_0"><label>Do you use top-tier fuel when you fill up?</label></h3>
<select id="fuel" >
        <option id="" selected value="--">Select one
        </option>
        <option id="" value="yes">Yes
        </option>
      <option id="" value="no">No
        </option>
      </select>
      <input id="pre_btn1" onclick="prev_step1()" type="button" value="Previous">
      <input type="submit"  id="calculate"
value="Calculate"  onclick="replace()"/>
</fieldset></form>

and My script is

function replace() {
if (document.getElementById('mileage').value == '0-15,000' && document.getElementById('gdi').value == 'yes' && document.getElementById('fuel').value == 'yes') {
  window.location = 'http://www.arnolfodesign.com/clients/itw_carbonator/outcome01.html';
} else if (document.getElementById('mileage').value == '0-15,000' &&   document.getElementById('gdi').value == 'yes' &&   document.getElementById('fuel').value == 'no') {
  window.location = 'http://www.arnolfodesign.com/clients/itw_carbonator/outcome02.html';
} 
}
</script>

I'm learning javascript as I go. Please, what am I missing in the script?

Answer 1

I've got the script to work. I stripped out the commas in the "mileage" values and also replaced the submission button from type=submit to type=button. Maybe there was something overriding the submit function? Also changed the script function from "replace()" to "calc()". Unclear which item directly effected the script but it now works as I expected.