Convert PHP variable to JQuery

Question

Im trying to update the src from the audio tag if i click on a button. So i need to translate the $muziek variable to Jquery

View:

<?php
    foreach ($muziek as $ms)
    {
        if ($ms->id == 2) {
            echo '<audio id="player" controls src="data:audio/mpeg;base64,' . base64_encode($ms->audio) . '">';
            echo '</audio>';
        }
    }

    foreach ($muziek as $ms)
    {
        echo '<br>';
        echo '<input id="'.$ms->id.'" type="button" value="' . $ms->naam . '" class = "btn btn-login login-formcontrol"/>';
    }
?>
</div>

<script>
    $("input").click(function () {
       var test = $(this).attr("id");
       console.log(test);
       //Here needs to be the foreach muziek       
    });
</script>

Muziek variable: This is how i fill the music variable

function getAllMuziek()
{
    $query = $this->db->get('muziek');
    $muziek = $query->result();

    return $muziek;
}

Does someone has an idea or show me how this can be done?

Answer 1

I spent sometime trying to figure out what you want and from what i understood you want to return an array of all muzieks returned to your js to do whatever you wanna do with it, which you can simply get with a simple ajax request:

$.get( "base_url/your_controller/getAllMuziek" )
    .done(function( muziek ) {
        //Here needs to be the foreach muziek     
        $.each(muziek, function( index, value ) {
            // whatever
        });
    });

with a simple modification to your method getAllMuziek:

function getAllMuziek()
{
    $query = $this->db->get('muziek');
    $muziek = $query->result();

    header('Content-Type: application/json');
    echo json_encode($muziek);
}

now when you make you ajax call you will get your result.

Answer 2

Convert $muziek into javascript array using json_encode

<script>
var myArray = <?php echo json_encode($muziek); ?>;
</script>