[Løst] JS function med jquery/ajax lastes ikke?

Anzure · 25. oktober 2017

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
function updateInput(input) {
  var url = "http://localhost/lib/test.php?get=" + input;

  $.ajax({
    type:"GET",
    url: url,
    success: function(data) {
      var obj = JSON.parse(data);
      var num= obj.num;
      document.getElementById("numInput").value = num;
    },
    error: function(jqXHR, textStatus, errorThrown) {
      alert(jqXHR.status);
    },
    dataType: "jsonp"
  });
}
</script>

Av en eller annen grunn får jeg feilmelding om følgende: Uncaught ReferenceError: updateInput is not defined

at HTMLInputElement.onchange

Får ingen feilmeldinger når siden lastes, men når inputfield@onchange prøver å kjøre scriptet kalt updateInput, så feiler den. Noen som har en idé?

Dan-Levi · 26. oktober 2017

Du wrapper javascripten din inni script tagsene som du refererer jquery med. Løsningen er å lage egne script tags for logikken din.

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
  </head>
  <body>
    <input type="number" id="numInput" onchange="updateInput(this.value);">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
    const url = "http://localhost/lib/test.php",
    updateInput = (userVal) => {
      let request = $.ajax({
        url       : url,
        method    : "GET",
        data      : {userVal},
        dataType  : "json",
        success   : (data) => {
          $( "#numInput" ).val( data.num );
        }
      });
    }
    </script>
  </body>
</html>

lib/test.php

<?php
die (
  json_encode(
    array(
      "num" => ( intval($_GET['userVal']) * 2)
    )
  )
);

Endret 26. oktober 2017 av Dan-Levi

Anzure · 26. oktober 2017

Du wrapper javascripten din inni script tagsene som du refererer jquery med. Løsningen er å lage egne script tags for logikken din.

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
  </head>
  <body>
    <input type="number" id="numInput" onchange="updateInput(this.value);">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
    const url = "http://localhost/lib/test.php",
    updateInput = (userVal) => {
      let request = $.ajax({
        url       : url,
        method    : "GET",
        data      : {userVal},
        dataType  : "json",
        success   : (data) => {
          $( "#numInput" ).val( data.num );
        }
      });
    }
    </script>
  </body>
</html>

lib/test.php

<?php
die (
  json_encode(
    array(
      "num" => ( intval($_GET['userVal']) * 2)
    )
  )
);

Tusen takk, det der funka konge!

Dan-Levi · 26. oktober 2017

Bare hyggelig :-)

Logg inn

[Løst] JS function med jquery/ajax lastes ikke?

Anbefalte innlegg

Anzure

Lenke til kommentar

Videoannonse

Dan-Levi

Lenke til kommentar

Anzure

Lenke til kommentar

Dan-Levi

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer