Instascan, How to open input content in another page using javascript

I'm new in this but I'm learning how to use Javascript/PHP. I'm trying to scan a QR code and pass the content to another PHP page. I'm using form/input field with a button submit, using PHP 'GET' to get the data content, and it works, but is not what I want to do, because I need to avoid the 'button submit', I'm trying to use jQuery to submit the form when the QR is scanned , but it doesn't work, this is my code:

    <section class="scans">
      <h2>Scans</h2>
      <ul v-if="scans.length === 0">
        <li class="empty">Ningun escaneo todavia</li>
      </ul>                

      <transition-group name="scans" tag="ul">
        <li v-for="scan in scans" :key="scan.date" :title="scan.content">{{ scan.content }}
           <form id="myform" action="empleados.php" method="get">
            <input type="hidden" name="qr" :key="scan.date" :value="scan.content" />
             <input class="btn btn-primary" type="submit" value="Registrar Acceso/Salida"/>
$(function() { $("#myform").submit(); });
          </form>
        </li>
      </transition-group>
    </section>
  </div>
  <div class="preview-container">
    <video id="preview"></video>
  </div>

This is the PHP page empleados.php and the code to GET the content of the scan:

 <?php  
    $info_qr=$_GET['qr'];

Upvotes: 0

Views: 459

Answers (1)

Mirdrack
Mirdrack

Reputation: 790

You need to attach your action to the onChange event of the text input

<script>
$('input[name$="qr_code"]').on('change', submitForm)

function submitForm() {
    // your ajax request
}
</script>

If the onChange event doesn't meet your needs try using the event 'keyup' or one of these events: https://developer.mozilla.org/en-US/docs/Web/Events

And I recommend you move your js code inside of a <script> tag

Upvotes: 0

Related Questions