title: How to clear radio button on select box value change? VueJS2
body: <p>I'm a newbie to JavaScript/VueJS and I need some help on clearing all radio inputs when a select box value (office code) is changed.</p>
  
  <blockquote>
    <p>Here's my HTML/view code:</p>
  </blockquote>
  
  <pre><code>&lt;div id="app"&gt;
  
  &lt;form id="myForm'&gt;
  
  &lt;select id="office" v-model="selectedOffice" required&gt;
      &lt;option value="" selected disabled&gt;-Select-&lt;/option&gt;
      &lt;option v-for="office in officeList" :value="office"&gt;{{office.code}}&lt;/option&gt;
  &lt;/select&gt;
  
  &lt;section v-if="selectedOffice !== ''"&gt;
      &lt;h2&gt;Please specify your product type:&lt;/h2&gt;
  
  &lt;div id="productsList&gt;
      &lt;label&gt;
          &lt;input type="radio" name="productType" id="book" v-model="selectedProductType"&gt; BOOKS
      &lt;/label&gt;
  &lt;label&gt;
          &lt;input type="radio" name="productType" id="magazines" v-model="selectedProductType"&gt; MAGAZINES
      &lt;/label&gt;
  
  ....snipped...
  
  &lt;/form&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <blockquote>
    <p>My model:</p>
  </blockquote>
  
  <pre><code>var vm = new Vue({
      el: '#app',
      data: {
          selectedOffice: '',
          selectedProductType: '',
          officeList: [
              { code: 'Office1' }, {code: 'Office2' }, ...snipped...
          ]
  </code></pre>
  
  <p>I thought maybe I'd do create a method in the Vue instance like so:</p>
  
  <pre><code>methods: {
      clearRadio: function(){
          productType.prop('checked', false);
      }
  }
  </code></pre>
  
  <p>...but I am unsure how to implement that to the view (assuming that's the best way to do this) on office value change.</p>
  
  <p>Thanks for any help!</p>