Home Forums ACF PRO Using ACF fields in Javascript


Using ACF fields in Javascript

  • Hi,

    I try to use ACF in combination with JS. I have a timer on our website and I want it to be editable in the WordPress Dashboard and not only in the code.

    If this was just PHP I knew how to do it, but I am kinda new to JS so I need some guidance.

    This is what I want to accomplish (example: based on how it can be done in PHP).

    <script type=”text/javascript”>
    // Here should come the fields like get_sub_field but then for JS..
    // var Date-Y = get_sub_field(‘date-year’);
    // var Date-m = get_sub_field(‘date-month’);
    // var Date-d = get_sub_field(‘date-day’);
    // var Date-h = get_sub_field(‘date-hour’);
    // So I can link for example ‘date-year’ in the dashboard in custom fields to be in the
    // page where the timer is and edit the year in the dashboard.
    // But I think this is not the right way of coding it

    // Then link the variables to the places where I want them to be. It’s about the variable
    // eventDate.
    function countdown(){
    var eventDate = new Date(2019, 10, 7, 15);
    // So instead of
    // 2019: Date-Y
    // 10: Date-m
    // 7: Date-d
    // 15: Date-h
    // And then I can add these in WordPress dashboard as Advanced custom fields — linking
    // them to the right variable, so that I can edit the date within WordPress itself and
    // not in the code

    I hope my issue is clear and someone is able to explain how I do this in JS.

    Thanks in advance!

  • Variable names cannot contain -, use DateY or Date_Y etc.

    If your values need to be strings then you need to enclose them in quotes and you need to put php tags around them and echo them

    var DateY = '<?php echo get_sub_field('date-year'); ?>';
  • Thank you! It works now

  • Hi Ronald, any chance you’d be able to share your full solution? I’m having a bit of trouble creating this myself and could really use some help. Please and thank you 🙂

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Using ACF fields in Javascript’ is closed to new replies.