How to add hindi or englist text in textbox.when want to add hindi text can type text in hindi, when want to type in english ,can type in english
Download FREE API for Word, Excel and PDF in ASP.Net:
Download
Here i have created one example. You need to change the code as per your requirement.
For typing in hindi you need to download the font from the link below.
https://www.ffonts.net/Kruti-Dev-010.font.download
Then copy the font in the project folder to use the font in your code.
HTML
<div>
<table id="rblLanguage">
<tr>
<td>
<input id="rblLanguage_0" type="radio" name="rblLanguage" value="English" /><label
for="rblLanguage_0">English</label>
</td>
</tr>
<tr>
<td>
<input id="rblLanguage_1" type="radio" name="rblLanguage" value="Hindi" /><label
for="rblLanguage_1">Hindi</label>
</td>
</tr>
</table>
<textarea name="txtText" id="txtText" rows="5"></textarea>
</div>
<style type="text/css">
@font-face
{
/* Font Name to use*/
font-family: 'HindiFont';
/* Font path*/
src: url('<%= ResolveUrl("~/k010.ttf") %>');
}
body
{
font-size: 20px;
}
.hindiFont
{
/* Assign the font*/
font-family: 'HindiFont';
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('[id*=rblLanguage]').on("change", function () {
var selected = $(this).find('input:checked').val();
var textBox = $('[id*=txtText]');
if (selected == "Hindi") {
$(textBox).attr('class', 'hindiFont');
}
else {
$(textBox).attr('class', '');
}
});
});
</script>
Screenshot
<style type="text/css">
@@font-face {
/* Font Name to use*/
font-family: 'HindiFont';
font-size: large;
src: url("../../k010.TTF")format('truetype');
}
body {
font-size: 20px;
}
.hindiFont {
/* Assign the font*/
font-family: 'HindiFont';
/*here we need to access @@font-face also*/
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
debugger;
$('[id*=rblLanguage]').on("change", function () {
var selected = $(this).find('input:checked').val();
var textBox = $('[id*=Description]');
if (selected == "Hindi") {
$(textBox).attr('class', 'hindiFont');
}
else {
$(textBox).attr('class', '');
}
});
});
</script>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="content-wrapper">
<section class="content-header">
<h1>
Edit News
<small>@*Preview*@</small>
</h1>
<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> Admin</a></li>
<li class="active">Edit News</li>
</ol>
</section>
<section class="content">
<div class="box box-default">
<div class="box-body">
<div class="row">
<div class="form-horizontal">
<h4></h4>
<hr />
<div>
<table id="rblLanguage">
<tr>
<td>
<input id="rblLanguage_0" type="radio" name="rblLanguage" value="English" /><label for="rblLanguage_0">English</label>
</td>
</tr>
<tr>
<td>
<input id="rblLanguage_1" type="radio" name="rblLanguage" value="Hindi" /><label for="rblLanguage_1">Hindi</label>
</td>
</tr>
</table>
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.ID)
<div class="col-sm-7">
<div class="form-group">
@Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-3" })
<div class="col-md-9">
@Html.TextAreaFor(m => m.Description, new { @class = "form-control required", @rows = "6" })
@Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-3 col-md-9">
<input type="submit" value="Update" class="btn btn-default" />
@Html.ActionLink("Cancel", "Index", "", new { @class = "btn btn-default" })
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>