ForLoop echo placed in wrong area - php

Question

<div class="row">
<div class="col-md-12">
<div class="box">
<div class="box-header">
<h3 class="box-title">Call Dialog</h3>
</div>
<!-- /.box-header -->
<div class="box-body table-responsive no-padding">
<table class="table table-hover">
<tbody>
<tr>
<th>#</th>
<th>Callers</th>
<th>Expiration</th>
</tr>
<?php
$calls = array();
for ($i = 0; $i < 10; $i++) {
$template = "
<tr>
<td>". $i ."</td>
</tr>
";
echo $template;
}
?>
</tbody>
</table>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
So the above code produces the following output:
Whenever I edit the code to add $i + 1 so that the end output is going to be a 10 what happens is the code breaks and the output is given:
This is the very first time I've ever encountered this problem. If you could figure out what I did wrong or somehow what is wrong with either my html, way of printing, etc. please do let me know. If you have any questions regarding the problem or is confused about something I'll do my best to clarify.

Answer 1

The error happens because you are summing the concatenation of 1 and whatever is after.
Very shortly, this is what you are doing:
echo 'a string' . $i + 1 . 'another string';
This will be the same as:
echo 0 + 1;
(Strings that don't start with a number will automatically be converted to 0. All other strings will be truncated to a number. '9a' will be converted to 9 before summing it while 'a9' will be 0)
How to solve this:
Use parenthesis:
Surround the operation in parenthesys will avoid it being concatenated.
A basic example:
echo 'Your string has ' . ($length + 1) . ' characters';
Use comas instead of concatenation:
This will avoid any problems and will very slightly speed your code.
This is a known micro-optimization.
Using the basic example:
echo 'Your string has ', $length + 1, ' characters';
Use whichever solution works best for you.

Answer 2

Please separate php and html. It's easy and will save a lot of time for you. It's working fine
<?php
$calls = array();
for ($i = 0; $i < 10; $i++) {
?>
<tr>
<td><?=$i+1 ?></td>
</tr>
<?php
}
?>