javascript function not being called/not working from html form

Question

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>

You are also using new as a variable. New is a reserved word in javascript. I would suggest running your code through js hint or another linter to check for syntax errors. — Nick Tomlin
– Nick Tomlin, Commented Aug 13, 2013 at 20:04
Open up your browser console, and you'll see Uncaught SyntaxError: Unexpected token new — bfavaretto
– bfavaretto, Commented Aug 13, 2013 at 20:06
the <script> language attribute is deprecated, use type="text/javascript" — omma2289
– omma2289, Commented Aug 13, 2013 at 20:07
fixed it and a couple of other things I spotted, but still not working — fonduman
– fonduman, Commented Aug 13, 2013 at 20:07
You might need to change language="javascript" to type="text/javascript" as well. Using "new" as a variable is a big no-no though. — Trendy
– Trendy, Commented Aug 13, 2013 at 20:08

Nate Jenson · Accepted Answer · 2013-08-13 20:36:09Z

5

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>

answered Aug 13, 2013 at 20:36

Nate Jenson

2,7942 gold badges27 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

fonduman Over a year ago

ah, that seemed to be the final piece, although I didn't use it exactly like that, because I don't want to add on a period if it already has a period. Final code shall be edited in in question.

Deepak Biswal · Accepted Answer · 2013-08-13 20:05:12Z

2

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

answered Aug 13, 2013 at 20:05

Deepak Biswal

4,3302 gold badges22 silver badges37 bronze badges

Collectives™ on Stack Overflow

javascript function not being called/not working from html form

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related