0

With AJAX I am getting data from a db sent back to the website as an json array. I get to put the result out to be displayed, but when I am going to use the data further, it says ReferenceError. variable is not defined. I can't see what I am doing wrong.
I am supposed to use the data from a object to put it as a parameter in a button for deleting (later), but in the code below I tried just to get the data inside the alert function to see if it worked. But somehow that does not work.

Here is my main code: (English is not my programming language. Sorry. Tried to translate what was possible)

        function find()
        {
           url = "tjener-kode.php";
              $.get(url,function(data){
              var html="";

                var dataen=JSON.parse(data);
                  console.log(dataen);

                  var postnumber="";
                  var postplace="";
                  for (var a=0; a < dataen.length; a++){

                    postnumber=dataen[a].postnr;
                    postplace=dataen[a].poststed;
                    html+="Postplace: "+postplace+" Postnumber: "+postnumber+" <button onClick=alarm("+dataen[a]["poststed"]+")>Test</button><br>";
                  }
                  $("#respons2").html(html);
           });
        }
        function alarm(postplace){
          alert("Hello. You clicked on  "+postplace);
        }
        </script>
    </head>
    <body>
        <p id="respons2"></p>
      <button onClick="find()">Bring all postcodes</button>
    </body>
</html>

For the button I have tried different code with the same error result:

<button onClick=alarm("+postplace+")>
<button onClick=alarm("+dataen[a]["poststed"].value+")>

Here is my server code tjener-kode.php:

<?php
$db = new mysqli("xxxxxxxxxxxxxxxxxx");
if($db->connect_error)
{
    die("Error");
}
$sql = "Select * from postnrPoststed";
    $resultat = $db->query($sql);

    $data=array();

    while($rad=mysqli_fetch_assoc($resultat)){
      $data[]=$rad;
    }
    echo json_encode($data);
?>

Using console log you can see that the result is this. And this is correct: enter image description here

But when clicking the button at the webpage belonging to each object, with the supposedly defined variable, I get this error in the console:
It says that the variable is not defined, but somehow I still get the data in the variable shown in the console log. enter image description here

kreow
  • 1
  • 3
  • In the developers tools console, if you click on the error - to which line does it refer? – Ofir Baruch Feb 09 '20 at 15:13
  • Using chrome I got this: Uncaught ReferenceError: Oslo is not defined at HTMLButtonElement.onclick ((index):1) – kreow Feb 09 '20 at 15:18
  • Why do you have to parse the data? What's the format when you just access the `tjener-kode.php` file in your browser? If the resulting format is json, you just have to access by `data.keyname`. – user10971804 Feb 09 '20 at 15:21
  • I just used parse because that was the only way I got it to be displayed the data. Do you know a better way? The only code on the tjener-kode.php is displayed above. And accessing the page on the server it looks like this: [{"postnr":"0166","poststed":"Oslo"},{"postnr":"4821","poststed":"Rykene"}] – kreow Feb 09 '20 at 15:27
  • What's the url for this file `tjener-kode.php`? Access it in your browser. – user10971804 Feb 09 '20 at 15:28
  • I just tried it without parsing. Now everything is underfined, and the for loop just looped over 10 lines. That is not working at all :) – kreow Feb 09 '20 at 15:31
  • I dont think I should share the url, but here is how it looks like. Everything is hosted on the school server: https://imgshare.io/image/nettt22.KtUtt – kreow Feb 09 '20 at 15:35
  • save `data = data[0]` and try not parsing it, and access it like this `data.postnr`. – user10971804 Feb 09 '20 at 15:39
  • That resulted in a almost endless loop. Thought and looks like I have to parse it so that javascript can handle the object. https://imgshare.io/image/ff.KgYZw – kreow Feb 09 '20 at 15:49

2 Answers2

0

You are getting this error because <button onClick=alarm("+dataen[a]["poststed"]+")> will already give you value that you need.You don't need to use .value

Alex
  • 477
  • 4
  • 14
  • But I want the "poststed" (name in database) as the value in the parameter. – kreow Feb 09 '20 at 15:22
  • I have tried everything. Without the paramter/argument the function works fine. But it is somehow something wrong with the way I pass the argument. Using the same argument to display it on the website works fine, but not when I am using the same name into the function. I dont know why – kreow Feb 09 '20 at 17:34
0

I found the problem. Here is the best answer: https://stackoverflow.com/a/9643494/12867645

Since I am using javascript to make the button, I have to append it to the paragraph. I tried the same code under inside the html+="" with and without ' , but that didn't work. So you have to append it. or document.write().

$( "#respons" ).append('<input type="button" value="test" onclick="alarm(\'' + postsplace + '\')" />');
kreow
  • 1
  • 3