I have a pre Element with id output and try to append multiple elements to it
<pre id="output"></pre>
Now in my PHP Code i run a for loop which simply outputs the counter variable (for the purpose of this example).
<?php
for ($i = 0; $i < 100; $i = $i + 1)
{
echo $i;
}
What is the best way to append these values to the pre element with id output by using PHP?
EDIT: I search for a solution which works if the for loop is not inside the pre tags. It should work no mather where in the code i call the for loop e.g. below the <pre> tags or above the <pre> tags, both should work.
Is this possible with PHP only?
I have a pre Element with id output and try to append multiple elements to it
<pre id="output"></pre>
Now in my PHP Code i run a for loop which simply outputs the counter variable (for the purpose of this example).
<?php
for ($i = 0; $i < 100; $i = $i + 1)
{
echo $i;
}
What is the best way to append these values to the pre element with id output by using PHP?
EDIT: I search for a solution which works if the for loop is not inside the pre tags. It should work no mather where in the code i call the for loop e.g. below the <pre> tags or above the <pre> tags, both should work.
Is this possible with PHP only?
Share Improve this question edited Mar 9, 2016 at 9:32 Black asked Mar 9, 2016 at 8:45 BlackBlack 20.5k46 gold badges188 silver badges296 bronze badges 1-
1
you can append with
jquerylike$('#output').append("<div></div>");– Pedram Commented Mar 9, 2016 at 8:48
4 Answers
Reset to default 3Since the php is rendered on page load, you don't need to append it - just have it in the div and echo it into output directly
<pre id="output">
<?php
$numbers=range (1,100);
foreach ($numbers as $number) {
echo "$number <br/>";
}
?>
</pre>
Not entirely sure if you want to use PHP to append stuff to it, or javascript. Considering your use of tags in this question
But for PHP you should do it at render time like this:
<?php
$output = '';
for ($i = 0; $i < 100; $i++) {
$output .= '<div>' . $i . '</div>';
}
?>
<pre id="output"><?=$output?></pre>
In javascript you can use getElementById()
var output = document.getElementById('output');
for(var i = 0; i < 100; i++) {
output.appendChild(document.createElement('div'));
}
Here's a version that does appends the numbers to the #output, with the php outside of that div as requested by the OP. Still happens at runtime, but this time creates a string and then appends it to the <pre> element as requested. I prefer the first one that I did though, with the php inside the element, unless there is a definitive reason for not using it, I would suggest hat one first.
<pre id="output"></pre>
<?php
$numbers=range (1,100);
$str="";
foreach ($numbers as $number) {
$str .= $number . "<br/>";
}
echo "<script>$('#output').append('$str')</script>";
?>
<?php ob_start(); ?>
<html>
<head></head>
<body>
<pre id="output">###MARK_PRE###</pre>
</body>
</html>
<?php
$html = ob_get_contents();
ob_end_clean();
$loop_result = "";
$arr = ['apple', 'orange', 'bananas'];
foreach($arr as $value)
{
$loop_result .= "$value <br/>\n";
}
$html = trim(str_replace('###MARK_PRE###', $loop_result, $html));
echo $html;
This does the job. It works as you can see no matter if you place the for loop below or above your html.
If it is enough to have the loop above the html it gets much simpler. You should stick to the answer of PierreDuc in this case.
IF you really want to place the html above your php code, then you actually should better use a MVC-Framework like symfony.
I told you the quick and dirty way above.
I just want to note in the end that I actully don't see any reason of placing your php-logic above your html. Since only your html depends on the php and not the other way around what precise advantage do you promise yourself from placing the html above the php?
One last option: It would be even better if you separated your html and php-code entirely and use include. You would end up with two files:
template.html.php:
<html>
<head></head>
<body>
<pre id="output"><?= $pre_tag; ?></pre>
</body>
</html>
logic.php:
$arr = ['apple', 'orange', 'bananas'];
foreach($arr as $value)
{
$pre_tag.= "$value <br/>\n";
}
include('template.html.php');
But the clean and solid solution is to use a MVC-Framework.