Passing A Variable to Audio Player

I am doing an HTTP post call to a database to pull information to load an audio player.

I am successful getting a JSON string with the desired details.

What I'm having trouble with is passing one of the JSON variables to the audio player as the source.

Here's a bit of code that shows what I'm trying to do.

<h1>{dir.dv_talent}</h1>
<h2>{{total_time}}</h2>

<audio id="player" my-audio>
    <source src="/radio/{{dir.dv_file}}.ogg" type="audio/ogg" />
    <source src="/radio/{{dir.dv_file}}.mp3" type="audio/mpeg" />
</audio>

Open in new window


So what works is the <h1> tag that displays the Talent Name and the <h2>Tag that gives the total time.  I also know there is valid data for dir.dv_file but when I inspect the code, it shows it as {{dir.dv_file}}.

So what that indicates to me is that the {{dir.dv_file}} is not converted to the passed variable inside of the <audio> tag.

So my question is how do I get that variable to be passed within that <audio> tag.
Paul KonstanskiProject SpecialistAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

David FavorLinux/LXD/WordPress/Hosting SavantCommented:
Try adding this to your code.

<h2>{{dir.dv_file}}</h2>

Open in new window


Your code fragment is to small to guess at how it might work.

If a client hired me for something like this, I'd convert all the variables you're using... which look like maybe HAML... Unsure...

Anyway, I'd convert all these {{varname}} to Javascript variables, so I could inspect them + see their exact value.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Paul KonstanskiProject SpecialistAuthor Commented:
Thanks for the insight. I had done some testing with variables like that outside of the <audio> tag and they worked fine. I also read something elsewhere that mentioned that they may not carry over into the <audio> section. I came up with another work around for now using PHP (which I know is cheating but for now it works fine.)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Databases

From novice to tech pro — start learning today.