Showing posts with label Capital the first letter in Jquery. Show all posts
Showing posts with label Capital the first letter in Jquery. Show all posts

Friday, August 18, 2017

Capitalize the first letter of each word in a sentence Using JQuery and JavaScript


In this article I wrote a simple program that will allow the user to give a sentence and then our program will capital the first letter of the words in the given sentence using JavaScript and JQuery. The code is very simple and easy to understand. Combining JavaScript and JQuery is much fun and productive learning experience in programming in my own opinion only. Thanks guys for the support and visiting my website.

I hope you will find my work useful and beneficial. If you have some questions about programming, about my work please send mu an email at jakerpomperada@gmail.comand jakerpomperada@yahoo.com. People here in the Philippines can contact me at  my mobile number 09173084360.

Thank you very much and Happy Programming.







Sample Program Output



Program Listing

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Capitalize the first letter of each word in a sentence Using JQuery and JavaScript</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("button").click(function(){
            var words = $.trim($("textarea").val()).split(" ");
var output = "";
       for (i = 0 ; i < words.length; i ++){
lowerWord = words[i].toLowerCase();
lowerWord = lowerWord.trim();
capitalizedWord = lowerWord.slice(0,1).toUpperCase() + lowerWord.slice(1);
output += capitalizedWord;
if (i != words.length-1){
output+=" ";
}
}
output[output.length-1] = '';
   document.getElementById("result").innerHTML = output +".";
        });
    });

</script>
  <style>
   body {
     font-family:arial;
font-weight:bold;
background-color: lightgreen;
size:12px;
   }
  </style>
</head>
<body>
    <br>
<h2>Capitalize the first letter of each word in a sentence Using JQuery and JavaScript</h2>
<br>
    Enter a sentence 
    <textarea cols="80"></textarea>
    <br><br>
    <button type="button" title="Click here to capitalize the first letter of each word in a sentence .">
Ok</button>
<br><br><br>
The result : <span id="result"></span>
</body>
</html>