JavaScript change event issue in calculating new date with deadline

Question

I have a page in Laravel that includes a start date, a deadline, and an end date. I aim to calculate and display the final date when I input the number of days (deadline). I've utilized Laravel Collective for the controls.

Start date:

{!! Form::text('StartDate', jdate($task->StartDate)->format('Y-m-d'), ['class'=>'myform-control']) !!}

Deadline:

{!! Form::text('Deadline', null, ['class'=>'myform-control','style'=>'width:50px;']) !!}
<script>
$('#Deadline').change(function() {
    const dval = parseInt($('#Deadline').val());
    const StartDate = document.getElementById("StartDate").value;
    const startdateToEnglish = StartDate.toEnglishDigit();
    const startdateToEngArray = startdateToEnglish.split('-').map(Number);
    var inputF = document.getElementById("EndDate"); 
    var edate = new persianDate(startdateToEngArray).add('days', dval).format('YYYY-MM-DD');
    console.log(startdateToEngArray, dval, edate);
    inputF.value = edate; 
});  
</script>

End date:

{!! Form::text('EndDate', jdate($task->EndDate)->format('Y-m-d'), ['class'=>'myform-control observer-example','style'=>'width:180px;','old'=>'EndDate']) !!}

I've implemented this template for both the store and edit blades. The event handler works in the store blade, but the edit blade adds a month to the date and the day.

If I input the value 6 in the deadline, the final date will be one month and six days later. I'm puzzled because the conditions are identical, and I've copied the codes related to the editing blade from the store blade. The values displayed in the console are the same except for the end date.