Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

javascript function not being called/not working from html form

This is my whole html page

<html>
<head>
<title> text conversion</title>
<script type="text/javascript">
function testResults(form)
{

var str = form.stringn.value;

str.split(" ");
document.write("testing1");
var length = str.length;
var newn = "";

for(var i = 0; i<length; i++)
{
    if(str[i].charAt(str[i].length - 1) != ".")
    {
        str[i] = str[i] + ".";
    }
    str[i] = str[i] + " ";
    str[i].charAt(0) = str[i].charAt(0).toUpperCase();
    newn = newn + str[i];

}
document.write(newn);
document.write("testing");
}


</script>
</head>

<body>
<form name="stringform" action="" method="get">
Text: <input type="text" name="stringn"><br>
<input type="button" name="Convert" Value="convert" onClick="testResults(this.form)">
</form>
</body>


</html>

The html is being displayed correctly, but the button does not produce any action. I even tried document.write("testing") below the loop in the javascript, which had no effect, which makes me think the function is not being called at all. The idea of the function is to format the input string to capitalise the first letter of each word, and put a period after each word.

This is my first time trying to use javascript, so possibly I'm doing something wrong that should be obvious?

final solution:

<html>
<head>
<title> text conversion</title>
<script type="text/javascript">
function testResults(form)
{

var str = form.stringn.value;

var strn = str.split(" ");

var length = strn.length;
var newn = "";

for(var i = 0; i<length; i++)
{

    if(strn[i].charAt(strn[i].length - 1) != ".")
    {
        strn[i] = strn[i] + ".";
    }
    strn[i] = strn[i].charAt(0).toUpperCase() + strn[i].slice(1);

    strn[i] = strn[i] + " ";
    newn = newn + strn[i];


}
document.write(newn);

}


</script>
</head>

<body>
<form name="stringform" action="" method="get">
Text: <input type="text" name="stringn"><br>
<input type="button" name="Convert" Value="convert" onClick="testResults(this.form)">
</form>
</body>


</html>
like image 760
fonduman Avatar asked Sep 24 '26 19:09

fonduman


2 Answers

This should work. Also, echoing The comments before about using new as a variable.

<html>
<head>
<title> text conversion</title>
<script language="JavaScript">

function testResults(form)
{
    var str = form.stringn.value;
    var newString = "";
    var strList = str.split(" ");
    for(var i = 0; i < strList.length; i++){
        newWord = strList[i].charAt(0).toUpperCase() + strList[i].slice(1) + ".";       
        newString += newWord + " ";
    }
    document.write(newString);
}

</script>
</head>

<body>
<form name="stringform" action="" method="get">
Text: <input type="text" name="stringn"><br>
<input type="button" name="Convert" Value="convert" onClick="testResults(this.form)">
</form>
</body>


</html>
like image 161
Nate Jenson Avatar answered Sep 27 '26 09:09

Nate Jenson


Set <script type="text/javascript"> in your <head>!

like image 21
Deepak Biswal Avatar answered Sep 27 '26 09:09

Deepak Biswal