Skip to main content
A
atsidi
Known Participant
November 13, 2006
Answered

Simple text field

  • November 13, 2006
  • 14 replies
  • 910 views
I want to call a javascript if User clicks on a button and the text field is empty.
here is the button and the text field:
<cfinput type="file" name="custCartFile">
<cfinput type="submit" name="submit" value="Add Image">
Thanks,
Trint
This topic has been closed for replies.
Correct answer MrBonk
The easiest way is to return the javascript function from the onSubmit event of your form. onSubmit = "return your_function()". That way, when your user clicks your submit button, your script can check whatever you want to check *before* the form is actually submitted.

Like this:

<script type="text/javascript" language="javascript">
function check_file_field()
{
var file_field = document.getElementById("flFileField");
if(file_field.value.length == 0)
{
alert("Select a file first!");
return false;
}
else
{
return true;
}
}
</script>

<cfform action="#cgi.script_name#" method="post" name="frmTest" preloader="no" onsubmit="return check_file_field()">
<cfinput type="file" id="flFileField" name="flFileField">
<cfinput type="submit" name="btnSubmit" value="Go">
</cfform>

14 replies

K
Kronin555
Participating Frequently
November 15, 2006
You need to give the custCartFile input field an id of custCartFile in order for that javascript code to work.

<cfinput type="file" name="custCartFile" id="custCartFile">

it's the id value that the javascript function "document.getElementById()" is checking for.
A
atsidiAuthor
Known Participant
November 15, 2006
Yes, it looks like this now:

function check_file_field()
{
var file_field = document.getElementById("custCartFile");
if(file_field.value.length == 0)
{
alert("You are required to select an Image");
return false;
}
else
{
return true;
}
}

<cfinput type="file" name="custCartFile">

<cfinput type="submit" name="submit" value="Add Image" onClick="return check_file_field()">

Thanks,
Trint
K
Kronin555
Participating Frequently
November 15, 2006
Did you happen to change the name of the file field that is being checked in the check_file_field() function?
A
atsidiAuthor
Known Participant
November 15, 2006
MrBonk,
Since this <cfinput type="file" is already within a <cfform action, I used "onClick="return check_file_field()" at the end of this:
<cfinput type="submit" name="submit" value="Add Image" onClick="return check_file_field()">
and gives me the message "Select a file first!" whether I select a file or not!
Please help.
Thanks,
Trint
M
MrBonkCorrect answer
Inspiring
November 14, 2006
The easiest way is to return the javascript function from the onSubmit event of your form. onSubmit = "return your_function()". That way, when your user clicks your submit button, your script can check whatever you want to check *before* the form is actually submitted.

Like this:

<script type="text/javascript" language="javascript">
function check_file_field()
{
var file_field = document.getElementById("flFileField");
if(file_field.value.length == 0)
{
alert("Select a file first!");
return false;
}
else
{
return true;
}
}
</script>

<cfform action="#cgi.script_name#" method="post" name="frmTest" preloader="no" onsubmit="return check_file_field()">
<cfinput type="file" id="flFileField" name="flFileField">
<cfinput type="submit" name="btnSubmit" value="Go">
</cfform>
K
Kronin555
Participating Frequently
November 14, 2006
Until the form is submitted, custCartFile isn't defined.

Also, noImage() is a Javascript function, not a java function.

So, you can do:
<cfif isDefined("FORM.custCartFile") and len(custCartFile) is 0>
A
atsidiAuthor
Known Participant
November 14, 2006
Ok, but I'm new to Coldfusion and don't know the syntax for doing the cfif correctly. I get an error message "custCartFile" not defined when I do this:
cfinput type="submit" name="submit" value="Add Image">
<cfif len(custCartFile) is 0>
noImage(); <<<this is a java function. displays message to add imagefile
</cfif
How can I use that test correctly (syntax) so that I don't get an error message?
Thanks,
Trint
K
Kronin555
Participating Frequently
November 14, 2006
Coldfusion runs on the server. Javascript runs on the browser. If you want a popup warning _before_ they submit it, it needs to be written in javascript (both the testing and the popup). If you want them to submit it, then get back a popup, you can do the testing in coldfusion and write the popup in javascript.
A
atsidiAuthor
Known Participant
November 14, 2006
All I want is for a message box to pop up and remind if no imagefile or thumbnailfile were selected.
Thanks,
Trint
A
atsidiAuthor
Known Participant
November 14, 2006
How do I present the "custCartFile" and "custCartThumb" which are the input file entry boxes?
Ok, do I put it like this?
<cfinput type="submit" name="submit" value="Add Image">
<cfif len(custCartFile) is 0>
noImage(); <<<this is a java function. displays message to add imagefile
</cfif>
<cfif len(custCartThumb) is 0>
noThumbnail(); <<<this is a java function. displays message to add thumbfile
</cfif>
Show more replies
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices