jquery repeater taking last data record when added - php

Question

using for each loop I have to retrieve data however when adding new record data-repeater-create is taking default value as the last record of data even the element id is different.
<div data-repeater-list="car">
<?php foreach ($user_portfolio as $p_details) {
$p_title = $p_details['portfolio_title'];
$p_desc=$p_details['portfolio_desc'];
$p_expert = $p_details['portfolio_expert_id'];
$p_id = $p_details['portfolio_id'];
?>
<div data-repeater-item>
<div class="form row">
<div class="form-group mb-1 col-sm-12 col-md-12">
<label for="email-addr">Title</label>
<br>
<input type="text" name="port_id" value="<?php if(!empty($p_id)) {echo $p_id; } else { echo "";}?>">
<input type="text" class="form-control" id="portfolio_title<?php echo $p_id;?>" placeholder="Title " name="portfolio_title" value="<?php if(!empty($p_title)) {echo $p_title;} else {echo ""; }?>">
</div>```
below using data-repeater-create i am adding empty field however its taking last record as default value and I able to see in view source
``` <?php } //end of foreach?>
</div>
<div class="form-group overflow-hidden">
<div class="col-12">
<button data-repeater-create class="btn btn-theme" type="button">
<i class="ft-plus"></i> Add
</button>
<button type="submit" class="btn btn-theme">
<i class="la la-check-square-o"></i> Save
</button>
</div>
</div>
</form>```