How to put input fields values into a contact form 7 field?

Question

I want to use

<input type="text" id="bla1" name="bla1" />

And use this input to create a field from contact form 7

[text bla2 id:bla2 name:bla2]

Maybe use some javascript to get this done?

Little update:

<input type="number" id="bla1" name="bla1" min="0" max="100" onblur="change(change-to-form-field);" />
  <span Method="Get" id="span2">
  [number bla2 id:bla2]
  </span>

  <script>
  function change(change-to-form-field)
{
  var bla1var = document.getElementById('bla1').value;
  document.getElementById('bla2').value=parseFloat('bla1var');
  document.span2.submit();
}
</script>
    ```

Answer 1

I found the answer myself, but I want to share it. Hope I can help someone using inputfields while remaining the functionality of the Contact Form 7 fields! I ran into some problems but using the two DIV solved the issues.

<div name="test1">
<input type='number' id='bla1' onblur='Changeinput2field();' value="5"/>
</div>
<div name ="testarea1" Method="Get" id='form1'>
[number bla2 id:bla2 name:bla2 "5"]
</div>
<script>
function Changeinput2field()
{
  var bla1var = document.getElementById('bla1').value;
  var per10 = parseFloat(bla1var) ;
  document.getElementById('bla2').value=parseFloat(per10);
  document.form1.submit();
}
</script>