I have a dropdown box with an onchange event. When I select a value in the dropdown I invoke a JavaScript function that accepts a few parameters then submits values to my controller. Here's what I have for the dropdown box:

        <td><select class="input-medium" name="status" id="status" onchange="javascript:changeStatus(this.value, ${module.id}, ${module.status});">
                        <option <c:if test='${module.status == "Active"}'>selected="selected"</c:if> value="active">Active</option>
                        <option <c:if test='${module.status == "Inactive"}'>selected="selected"</c:if> value="inactive">Inactive</option>
                        <option <c:if test='${module.status == "Retired"}'>selected="selected"</c:if> value="retired">Retired</option>
                        </select></td>

Here's my JavaScript function:

     <script type="text/javascript">
        function changeStatus(dropboxStat, modID, curStat) { 
            alert (dropboxStat);
            if (curStat.toString == "Active" && dropboxStat == "inactive")
                alert ("This will delete all of the module's training entries that have not been pleted!");

            document.updateForm.status.value = dropboxStat;
            document.updateForm.modID.value = modID;
            document.updateForm.submit();
            } 
     </script>

When I change a row that had a status of "active" to "inactive", the if statement should be read as true and the alert should pop up. Right now I'm not even getting the first alert to pop up. Instead, I get this error:

   ReferenceError: Active is not defined

I've read online about variables not being defined but this is just a String value...in which I thought wouldn't need to be defined. Any ideas and explanations as to why this error would get thrown?

I have a dropdown box with an onchange event. When I select a value in the dropdown I invoke a JavaScript function that accepts a few parameters then submits values to my controller. Here's what I have for the dropdown box:

        <td><select class="input-medium" name="status" id="status" onchange="javascript:changeStatus(this.value, ${module.id}, ${module.status});">
                        <option <c:if test='${module.status == "Active"}'>selected="selected"</c:if> value="active">Active</option>
                        <option <c:if test='${module.status == "Inactive"}'>selected="selected"</c:if> value="inactive">Inactive</option>
                        <option <c:if test='${module.status == "Retired"}'>selected="selected"</c:if> value="retired">Retired</option>
                        </select></td>

Here's my JavaScript function:

     <script type="text/javascript">
        function changeStatus(dropboxStat, modID, curStat) { 
            alert (dropboxStat);
            if (curStat.toString == "Active" && dropboxStat == "inactive")
                alert ("This will delete all of the module's training entries that have not been pleted!");

            document.updateForm.status.value = dropboxStat;
            document.updateForm.modID.value = modID;
            document.updateForm.submit();
            } 
     </script>

When I change a row that had a status of "active" to "inactive", the if statement should be read as true and the alert should pop up. Right now I'm not even getting the first alert to pop up. Instead, I get this error:

   ReferenceError: Active is not defined

I've read online about variables not being defined but this is just a String value...in which I thought wouldn't need to be defined. Any ideas and explanations as to why this error would get thrown?

• javascript
• html

• 2 curStat.toString == "Active" pares a function to a string. You probably meant to write curStat.toString() == "Active" – blgt Commented Feb 11, 2015 at 14:54

1 Answer 1

Your onchange is being rendered as

changeStatus(this.value, 123, Active)

so it is seeing Active as a variable and not a string. Hence the error.

You need to add the missing quotes around your arguments

<td><select class="input-medium" name="status" id="status" onchange="javascript:changeStatus(this.value, '${module.id}', '${module.status}');">