Apply a function from a called JavaScript file to a PHP echo

Question

I've downloaded the JS To Title Case to apply to my site. It capitalizes a text string like a newspaper do. I'm calling it at the beginning of the PHP file:

<script src="../../js/to-title-case.js"></script>

And I want to add .toTitleCase() to this string, so it applies the JS to the title:

<?php echo get_inspiry_custom_excerpt( get_the_title(), 7 ); ?>

That PHP is part of:

<h4 class="entry-title"><a href="<?php the_permalink(); ?>" rel="bookmark"><?php echo get_inspiry_custom_excerpt( get_the_title(), 7 ); ?></a></h4>

However, wherever I add it, the page breaks and doesn't load.

How can I do this?

show how you added it... you cannot call PHP functions from JS, and PHP cannot call JS functions (directly). — Marc B, Jul 26 '16 at 15:11
The JS creator says "Just include the JS and add .toTitleCase() to the string you want converted." So I added it like this: — alxh28, Jul 26 '16 at 15:12

score 0 · Answer 1 · edited May 23 '17 at 12:32

What Marc B probably meant in the comments: If this is no hybrid of nodejs+php then you're mixing things the wrong way.

PHP is executed on server side and creates the HTML page in your case. This Page and referenced JavaScript is then loaded client side in the browser. The "toTitleCase()" Method is simply not in the scope of PHPs execution environment and the Authors "... the string ..." refers to JavaScript Strings and not PHP Strings.

The page those "doesn't load" because of PHP errors (which may not be shown if you don't have error reporting set).

One Way to solve your Problem is to generate JS code via PHP which will be executed on client side loading. It should look like that, assuming get_inspiry_custom_excerpt and get_the_title are real PHP functions:

<h4 class="entry-title">
  <a href="<?php the_permalink(); ?>" rel="bookmark" id="custom_excerpt">
    <?php echo get_inspiry_custom_excerpt( get_the_title(), 7 ); ?>
  </a>
</h4>
<script>
  var element = document.getElementById('custom_excerpt');
  var text = element.innerText || element.textContent || '';
  element.innerHTML = text.toTitleCase();
</script>

JS borrowed from another SO Entry.

This may be far from ideal but should show how it can be done.

Thank you Maka! I'm learning PHP and JS and I still get confused. — alxh28, Jul 30 '16 at 21:33

Apply a function from a called JavaScript file to a PHP echo

1 Answers1