Hoi,
Ik ben hier al eerder mee bezig geweest, maar het is niet gelukt om dat aan de praat te krijgen.
Na verder zoeken op internet kwam ik dit script tegen die zou moeten doen wat ik nodig heb, maar het werkt niet.

Wat ik dus wil is de waarde van het listmenu wijzigen in de database zonder dat de pagina opnieuw geladen wordt.

Wie wil me helpen om dit werkend te krijgen, ik zou er erg mee geholpen zijn.


<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>

    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">

        $(document).ready(function() {
            
			var selectValue = $('#selectBoxID').val();

            // post to php script
            $.ajax({
                type: 'POST',
                url: 'insertdetailed.php',
                data: { selectValueBox: selectValue }
            });
        });

    </script>
</head>
<body>
	<form id="update_db" name="update_db" method="post">
    	<select id="selectBoxID" onselect="saveToDatabase()">
       		<option value="1">Value 1</option>
       		<option value="2">Value 2</option>
    	</select>
		<input type="hidden" name="id" id="1">
	</form>
</body>
</html>



<?php
if(isset($_POST['selectValueBox'])){

$connectie = new mysqli("localhost", "xxxxxx", "xxxxxx", "xxxxxx");

// update de score
$sql_update = "UPDATE obs_scores SET score = '".$_POST['selectValueBox']."' WHERE id= '".$_POST['id']."'";

if (mysqli_query($connectie, $sql_update)) {
echo 'SUCCESS';
print $sql_update;
} else {
echo 'FAILED';
print $sql_update;
}
}
?>
Als in regel 12-13 'resp' het #hexnummer of de naam van de kleur bevat, dan in regel 29 dit gebruiken :

document.getElementById("demo").style.backgroundColor = score;

insertdetailed.php dient de score terug te geven want de success-callback functie maakt hier gebruik van.
En wat moet ik dan nog in de insertdetailed.php erbij zetten?

Trouwens (document.getElementById("demo").style.backgroundColor = score;) hoe zet ik die waarde dan in de td?
Ik begrijp het even niet.
Je geeft elke <td> een id van 1-3

De 'id' weet je, omdat je die naar de server stuurt.

De kleur echo je in insertdetailed.php zoals eerder vermeld en ontvang je in 'resp';

In regel 13 stuur je 'id' en 'resp' mee :

success:function(resp) {
	getColor ( id, resp);
}


Vervang regel 28-30 door dit :

function getColor (id, score) {
    document.getElementById( id ).style.backgroundColor =  score ;
}


De vraag werd trouwens al in een eerder topic van je behandeld.

De regelnummers verwijzen naar deze lap code :

https://www.phphulp.nl/php/forum/topic/waarde-listmenu-in-database-vervangen/102903/2/#743702
Ik heb de wijzigingen aangebracht en in de insertdetailed.php heb ik echo $_POST['resp']; toegevoegd.
Maar de kleur veranderd niet. Ik begrijp ook niet hoe de $_POST['resp']; de bgcolor="echo $bgcolor;>" kan aanpassen.
Als je een AJAX-call doet via JavaScript (dus dat $.post() gedoe) is dat een verzoek terug aan de webserver. Dit levert ook een resultaat (response, output) op die opgevangen wordt als je AJAX-call compleet is. Het resultaat daarvan is beschikbaar via de success-functie binnen de AJAX-call. Dit is een zgn. callback-functie, wanneer het verzoek is verwerkt wordt een seintje teruggegeven.

Je kunt dus een PHP-script aanroepen via JavaScript zodat je deze (client side) kunt voeden met (server side) informatie zonder de pagina te verversen. Dat is min of meer het hele idee van het gebruik van deze constructie.

In de callback (in het success blok) is het dus de bedoeling dat je de achtergrondkleur instelt. Dit doe je weer met de hulpfunctie getColor().

Je kunt natuurlijk ook tussentijds deze boel debuggen met alerts, of wellicht nog beter, met console.log() zodat je informatie kunt dumpen in de netwerk (ontwikkel)tab van je browser.
Oke dat begrijp ik maar moet ik dan niet de
bgcolor="<?php echo $bgcolor; ?>
in de td vervangen door $_POST['resp']; indien die gezet is?
Ja, maar je kunt niet on-the-fly aan de client zijde PHP uitvoeren he :), dit doe je door terug te communiceren via JavaScript, via de hierboven beschreven wijze. Met die "...backgroundColor = ..." riedel zou je dat dus moeten doen, of je gebruikt een class waarin die bgcolors zijn opgenomen.

Begrijp je hoe de communicatie tussen webpagina (client) en het PHP-verwerk-script (server) loopt met behulp van JavaScript?

Het PHP-script geeft informatie terug aan de JavaScript-success-callback-functie. Die informatie, afkomstig uit dat PHP-script, gebruik je vervolgens in de JavaScript om de achtergrondkleur in te stellen.
Ik begrijp wel ongeveer hoe het in zijn werk gaat. Alleen hoe die resp aan de kleur komt is mij vaag omdat er van de tabelcolor array verder geen gebruik meer wordt gemaakt. Dus hoe kan die dan de juiste kleur aanmaken. Ik denk dat dit voor mij te ver gaat qwa programmeren.

Reageren