Implement Text to speech in ASP.Net GridView using jQuery

Hi makumbi,

Please refer below Sample.

SQL

CREATE TABLE [TextToSpeech]
(
	[Term] VARCHAR(MAX)
)

INSERT INTO [TextToSpeech] VALUES('Iam Going To School')
INSERT INTO [TextToSpeech] VALUES('Makumbi Please Come In')
INSERT INTO [TextToSpeech] VALUES('Namakula Come and See the Doctor in Room Number 5')

HTML 

<asp:GridView ID="gvDetails" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="Details">
            <ItemTemplate>
                <asp:Label ID="lblterm" runat="server" Text='<%#Eval("Term") %>'></asp:Label>
                <asp:LinkButton ID="LinkButton1" runat="server" CssClass="voice"><i class="fa fa-volume-down"></i></asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript"> $(function () { if (!('speechSynthesis' in window)) { alert("You don't have speechSynthesis"); } $('[id*=LinkButton1]').on('click', function () { var term = $(this).closest('div').find('[id*=lblterm]').html(); var voices = window.speechSynthesis.getVoices(); var speech = new SpeechSynthesisUtterance(); speech.voice = voices[2]; speech.rate = 1; speech.pitch = 1; speech.text = term; speechSynthesis.speak(speech); return false; }); }); </script>

Namespaces

C#

using System.Data;
using System.Data.SqlClient;
using System.Configuration;

VB.Net

Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration

Code

C#

protected void Page_Load(object sender, System.EventArgs e)
{
    if (!this.IsPostBack)
    {
        string conString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
        using (SqlConnection con = new SqlConnection(conString))
        {
            using (SqlCommand cmd = new SqlCommand("SELECT Term FROM TextToSpeech", con))
            {
                using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
                {
                    using (DataTable dt = new DataTable())
                    {
                        sda.Fill(dt);
                        gvDetails.DataSource = dt;
                        gvDetails.DataBind();
                    }
                }
            }
        }
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim conString As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
        Using con As SqlConnection = New SqlConnection(conString)
            Using cmd As SqlCommand = New SqlCommand("SELECT Term FROM TextToSpeech", con)
                Using sda As SqlDataAdapter = New SqlDataAdapter(cmd)
                    Using dt As DataTable = New DataTable()
                        sda.Fill(dt)
                        gvDetails.DataSource = dt
                        gvDetails.DataBind()
                    End Using
                End Using
            End Using
        End Using
    End If
End Sub

Screenshot