Data ophalen met ajax

**Mathijs Kingma** · 10-06-2011, 11:35

Ik maak nu gebruik van het volgende stukje code:

Code:

<script>
$(document).ready(function(){
	
	$('#groepen').change(function(){
		alert($('#groepen').val());
		
		var grbData = $.ajax({
        	type : "GET",
        	url : "http://rva.xuveo.nl/systeem/get_data.php",
        	data : "groepid=0",
        	success: function (html) {
            $("#example").html(html);
        }
});
	});
});

</script>

En hiermee wil ik graag wanneer iemand een item selecteerd uit een select list dat hij van de gekozen waarde de bijbehorende waarden opzoekt in een database.
Deze query komt dan te staan op get_data.php.
Maar ik kom er niet helemaal uit om het gekozen item door te sturen en de informatie weer te ontvangen.
Kan iemand mij hiermee helpen?

**Clifford James** · 10-06-2011, 11:47

Dit voorbeeld is met jQuery neem ik aan?

Origineel gepost door Mathijs Kingma

Ik maak nu gebruik van het volgende stukje code:

Code:

<script>
$(document).ready(function(){
	
	$('#groepen').change(function(){
		alert($('#groepen').val());
		
		var grbData = $.ajax({
        	type : "GET",
        	url : "http://rva.xuveo.nl/systeem/get_data.php",
        	data : "groepid=0",
        	success: function (html) {
            $("#example").html(html);
        }
});
	});
});

</script>

En hiermee wil ik graag wanneer iemand een item selecteerd uit een select list dat hij van de gekozen waarde de bijbehorende waarden opzoekt in een database.
Deze query komt dan te staan op get_data.php.
Maar ik kom er niet helemaal uit om het gekozen item door te sturen en de informatie weer te ontvangen.
Kan iemand mij hiermee helpen?

**Mathijs Kingma** · 10-06-2011, 11:48

Origineel gepost door Clifford James

Dit voorbeeld is met jQuery neem ik aan?

Ja klopt, was ik vergeten te melden.

**Clifford James** · 10-06-2011, 11:51

Zo ja:

Code:

$(function(){
  $('#groepen').change(function(){
    $('#example').load('http://rva.xuveo.nl/systeem/get_data.php',{groepid:0});
  });
});

Origineel gepost door Clifford James

Dit voorbeeld is met jQuery neem ik aan?

**Mathijs Kingma** · 10-06-2011, 11:57

Is het dan ook mogelijk om de geselecteerde waarde van de select list mee te geven?
Daar gebruik ik de volgende voor:

Code:

$('#example option:selected').val()

, maar ik weet niet hoe ik dat in jou code kan verwerken.

**Clifford James** · 10-06-2011, 11:59

Code:

$(function(){
  $('#groepen').change(function(){
    $('#example').load('http://rva.xuveo.nl/systeem/get_data.php',{groepid:$(this).val()});
  });
});

Origineel gepost door Mathijs Kingma

Is het dan ook mogelijk om de geselecteerde waarde van de select list mee te geven?
Daar gebruik ik de volgende voor:

Code:

$('#groepsleden option:selected').val()

, maar ik weet niet hoe ik dat in jou code kan verwerken.

**Mathijs Kingma** · 10-06-2011, 12:14

Ik krijg het niet werkend..

Op de get_data.php staat de volgende code

PHP Code:


<?php
include('../config.php');
    $query2 = 'SELECT 
                g.id,
                g.groep_naam,
                g.hash, 
                l.id,
                l.user_id,
                l.hash,
                w.ID,
                w.display_name
            FROM 
                groepen AS g
            INNER JOIN 
                groep_leden AS l 
                    ON g.hash = l.hash 
            INNER JOIN
                wp_users as w
                    ON l.user_id = w.ID
                    WHERE l.hash = "'.$_GET['hash'].'"'; 
                    
    $result2 = mysql_query($query2) or die(mysql_error());
    
                    while ($row = mysql_fetch_assoc($result2))  
                        {  

                              echo "<option value='".$row['id']."'>".$row['id']."</option><br/>"; 

                    }    
?>

Hij moet dus de hash code meegeven als ik een bepaald item selecteer in de select list. Hiervan de leden opvragen in de database dmv get_data.php en dan de verschillende waarden teruggeven in de vorm van een <option>

**Clifford James** · 10-06-2011, 12:17

Hoe ziet je select er nu uit?

Je kan het proberen met:

Code:

$(function(){
  $('#groepen').change(function(){
    $('#example').load('http://rva.xuveo.nl/systeem/get_data.php',{hash:$(this).val()});
  });
});

En in PHP met:

PHP Code:


$_POST['hash']

ipv

PHP Code:


$_GET['hash']

Origineel gepost door Mathijs Kingma

Ik krijg het niet werkend..

Op de get_data.php staat de volgende code

PHP Code:


<?php

include('../config.php');

    $query2 = 'SELECT 

                g.id,

                g.groep_naam,

                g.hash, 

                l.id,

                l.user_id,

                l.hash,

                w.ID,

                w.display_name

            FROM 

                groepen AS g

            INNER JOIN 

                groep_leden AS l 

                    ON g.hash = l.hash 

            INNER JOIN

                wp_users as w

                    ON l.user_id = w.ID

                    WHERE l.hash = "'.$_GET['hash'].'"'; 

                    

    $result2 = mysql_query($query2) or die(mysql_error());

    

                    while ($row = mysql_fetch_assoc($result2))  

                        {  



                              echo "<option value='".$row['id']."'>".$row['id']."</option><br/>"; 



                    }    

?>

Hij moet dus de hash code meegeven als ik een bepaald item selecteer in de select list. Hiervan de leden opvragen in de database dmv get_data.php en dan de verschillende waarden teruggeven in de vorm van een <option>

**Mathijs Kingma** · 10-06-2011, 12:57

Bedankt voor je hulp, ik heb nu GET veranderd in POST en de select query is nog steeds hetzelfde, maar de resultaten worden nog steeds niet geladen in de select list.

Dit is de code waarmee ik de lists laat zien:

Code:

<h1>Groep beheer</h1>
<label for="groepsleden">Groepsleden</label>
<select id="groepen" name="groepen">
<?php
while($row = mysql_fetch_assoc($result)) { ?>
	<option value="<?php echo $row['hash']; ?>"><?php echo $row['groep_naam']; ?></option>
<?php } ?>
</select>
<input type="submit" onclick="addOption()" value="Voeg toe" name="toevoegen" />
<input type="submit" onclick="deleteOption()" value="Verwijder" name="delete" />
  <form action="http://xuveo.nl/rva/systeem/groepen-beheer.php" method="post">

<label for="nieuwegroep">Nieuwe groep</label>
<select id="example" multiple size="6" name="example">
</select>

<label for="groepsnaam">Groepsnaam</label>
<input type="text" name="groepsnaam" /><br />

<input type="submit" name="submit2" value="Opslaan" name="opslaan" />

**Clifford James** · 10-06-2011, 13:03

Wat ook even belangrijk is om te checken is of de AJAX request gedaan wordt naar het zelfde domein waarvan de request gedaan wordt. Daarnaast kan je ook nog even kijken in de JavaScript console van je browser voor eventuele foutmeldingen.

Origineel gepost door Mathijs Kingma

Bedankt voor je hulp, ik heb nu GET veranderd in POST en de select query is nog steeds hetzelfde, maar de resultaten worden nog steeds niet geladen in de select list.

Dit is de code waarmee ik de lists laat zien:

Code:

<h1>Groep beheer</h1>
<label for="groepsleden">Groepsleden</label>
<select id="groepen" name="groepen">
<?php
while($row = mysql_fetch_assoc($result)) { ?>
	<option value="<?php echo $row['hash']; ?>"><?php echo $row['groep_naam']; ?></option>
<?php } ?>
</select>
<input type="submit" onclick="addOption()" value="Voeg toe" name="toevoegen" />
<input type="submit" onclick="deleteOption()" value="Verwijder" name="delete" />
  <form action="http://xuveo.nl/rva/systeem/groepen-beheer.php" method="post">

<label for="nieuwegroep">Nieuwe groep</label>
<select id="example" multiple size="6" name="example">
</select>

<label for="groepsnaam">Groepsnaam</label>
<input type="text" name="groepsnaam" /><br />

<input type="submit" name="submit2" value="Opslaan" name="opslaan" />

**Mathijs Kingma** · 10-06-2011, 13:06

Alweer bedankt, de javascript console geeft als melding: XMLHttpRequest cannot load http://rva.xuveo.nl/systeem/get_data.php. Origin http://xuveo.nl is not allowed by Access-Control-Allow-Origin. Ondersteund mijn server het dan niet of is er iets anders aan de hand?

**Clifford James** · 10-06-2011, 13:13

Je request gaan naar http://rva.xuveo.nl/systeem/get_data.php dit is een subdomein van http://xuveo.nl/ en dit mag niet security wise van de browsers (dacht ik).

Als je de request naar http://xuveo.nl/systeem/get_data.php stuurt zou je deze melding niet krijgen.

Origineel gepost door Mathijs Kingma

Alweer bedankt, de javascript console geeft als melding: XMLHttpRequest cannot load http://rva.xuveo.nl/systeem/get_data.php. Origin http://xuveo.nl is not allowed by Access-Control-Allow-Origin. Ondersteund mijn server het dan niet of is er iets anders aan de hand?

**Mathijs Kingma** · 10-06-2011, 13:15

ik heb er xuveo.nl/rva/systeem.. van gemaakt en nu werkt hij wel.. Super bedankt!

Data ophalen met ajax