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;
}
}
?>
Sietsko Bos op 23/04/2019 15:38:57

Jelle DNW

Dat werkt inderdaad.
Heb je ook nog een oplossing om de id mee te sturen?


Dat is het tweede deel van die $.post(). Je moet in je script even kijken wat je daar binnenkrijgt.
Zoals @Adoptive al (meermalen) aangaf:
Het input-veld "id" bevat geen [color=#ff0000]value[/color]-attribuut.
<input type="hidden" name="id" id="1"> <-- value="???" ontbreekt

<form id="update_db" name="update_db" method="post">
        <select id="selectBoxID">
               <option value="1">Value 1</option>
               <option value="2">Value 2</option>
        </select>
        <input type="hidden" name="id" value="1" id="mijnID">
    </form>



<script>
$(document).ready(function() {
    $('#selectBoxID').change(function() {
        const selectValue = $(this).val();
        const id = $('#mijnID').val();

        // post to php script
        $.post('insertdetailed.php', { selectValueBox: selectValue, id: id });
    });
});
<script>
Dat werkt helemaal zoals ik het wilde Jelle DNW
Dank voor de code want hier kwam ik niet uit.

De anderen ook dank voor de hulp.
Geen probleem. Neem zeker ook de tijd om te kijken wat er miste in jouw code en waarom het bovenstaande wél werkt, zo leer je het best. Veel succes.
Jelle Dnw
Was ik al mee bezig, ik ben niet zo goed met javascript maar hier heb ik veel aan.
Dank nogmaals :)

[size=xsmall]Toevoeging op 24/04/2019 08:00:39:[/size]

Jelle Dnw

Hoe zit het trouwens met meerdere listmenu's, als ik bijvoorbeeld 2 heb dan werkt het alleen bij de eerste.
Het tweede listmenu werkt dan niet, is hier ook een truukje voor zodat ik 2 of zelfs 20 op 1 pagina kan gebruiken?
Niet met id's werken, maar met classes. Er valt ook iets voor te zeggen om de formulieren gewoon te submitten, en form submits af te vangen. Je hoeft ook niet expliciet alle individuele waarden door te geven, je kunt ook simpelweg alle formulier-data in één keer seraliseren met serialize().

Deze aanpak heeft ten minste twee voordelen: deze is schaalbaar, je kunt zoveel formulieren aanmaken als je wilt. Daarnaast hoef je als je van serialize() gebruik maakt enkel de formuliervelden toe te voegen die dan meteen opgepikt worden vanwege serialize(). Ook mag er variatie zijn in de samenstelling van de velden tussen de verschillende formulieren.
De id's heb ik nodig om te weten welke rij ik moet wijzigen in de database. Kun je me dan ook vertellen hoe de code er dan uit komt te zien want ik zou niet weten hoe dat te maken.
Volgens mij is er spraakverwarring omtrent het 'id'. Thomas doelt op het id-argument in een HTML-element, en niet op een databaseopzet.

In HTML is een ID uniek en mag deze maar een enkele keer gebruikt worden, en een class meerdere keren.
Dit moet werken.


<form method="post">
        <select class="ajax-select-save" data-target-id="1">
               <option value="1">Value 1</option>
               <option value="2">Value 2</option>
        </select>        
        <select class="ajax-select-save" data-target-id="2">
               <option value="1">Value 1</option>
               <option value="2">Value 2</option>
        </select>     
        <select class="ajax-select-save" data-target-id="3">
               <option value="1">Value 1</option>
               <option value="2">Value 2</option>
        </select>
    </form>



<script>
$(document).ready(function() {
    $('.ajax-select-save').change(function() {
        const value = $(this).val();
        const id = $(this).data('target-id');

        // post to php script
        $.post('insertdetailed.php', { value: value, id: id });
    });
});
<script>

Reageren