{"id":2463,"date":"2011-03-11T13:47:18","date_gmt":"2011-03-11T20:47:18","guid":{"rendered":"http:\/\/www.ait-pro.com\/aitpro-blog\/?p=2463"},"modified":"2011-03-20T13:04:54","modified_gmt":"2011-03-20T20:04:54","slug":"php-how-to-display-html-code-in-a-form-display-html-code-instead-of-output","status":"publish","type":"post","link":"https:\/\/www.ait-pro.com\/aitpro-blog\/2463\/misc-projects\/website-design-tips-tricks-and-fixes\/php-how-to-display-html-code-in-a-form-display-html-code-instead-of-output\/","title":{"rendered":"PHP How to Display HTML Code in a Form &#8211; Display HTML code instead of output"},"content":{"rendered":"<p>To display\u00a0HTML code in a form instead of processing or outputting the\u00a0HTML code, or to be more technically\u00a0correct the\u00a0HTML special characters, you would use the PHP htmlspecialchars( ) string function.\u00a0 If you\u00a0want to display all \u00a0HTML character entities then y0u would use the htmlentities( ) string function instead<\/p>\n<h2>How to display\u00a0HTML code in a form and not process or output the\u00a0HTML code:<\/h2>\n<p>In this form example the form has a text field where YouTube embed code is allowed to be entered to display a YouTube video in a directory listing submission.\u00a0 The\u00a0HTML code needs to be displayed instead of allowing PHP to process the\u00a0HTML code becaue the submit form is re-editable.\u00a0 What happens if you don&#8217;t display the actual\u00a0HTML code instead of allowing the code to be processed or ouputted is that the YouTube embed code will display the video in the submit form if a\u00a0person is re-editing their directory listing submission.\u00a0\u00a0So the goal is to have the actual YouTube HTML embed code be displayed instead of allowing the\u00a0HTML code to be processed or outputted and display the actual Youtube video on re-edit of the submit form.\u00a0 This is a very simple thing to accomplish using the PHP\u00a0htmlspecialchars( ) string function.<\/p>\n<p><strong>Example:<\/strong><\/p>\n<pre>\u00a0 \u00a0if(isset($_POST['action']) &amp;&amp; !isset($data) ){ echo $_POST['Dir']['youtube_url_55'];\r\n} elseif (isset($data)){ echo <span style=\"background-color: #ffff00;\">htmlspecialchars<\/span>($data['youtube_url_55'][0]); } ?&gt;\" \/&gt;<\/pre>\n<p>So basically what is happening above is that the form is being checked to see if\u00a0the post action is selected and if there is data entered into\u00a0the text field (that portion of the form code that contains the actual text field code is not displayed in this example) and if no data is entered yet then the YouTube embed code that the form submitter enters into the text field will be echoed when the form script is processed.\u00a0 Then the elseif will check to see if data already exists and if it does it will echo that data that already exists.\u00a0 So here is where htmlspecialchars is important because if the user is re-editing the form and htmlspecialchars is not used then the form will display the actual YouTube video not the actual YouTube HTML embed code, which is what you want for a number of reasons.\u00a0 One really obvious one would be if they wanted to change the size dimensions of the YouTube video displayed in the directory listing.\u00a0 They could simple just edit the HTML code and change those dimensions without having to edit the YouTube HTML embed code outside of the form and then have to copy and paste that HTML code to the form again.\u00a0<\/p>\n<p><strong>The\u00a0HTML code is displayed in the submission form on re-edit.\u00a0 If the htmlspecialchars string function was not used here the user would see the actual YouTube video embedded into the form.<\/strong><\/p>\n<p><strong>Click Image to Enlarge<\/strong><br \/>\n<a href=\"http:\/\/www.ait-pro.com\/aitpro-blog\/wp-content\/uploads\/2011\/03\/html-code-displayed-in-submit-form.png\" rel=\"lightbox[2463]\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-2464\" title=\"PHP Display html Code in Form not Output\" src=\"http:\/\/www.ait-pro.com\/aitpro-blog\/wp-content\/uploads\/2011\/03\/html-code-displayed-in-submit-form-300x266.png\" alt=\"PHP Display html Code in Form not Output\" width=\"300\" height=\"266\" srcset=\"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-content\/uploads\/2011\/03\/html-code-displayed-in-submit-form-300x266.png 300w, https:\/\/www.ait-pro.com\/aitpro-blog\/wp-content\/uploads\/2011\/03\/html-code-displayed-in-submit-form.png 720w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p><br class=\"spacer_\" \/><\/p>\n<p><strong>PHP code Reference Link<\/strong><br \/>\n<span class=\"bluelink\"><a title=\"PHP htmlspecialchars string function\" rel=\"nofollow\" href=\"http:\/\/www.php.net\/manual\/en\/function.htmlspecialchars.php\" target=\"_blank\">PHP htmlspecialchars string function<\/a><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>To display\u00a0HTML code in a form instead of processing or outputting the\u00a0HTML code, or to be more technically\u00a0correct the\u00a0HTML special characters, you would use the PHP htmlspecialchars( ) string function.\u00a0 If you\u00a0want to display all \u00a0HTML character entities then y0u would use the htmlentities( ) string function instead How to display\u00a0HTML code in a form [&hellip;]<\/p>\n","protected":false},"author":167,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[317],"tags":[352,353,351],"class_list":["post-2463","post","type-post","status-publish","format-standard","hentry","category-website-design-tips-tricks-and-fixes","tag-php-display-code-in-form","tag-php-display-code-not-output","tag-php-display-html-in-form"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/posts\/2463","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/users\/167"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/comments?post=2463"}],"version-history":[{"count":0,"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/posts\/2463\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/media?parent=2463"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/categories?post=2463"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ait-pro.com\/aitpro-blog\/wp-json\/wp\/v2\/tags?post=2463"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}