Search code examples
phpelm

Is there a way accesses a element outside of the elm page

A while back I found a PHP CMS and Template system while looking through some old code. I was wondering if there was a way to use elm code instead of PHP as a template. I had the idea of making an HTML div that had the content and use elm to take the data out of the div and into the app

I had no idea what to try as Google and StackOverflow had nothing that helped.

The template system is fairly simple as I was just going to swap it out for 

   <body>
     <div>
       <?php foreach ( $posts_array as $post ) : ?>
           <div>
               <h1><?php echo $post->page_title; ?></h1>
               <p><?php echo $post->page_content; ?></p>
           </div>
       <?php endforeach; ?>
     </div>
          <!-- Elm Here -->    
   </body>
Solution

  • If I'm understanding correctly, you'd need to convert the php data to JSON and then import the JSON data into your elm app via flags:

    <?php $flags = htmlspecialchars(json_encode($posts_array), ENT_QUOTES, "UTF-8"); ?>
<div id="elm" data-flags="<?php echo $flags; ?>"></div>
<!-- Load elm js file here -->
<script>
    var node = document.getElementById("elm");

    var app = Elm.Main.init({
        node: node,
        flags: JSON.parse(node.dataset.flags)
    });
</script>