java script source code

Hello, I have an asp.net core project, and I need help with a java script code.

- I have a table to which I pass a list of statements from the controller.
- a button that reads me the sentence in the corresponding row from the "read" function.
- a button to read, compare and record what is said in the sentence from the "voiceWrite" function.

I need the following code in JavaScript:
1. Correct the "read" function, it does not work on iPhone.
2. When the btnSpeak button is pressed:
- What is dictated is displayed in a pop-up window.
- Compare with the sentence, of the row where the button was located.
- I created a variable to pass to the controller with Ajax, so I can pass it to the database.

HTML
@if (ViewBag.modelData is not null)
{
<table id="dt_sentences" class="uk-table" cellspacing="0" width="100%">
<thead>
<tr>
<th>Sentences</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Sentences</th>
</tr>
</tfoot>
<tbody>
@foreach (var item2 in ViewBag.modelData)
{
<tr>
<td>
@item2.Sentences
<button onclick="read()" value="@item2.Sentences" id="btnRead" class="btnRead"> <span class="material-symbols-outlined">play_arrow</span></button>
<button onclick="voiceWrite()" value="@item2.Sentences" id="btnSpeak" class="btnSpeak"> <span class="material-symbols-outlined">mic</span> speak</button>
</td>
</tr>
}
</tbody>
</table>
}

JAVASCRIPT
@section Scripts
{
<script language="JavaScript">
const read = () =>
{
var txt = $(document.activeElement).val();
var u = new SpeechSynthesisUtterance();
u.lang = "en-US";
u.volume = 1;
u.rate = 1;
u.pitch = 4;
u.text = txt || 'can not be reader';
speechSynthesis.speak(u);
}
</script>


//It doesn't work like I want.
<script language="JavaScript">
function voiceWrite()
{
const elNavegadorEsCompatible = () =>
{
if (navigator.userAgent.indexOf("Chrome") ||
navigator.userAgent.indexOf("Edge") ||
navigator.userAgent.indexOf("Safari")) return true;
alert('The Browser does not support Voice Recognition');
return false;
}
if (elNavegadorEsCompatible())
{
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition || window.mozSpeechRecognition || window.msSpeechRecognition)();
recognition.lang = "en-US";
recognition.onend = event => { recognition.start(); };
recognition.onresult = resultado => { manejarResultado(resultado); };
/* 2.5 */
recognition.start();

const manejarResultado = resultado =>
{
var dataId = $(document.activeElement).val();
var dataspeak = resultado.results[0][0].transcript;

if (dataId == dataspeak)
{
alert("Excelent");

}
else
{
alert("wrong, you said: " + dataspeak);
}
}
recognition.stop();
}
}
</script>

}