JSFiddle - React, Tailwind, and code Playground
HTML
<form role="form" id="form" class="form-horizontal">
<div class="form-group">
<div class="row">
<div class="col-md-3 portfolio-item">
<h5>Region</h5>
<select class="form-control" name="region" id="region">
<option value="">Select a Region</option>
<option value="US">US</option>
<option value="UK">UK</option>
<option value="XS">XS (Sales Team)</option>
<option value="XT">XT (Editorial Test)</option>
</select>
</div>
<div class="col-md-3 portfolio-item">
<h5>Duration</h5>
<select class="form-control" name="duration" id="duration">
<option value="">Select a Duration</option>
<option value="5">5 Minutes</option>
<option value="10">10 Minutes</option>
<option value="15">15 Minutes</option>
<option value="20">20 Minutes</option>
<option value="25">25 Minutes</option>
<option value="30">30 Minutes</option>
</select>
</div>
<div class="col-md-3 portfolio-item">
<input type="submit" class="btn btn-default" id="submit" />
</div>
</div>
</div>
</form>
<a id="link" href>JSON feed</a>
JavaScript
document.getElementById('submit').onclick = updateLink;
function updateLink(e) {
e.preventDefault();
var regionBox = document.getElementById('region'),
region = regionBox.options[regionBox.selectedIndex].value,
durationBox = document.getElementById('duration'),
duration = durationBox.options[durationBox.selectedIndex].value,
link = document.getElementById('link'),
newHref = '/editoralPortal/?region=' + region + '&duration=' + duration;
link.href = newHref;
// prevent form submission
return false;
}