title: How to programmatically fill out Microsoft Office Forms form?
body: <p>My company has a Microsoft Form that I have to fill out around 10 times every month, but the actual form data that I input doesn't change very much. For the fields that don't change I want to be able to programmatically fill it out, likely using javascript. Using the &quot;User Javascript and CSS&quot; chrome extension I have already injected javascript to put a button on the page I can click to fill it out, but when I click &quot;Submit&quot; the form doesn't detect that the fields have been populated.</p>
  <p>Here is an example form:
  <a href="https://forms.office.com/Pages/ResponsePage.aspx?id=A2isORETDk26ciZZHMzhJJh3e-CRp49LqjxXVoNyf99UQVZZTkdHS0ZVTkJHSDg5RE1VNkZDWVJPRS4u" rel="noreferrer">https://forms.office.com/Pages/ResponsePage.aspx?id=A2isORETDk26ciZZHMzhJJh3e-CRp49LqjxXVoNyf99UQVZZTkdHS0ZVTkJHSDg5RE1VNkZDWVJPRS4u</a></p>
  <p>Here is a bit of jquery to fill out the text box</p>
  <pre class="lang-js prettyprint-override"><code>$('#form-container &gt; div &gt; div &gt; div.office-form-content.office-form-page-padding &gt; div &gt; div.office-form.office-form-theme-shadow &gt; div.office-form-body &gt; div:nth-child(2) &gt; div:nth-child(2) &gt; div.office-form-question-content.office-form-theme-focus-border &gt; div.office-form-question-element &gt; div &gt; div &gt; div &gt; input')[0].value = &quot;hello&quot;
  </code></pre>
  <p>Notice that the field becomes blank and receives a validation error when you click &quot;Submit&quot;.</p>
  <p><em>How can I populate these fields programmatically in a way that the data is received by the form?</em></p>