Solved

Javascript interact with ColdFusion

Posted on 2007-04-06
20
277 Views
Last Modified: 2013-12-16
Hi, Experts,

Please help me find out why the following code I wrote did not produce the expected outcome.

First, is that the alert always fires, even the NumbArtFiles I input is 1.
Secondly, it always post to the 2nd cfm as specsified in form action. My intension is to delay that if the javascript function returns FALSE.

<script type="text/javascript">
function validate_form(thisform)
{
if (thisform.NumbArtFiles !=1)
      {
      alert("You have said 1 ...");
      NumbArtFiles.focus();
      return false;
      }
      return true;
}
</script>

<cfform action="OrderProc.cfm" name="Order" onsubmit="return validate_form(this)" Method="Post">

Thanks!
0
Comment
Question by:ommer
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 8
  • 6
  • 5
  • +1
20 Comments
 
LVL 15

Assisted Solution

by:stanscott2
stanscott2 earned 50 total points
ID: 18864380
In your If statement, you're referencing the object itself.  Reference the value, like this:

if (thisform.NumbArtFiles.value != 1)

When you return false in your validate_form function, it should not continue posting the form.
0
 

Author Comment

by:ommer
ID: 18864625
Thank you for your reply!

However, after I added the value, the If never tests to true any more no matter what I have entered. In another word, the alert part never got called, and it always posted the form.

By the way, I want to do an alert before the IF test to see the value of the field, but it seems the function itself is not been call this time.

function validate_form(thisform)
{alert("here is the value" + thisform.NumbArtFiles.value );
if (thisform.NumbArtFiles.value !=1)
      {
      alert("You have said 1 ...");
      NumbArtFiles.focus();
      return false;
      }
      return true;
}

Any thing I did wrong here?

Thanks again!
0
 
LVL 29

Expert Comment

by:Badotz
ID: 18866764
What is the value contained in 'thisform.NumbArtFiles.value' ? If it is equal to 1, well, there's your problem ;-)
0
Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

 

Author Comment

by:ommer
ID: 18867614
I have tested with 1, and whole bunch of non-1 numbers. But it seems the Javascript function did not get called.

And my original code always calls, but because the IF always true, so the alert fired every time, however, even the function return false, the posting is not delayed...
0
 
LVL 29

Assisted Solution

by:Badotz
Badotz earned 150 total points
ID: 18867623
>>But it seems the Javascript function did not get called

Put an alert as the first line of the function and see if it is triggered?

function validate_form(thisform)
{
alert("inside 'validate_form'");
...
0
 

Author Comment

by:ommer
ID: 18875384
My last post has this in its first line, with the same intension as you have suggested:

alert("here is the value" + thisform.NumbArtFiles.value );

But it did not get called.
0
 

Author Comment

by:ommer
ID: 18875662
I went back and added the alert as you have done, and it DID fire.

So, that tell me the parameter to the function did not get passed correctly. I have tried several ways, but have not figured out the RIGHT way. Here are my tries:
A)
onsubmit="return validate_form(this)"
function validate_form(thisForm)
B)
onsubmit="return validate_form(thisForm)"
function validate_form(thisForm)
C)
onsubmit="return validate_form(this.NumbArtFiles)"
function validate_form(this.NumbArtFiles)

0
 
LVL 29

Expert Comment

by:Badotz
ID: 18876264
A) is the winner.

Change the alert that is on the first line to this:

alert(thisForm.NumbArtFiles.value);

and tell us what it displays?
0
 

Author Comment

by:ommer
ID: 18877205
With
alert(thisForm.NumbArtFiles.value);
as the first line,

nothing displayed. No alert pop up. The cfm on cfform action="OrderProc.cfm got run, and a record wrote to the back end.

I even tried next D some thing like this...
D)
onsubmit="return validate_form(thisForm)"
function validate_form(#Order.NumbArtFiles#)

But the alert did not fire. The param I want to pass in is from cfinput field. Probably I should have made myself clear at the every begining. Here is how the whole tag looks like. I guess the important things are variable name and data type. I know for a fact that the input has made it to the back end.

<tr>
<td width="150"><font color="Red">*</font>Number of Art Files being Transferred</td>
<td width="270"><cfinput type="text" name="NumbArtFiles" value="#Order.NumbArtFiles#" message="Please enter a Number for Art File Transferred." validate="float" required="Yes" class="text"><br>(Please enter numeric value. Enter 0 for none.)
      </td>
</tr>
0
 
LVL 29

Expert Comment

by:Badotz
ID: 18877253
Time to run this page in a debugger and step through function 'validate_form' and see what is *really* happening.
0
 
LVL 20

Expert Comment

by:trailblazzyr55
ID: 18892734
give this a shot...

<script type="text/javascript">
function validateForm(frmObj){
 alert("Validation Processing...");
 if(frmObj.NumbArtFiles.value != 1){
  alert("NumArtFiles.value is not 1, Form shouldn't submit.");
  frmObj.NumbArtFiles.focus();
  return false;
 }else{
  alert("NumArtFiles.value is 1, Form should submit.");
 }
 return true;
}
</script>


<cfform action="OrderProc.cfm" name="Order" onsubmit="return validateForm(this);" method="post">



NOTE: in every case above, you have this line...

NumbArtFiles.focus();

which is incorrect because you're not prefixing it with the form it's in, so it will cause you issues, you needed to add the form object prefix.... My example has a few different alert()'s to show where you are in the function as the script runs, you can remove those, they're basically for your reference in debugging... good luck ;o)

-tb55
0
 

Author Comment

by:ommer
ID: 18897966
Trailblazzr55,
Thank you for reply, but I could not make any of your alert come up. The onsubmit was been ignored, and the submit went through.

This is harder than I thought. I have increased the credit point.
0
 
LVL 29

Expert Comment

by:Badotz
ID: 18897980
I'm telling you, it is time to run this page in a debugger and step through the code to see what is *really* happening. Further guesswork is futile.
0
 
LVL 20

Expert Comment

by:trailblazzyr55
ID: 18898312
is there a reason why you're using <cfform>? Are your input fields <cfinput> or <input>?

can you post the code for you whole page?

debug away too as Badotz mentioned...
0
 

Author Comment

by:ommer
ID: 18898505
Ok, I am going to debug. I am asp.net guy, and my ide here is Dreamweaver MX. I assume this is the right ide for debuging cfm and javascript. I will dig in the the doc/help file.

Here is the whole cfm page. Thanks!

<!--- Processing --->
<cfinclude template="../OnlyDistrib.cfm">

<cfoutput>

<!---Will be querying the pricebook later.  Need to know which one.  --->
<cfset PriceBook = Year(Now()) & "CAT">

<!---This form will create a new order if there's no url.OrderID --->
<cfif IsDefined("url.OrderID")>
      <cfset FormTitle="Change Order">
      <cfquery name="Order" datasource="QWrightSQL">
            SELECT * FROM stsWebOrders WHERE OrderID = #url.OrderID#
      </cfquery>

      <cfif Order.RecordCount EQ "0"><cfthrow type="OrderEntry" message="OrderID specified in URL does not exist"></cfif>

      <cfif Order.CustomerID NEQ user.user_id><cfthrow type="NotPermitted" message="User #user.user_id# has been denied permission to view order #url.OrderID# of user/customer #order.CustomerID#."></cfif>

      <cfif Order.Status EQ "Checked">
            <cflocation url="OrderView.cfm?OrderID=#Order.OrderID#">
      </cfif>
<cfelse>
      <cfset FormTitle="Add Order">
      <cfparam name="url.part" default="">
      <cfset defaultsize="">
      <cfif url.part NEQ "">
            <!---Automatically fill in size, but only if that item comes in only 1 size. --->
            <cfquery name="Sizes" datasource="QWrightSQL">
                  SELECT stsItem11Header.SizeDesc
                  FROM stsItem11Header
                  WHERE stsItem11Header.ProductFamily='#url.part#' AND PriceBook = '#PriceBook#'
                  GROUP BY stsItem11Header.SizeDesc;
            </cfquery>
            <cfif Sizes.RecordCount EQ "1">
                  <cfset defaultsize=Sizes.SizeDesc>
            </cfif>
      </cfif>

      <cfquery name="DeleteBlankOrders" datasource="QWrightSQL">
            DELETE FROM stsWebOrders WHERE stsWebOrders.CustomerID = '#user.user_id#' AND ( stsWebOrders.ItemNumber IS NULL OR stsWebOrders.ItemNumber = '' ) AND GetDate() > EditClearDT
      </cfquery>

      <!--- This file can be called from the PriceItNow (quickquote) side of the world, too.  If it was, we stuff the
                  new order with the provided information during creation.  Otherwise, just create a blank order. --->
      <cfif IsDefined("form.priceitnow") And (form.priceitnow IS "1")>
            <!--- Came from PriceItNow, so create the order with as much information as we have: --->
            <cfquery name="CreateOrder" datasource="QWrightSQL">
                  INSERT INTO stsWebOrders ("CustomerID", "ItemNumber", "Size", "Quantity", "Instructions", "Colors", "UnitPrice", "TotalPrice", "CutType", "Numbering") SELECT '#user.user_id#', '#form.frmItemNumber#', '#form.frmSize#', '#form.frmQuantity#', '#form.frmInstructions#', '#form.frmColors#', '#form.frmUnitPrice#', '#form.frmTotalPrice#', '#form.frmCutType#', '#form.frmNumbering#'
            </cfquery>
      <cfelse>
            <!--- Didn't come from PriceItNow, so just create a blank order: --->
            <cfquery name="CreateOrder" datasource="QWrightSQL">
                  INSERT INTO stsWebOrders ("CustomerID", "ItemNumber", "Size") SELECT '#user.user_id#', '#url.part#', '#defaultsize#'
            </cfquery>
      </cfif>
      
      <cfquery name="GetOrderNumber" datasource="QWrightSQL">
            SELECT MAX(OrderID) AS NewOrder FROM stsWebOrders WHERE CustomerID = '#user.user_id#'
      </cfquery>

      <cfquery name="Order" datasource="QWrightSQL">
            SELECT * FROM stsWebOrders WHERE OrderID = #GetOrderNumber.NewOrder#
      </cfquery>
</cfif>

<cfquery name="Lock" datasource="QWrightSQL">
      UPDATE stsWebOrders SET Status = 'Editing...', EditClearDT = DateAdd(hour, 1, GetDate()) WHERE OrderID = #Order.OrderID#
</cfquery>

<cfquery name="ProductList" datasource="QWrightSQL">
      SELECT stsItem11Header.ProductFamily, stsItem11Header.ProductFamily + ' - ' + Min(stsItem11Header.ItemDesc) AS ItemDesc
      FROM stsItem11Header
      WHERE stsItem11Header.PriceBook='#PriceBook#'
      GROUP BY stsItem11Header.ProductFamily
</cfquery>

<cfinclude template="../nocache.cfm">

<cfset title="Submit Order">

<!--- Output --->
<cfinclude template="../CustomerCenter/header.cfm">

<table width="570" align="center">
  <tr>
      <td><div align="right"><br>
            <img src="../Images/page_titles/PlaceOrder.gif" width="380" height="26">
        </div></td>
  </tr>
  <tr>
      <td>&nbsp;</td>
  </tr>
</table>


      <script language="JavaScript1.2">
      function GoCatalog(){
            window.open('../scio/content_view.cfm?item_type=pf&item_id=' + document.Order.ItemNumber.value, '_new','width=600,height=300,scrollbars=yes,resizable=yes')
      }
      </script>
<script type="text/javascript">
function validate_form(frmObj)
{
alert("Val processing...");
      if (frmObj.NumbArtFiles.value != 1)
            {
            alert("NumbArtFiles is not 1 ...");
            frmObj.NumbArtFiles.focus();
            return false;
            }else{alert("it is 1, and will submit");
            return true;
}
</script>

<b>#FormTitle#</b><br><br>

<cfquery name="Account" datasource="QWrightSQL">
      SELECT account_name, fax, email FROM account WHERE account_number = '#user.user_id#'
</cfquery>

<div align="center" style="width:420px;">
<p>
      Not all fields may be applicable to the product you are ordering.&nbsp; Please see the current Stouse catalog for details.
<p>
      Fields marked with a red asterisk (<font color="Red">*</font>) are required.            
</p>
</div>

<br>

<cfform action="OrderProc.cfm" name="Order" onsubmit="return validate_form(this);" Method="Post">

<table width="420" border="0" cellspacing="0" cellpadding="8">
<tr>
      <td width="150"><font color="Red">*</font>Item Number</td>
      <td width="270">
            <cfinput type="text" name="ItemNumber" id="ItemNumber" class="text" message="You must select an item number" value="#Order.ItemNumber#" required="Yes"></cfinput><br>
<!--             <a href="javascript: GoCatalog();">View catalog page <br>for this item number</a> -->
      </td>
<!---       <cfselect type="text" name="ItemNumber" query="ProductList" id="ItemNumber" class="text" message="You must select an item number" query="ProductList" display="ItemDesc" selected="#Order.ItemNumber#" required="Yes"></cfselect> --->
</tr><tr>
      <td width="150"><font color="Red">*</font>Contact</td>
      <td width="270"><cfinput type="Text" name="Contact" value="#Order.Contact#" message="Please enter a contact name." required="Yes" class="text"></td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Email</td>
      <td width="270"><cfinput type="Text" name="Email" value="#Order.Email#" message="Please enter your Email address." required="Yes" class="text"></td>
</tr><tr>
      <td width="150"><font color="Red">*</font>PO number</td>
      <td width="270"><cfinput type="Text" name="PO" value="#Order.PO#" message="Please enter the PO number" required="Yes" class="text"></td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Previous Job</td>
      <td width="270">
            <cfinput type="Text" name="PrevJob" value="#Order.PrevJob#" message="Please enter the previous job number or 'none'." required="Yes" class="text">
            (Please enter the previous job number or "none")
      </td>
</tr><tr>
      <td width="150">Quote Number</td>
      <td width="270"><input type="text" class="text" name="QuoteNumber" value="#Order.QuoteNumber#"></td>
</tr><tr>
      <td width="150">Unit Price</td>
      <td width="270"><input type="text" class="text" name="UnitPrice" value="#Order.UnitPrice#"></td>
</tr><tr>
      <td width="150">Total Price</td>
      <td width="270"><input type="text" class="text" name="TotalPrice" value="#Order.TotalPrice#"></td>
</tr><tr>
      <td width="150">Payment Type</td>
      <td width="270">
            <cfselect name="PaymentType" selected="#Order.PaymentType#" class="text">
                  <option value="Net - 30 Days">Net - 30 Days</option>
                  <option value="COD">COD</option>
                  <option value="Credit Card">Credit Card</option>
            </cfselect>
      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Quantity</td>
      <td width="270"><cfinput type="Text" name="Quantity" value="#Order.Quantity#" message="Please enter a numeric quantity." validate="float" required="Yes" class="text">      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Size</td>
      <td width="270">
            <cfinput type="Text" name="Size" value="#Order.Size#" message="Please enter a size." required="Yes" class="text">
            (Please use inches to specify the size.)
      </td>
</tr><tr>
      <td width="150">Colors</td>  <!---Required in next step  --->
      <td width="270">
            <textarea name="Colors" class="text" rows="5" wrap="PHYSICAL">#Order.Colors#</textarea><br>
            (Separate colors with commas. Example: Black, Fire Red)
      </td>
</tr><tr>
      <td width="150">Need a Proof?</td>
      <td width="300" align="center">
            No<input type="radio" name="Proof" value="No" checked>
            &nbsp;Fax<input type="radio" name="Proof" value="Fax">
            &nbsp;Paper<input type="radio" name="Proof" value="Paper">
            &nbsp;Email<input type="radio" name="Proof" value="Email"><br>
            (Note: Production time begins after proof approval)
      </td>
</tr><tr>
      <td width="150">Front/Back adhesive</td>
      <td width="270">
            <input type="text" name="FrontBack" value="#Order.FrontBack#" class="text"><br>
            (Required entry only if this item is printed on clear polyester)
      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Cut Type</td>
      <td width="270">
            <cfinput type="Text" name="CutType" value="#Order.CutType#" message="Please enter a cut type." required="Yes" class="text"><br>
            (Enter 'square' or 'die'.  If you require a special die cut shape, please describe.)
      </td>
</tr><tr>
      <td width="150">Description of Numbering</td>
      <td width="270">
            <textarea name="Numbering" class="text" rows="5" wrap="PHYSICAL">#Order.Numbering#</textarea><br>
            (May not be applicable to the item you are ordering.  See the catalog.  Include size, starting number, ending number, and color.)
      </td>
</tr><tr>
      <td width="150">Shipping Method</td>
      <td width="270">
            <cfselect name="Shipping" selected="#Order.Shipping#" class="text">
                  <option value="Ground">Ground</option>
                  <option value="Second Day">Second Day</option>
                  <option value="Next Day">Next Day</option>
                  <option value="Other">Other</option>
            </cfselect>
      </td>
</tr><tr>
      <td width="150">Ship-to address (if different from bill-to-address)</td>
      <td width="270"><textarea name="ShipAddress" class="text" rows="5" wrap="PHYSICAL">#Order.ShipAddress#</textarea></td>
</tr><tr>
      <td colspan="2" align="center">
            <b>Copy / Special Instructions</b></br>
            (Specific shipping instructions, details/comments on order, special requests, etc.)<br>
            <textarea name="Instructions" class="text" rows="8" wrap="PHYSICAL">#Order.Instructions#</textarea>            
      </td>
</tr><tr>
      <td colspan="2" align="center">
            <br><b>ArtWork File upload</b><br>
            <a href="/ArtInfo/Guidelines.html" target="_blank">Quick Reference Guide For Sending Artwork</a>
      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Number of Art Files being Transferred</td>
      <td width="270">
            <cfinput type="text" name="NumbArtFiles" value="#Order.NumbArtFiles#" message="Please enter a Number for Art File Transferred." validate="float" required="Yes" class="text"><br>
            (Please enter numeric value. Enter 0 for none.)
      </td>
</tr><tr>
      <td width="150">Number of Visuals being Transferred</td>
      <td width="270">
            <input type="text" name="NumbVisuals" value="#Order.NumbVisuals#" class="text"><br>
            
      </td>      
</tr><tr>
<td colspan="2">Please upload a jpeg or PDF of the Art files supplied above to insure everything transferred correctly
             with no missing elements, colors, layers, etc. </td>
             </tr>
<td colspan="2" align="center">
      <iframe name="filelist.cfm" src="filelist.cfm?OrderID=#Order.OrderID#" width="420" height="200" scrolling="yes"></iframe>
      Please upload native files in the following programs (listed in our order of preference): Illustrator,
            Freehand, Corel Draw, Photoshop, Quark Express, PageMaker, Indesign, PDF or EPS.  Microsoft programs
            are discouraged and often times are unusable for our operation.
</td>
</tr>
</table>

<br><br><br><hr>
<br>
<input type="hidden" name="OrderID" value="#Order.OrderID#">
<input type="submit" class="button" name="submit322" value="Submit">
&nbsp;
<input type="reset" class="button" value="   Reset Form   " onClick="willReset=confirm('Are you sure you want to clear your entries?');return willReset;">
<br><br>
</cfform>
</div>
</cfoutput>
<cfinclude template="../CustomerCenter/footer.cfm">
0
 
LVL 20

Accepted Solution

by:
trailblazzyr55 earned 300 total points
ID: 18898560
alrighty, this will work for you... basically we give the field you want to test an ID, then reference that from the javascript, the cfform was throwing off the reference to it in your javascript....


this is exactly what you posted just previous with the fixes, copy and paste....

<!--- Processing --->
<cfinclude template="../OnlyDistrib.cfm">

<cfoutput>

<!---Will be querying the pricebook later.  Need to know which one.  --->
<cfset PriceBook = Year(Now()) & "CAT">

<!---This form will create a new order if there's no url.OrderID --->
<cfif IsDefined("url.OrderID")>
      <cfset FormTitle="Change Order">
      <cfquery name="Order" datasource="QWrightSQL">
            SELECT * FROM stsWebOrders WHERE OrderID = #url.OrderID#
      </cfquery>

      <cfif Order.RecordCount EQ "0"><cfthrow type="OrderEntry" message="OrderID specified in URL does not exist"></cfif>

      <cfif Order.CustomerID NEQ user.user_id><cfthrow type="NotPermitted" message="User #user.user_id# has been denied permission to view order #url.OrderID# of user/customer #order.CustomerID#."></cfif>

      <cfif Order.Status EQ "Checked">
            <cflocation url="OrderView.cfm?OrderID=#Order.OrderID#">
      </cfif>
<cfelse>
      <cfset FormTitle="Add Order">
      <cfparam name="url.part" default="">
      <cfset defaultsize="">
      <cfif url.part NEQ "">
            <!---Automatically fill in size, but only if that item comes in only 1 size. --->
            <cfquery name="Sizes" datasource="QWrightSQL">
                  SELECT stsItem11Header.SizeDesc
                  FROM stsItem11Header
                  WHERE stsItem11Header.ProductFamily='#url.part#' AND PriceBook = '#PriceBook#'
                  GROUP BY stsItem11Header.SizeDesc;
            </cfquery>
            <cfif Sizes.RecordCount EQ "1">
                  <cfset defaultsize=Sizes.SizeDesc>
            </cfif>
      </cfif>

      <cfquery name="DeleteBlankOrders" datasource="QWrightSQL">
            DELETE FROM stsWebOrders WHERE stsWebOrders.CustomerID = '#user.user_id#' AND ( stsWebOrders.ItemNumber IS NULL OR stsWebOrders.ItemNumber = '' ) AND GetDate() > EditClearDT
      </cfquery>

      <!--- This file can be called from the PriceItNow (quickquote) side of the world, too.  If it was, we stuff the
                  new order with the provided information during creation.  Otherwise, just create a blank order. --->
      <cfif IsDefined("form.priceitnow") And (form.priceitnow IS "1")>
            <!--- Came from PriceItNow, so create the order with as much information as we have: --->
            <cfquery name="CreateOrder" datasource="QWrightSQL">
                  INSERT INTO stsWebOrders ("CustomerID", "ItemNumber", "Size", "Quantity", "Instructions", "Colors", "UnitPrice", "TotalPrice", "CutType", "Numbering") SELECT '#user.user_id#', '#form.frmItemNumber#', '#form.frmSize#', '#form.frmQuantity#', '#form.frmInstructions#', '#form.frmColors#', '#form.frmUnitPrice#', '#form.frmTotalPrice#', '#form.frmCutType#', '#form.frmNumbering#'
            </cfquery>
      <cfelse>
            <!--- Didn't come from PriceItNow, so just create a blank order: --->
            <cfquery name="CreateOrder" datasource="QWrightSQL">
                  INSERT INTO stsWebOrders ("CustomerID", "ItemNumber", "Size") SELECT '#user.user_id#', '#url.part#', '#defaultsize#'
            </cfquery>
      </cfif>
     
      <cfquery name="GetOrderNumber" datasource="QWrightSQL">
            SELECT MAX(OrderID) AS NewOrder FROM stsWebOrders WHERE CustomerID = '#user.user_id#'
      </cfquery>

      <cfquery name="Order" datasource="QWrightSQL">
            SELECT * FROM stsWebOrders WHERE OrderID = #GetOrderNumber.NewOrder#
      </cfquery>
</cfif>

<cfquery name="Lock" datasource="QWrightSQL">
      UPDATE stsWebOrders SET Status = 'Editing...', EditClearDT = DateAdd(hour, 1, GetDate()) WHERE OrderID = #Order.OrderID#
</cfquery>

<cfquery name="ProductList" datasource="QWrightSQL">
      SELECT stsItem11Header.ProductFamily, stsItem11Header.ProductFamily + ' - ' + Min(stsItem11Header.ItemDesc) AS ItemDesc
      FROM stsItem11Header
      WHERE stsItem11Header.PriceBook='#PriceBook#'
      GROUP BY stsItem11Header.ProductFamily
</cfquery>

<cfinclude template="../nocache.cfm">

<cfset title="Submit Order">

<!--- Output --->
<cfinclude template="../CustomerCenter/header.cfm">

<table width="570" align="center">
  <tr>
      <td><div align="right"><br>
            <img src="../Images/page_titles/PlaceOrder.gif" width="380" height="26">
        </div></td>
  </tr>
  <tr>
      <td>&nbsp;</td>
  </tr>
</table>


      <script language="JavaScript1.2">
      function GoCatalog(){
            window.open('../scio/content_view.cfm?item_type=pf&item_id=' + document.Order.ItemNumber.value, '_new','width=600,height=300,scrollbars=yes,resizable=yes')
      }
      </script>
<script type="text/javascript">
function validate_form(){
 alert("Validation Processing...");
 if(document.getElementById("NumbArtFiles").value != 1){
  alert("NumArtFiles.value is not 1, Form shouldn't submit.");
  document.getElementById("NumbArtFiles").focus();
  return false;
 }else{
  alert("NumArtFiles.value is 1, Form should submit.");
 }
 return true;
}
</script>

<b>#FormTitle#</b><br><br>

<cfquery name="Account" datasource="QWrightSQL">
      SELECT account_name, fax, email FROM account WHERE account_number = '#user.user_id#'
</cfquery>

<div align="center" style="width:420px;">
<p>
      Not all fields may be applicable to the product you are ordering.&nbsp; Please see the current Stouse catalog for details.
<p>
      Fields marked with a red asterisk (<font color="Red">*</font>) are required.            
</p>
</div>

<br>

<cfform action="OrderProc.cfm" name="Order" onsubmit="return validate_form();" Method="Post">

<table width="420" border="0" cellspacing="0" cellpadding="8">
<tr>
      <td width="150"><font color="Red">*</font>Item Number</td>
      <td width="270">
            <cfinput type="text" name="ItemNumber" id="ItemNumber" class="text" message="You must select an item number" value="#Order.ItemNumber#" required="Yes"></cfinput><br>
<!--             <a href="javascript: GoCatalog();">View catalog page <br>for this item number</a> -->
      </td>
<!---       <cfselect type="text" name="ItemNumber" query="ProductList" id="ItemNumber" class="text" message="You must select an item number" query="ProductList" display="ItemDesc" selected="#Order.ItemNumber#" required="Yes"></cfselect> --->
</tr><tr>
      <td width="150"><font color="Red">*</font>Contact</td>
      <td width="270"><cfinput type="Text" name="Contact" value="#Order.Contact#" message="Please enter a contact name." required="Yes" class="text"></td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Email</td>
      <td width="270"><cfinput type="Text" name="Email" value="#Order.Email#" message="Please enter your Email address." required="Yes" class="text"></td>
</tr><tr>
      <td width="150"><font color="Red">*</font>PO number</td>
      <td width="270"><cfinput type="Text" name="PO" value="#Order.PO#" message="Please enter the PO number" required="Yes" class="text"></td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Previous Job</td>
      <td width="270">
            <cfinput type="Text" name="PrevJob" value="#Order.PrevJob#" message="Please enter the previous job number or 'none'." required="Yes" class="text">
            (Please enter the previous job number or "none")
      </td>
</tr><tr>
      <td width="150">Quote Number</td>
      <td width="270"><input type="text" class="text" name="QuoteNumber" value="#Order.QuoteNumber#"></td>
</tr><tr>
      <td width="150">Unit Price</td>
      <td width="270"><input type="text" class="text" name="UnitPrice" value="#Order.UnitPrice#"></td>
</tr><tr>
      <td width="150">Total Price</td>
      <td width="270"><input type="text" class="text" name="TotalPrice" value="#Order.TotalPrice#"></td>
</tr><tr>
      <td width="150">Payment Type</td>
      <td width="270">
            <cfselect name="PaymentType" selected="#Order.PaymentType#" class="text">
                  <option value="Net - 30 Days">Net - 30 Days</option>
                  <option value="COD">COD</option>
                  <option value="Credit Card">Credit Card</option>
            </cfselect>
      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Quantity</td>
      <td width="270"><cfinput type="Text" name="Quantity" value="#Order.Quantity#" message="Please enter a numeric quantity." validate="float" required="Yes" class="text">      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Size</td>
      <td width="270">
            <cfinput type="Text" name="Size" value="#Order.Size#" message="Please enter a size." required="Yes" class="text">
            (Please use inches to specify the size.)
      </td>
</tr><tr>
      <td width="150">Colors</td>  <!---Required in next step  --->
      <td width="270">
            <textarea name="Colors" class="text" rows="5" wrap="PHYSICAL">#Order.Colors#</textarea><br>
            (Separate colors with commas. Example: Black, Fire Red)
      </td>
</tr><tr>
      <td width="150">Need a Proof?</td>
      <td width="300" align="center">
            No<input type="radio" name="Proof" value="No" checked>
            &nbsp;Fax<input type="radio" name="Proof" value="Fax">
            &nbsp;Paper<input type="radio" name="Proof" value="Paper">
            &nbsp;Email<input type="radio" name="Proof" value="Email"><br>
            (Note: Production time begins after proof approval)
      </td>
</tr><tr>
      <td width="150">Front/Back adhesive</td>
      <td width="270">
            <input type="text" name="FrontBack" value="#Order.FrontBack#" class="text"><br>
            (Required entry only if this item is printed on clear polyester)
      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Cut Type</td>
      <td width="270">
            <cfinput type="Text" name="CutType" value="#Order.CutType#" message="Please enter a cut type." required="Yes" class="text"><br>
            (Enter 'square' or 'die'.  If you require a special die cut shape, please describe.)
      </td>
</tr><tr>
      <td width="150">Description of Numbering</td>
      <td width="270">
            <textarea name="Numbering" class="text" rows="5" wrap="PHYSICAL">#Order.Numbering#</textarea><br>
            (May not be applicable to the item you are ordering.  See the catalog.  Include size, starting number, ending number, and color.)
      </td>
</tr><tr>
      <td width="150">Shipping Method</td>
      <td width="270">
            <cfselect name="Shipping" selected="#Order.Shipping#" class="text">
                  <option value="Ground">Ground</option>
                  <option value="Second Day">Second Day</option>
                  <option value="Next Day">Next Day</option>
                  <option value="Other">Other</option>
            </cfselect>
      </td>
</tr><tr>
      <td width="150">Ship-to address (if different from bill-to-address)</td>
      <td width="270"><textarea name="ShipAddress" class="text" rows="5" wrap="PHYSICAL">#Order.ShipAddress#</textarea></td>
</tr><tr>
      <td colspan="2" align="center">
            <b>Copy / Special Instructions</b></br>
            (Specific shipping instructions, details/comments on order, special requests, etc.)<br>
            <textarea name="Instructions" class="text" rows="8" wrap="PHYSICAL">#Order.Instructions#</textarea>            
      </td>
</tr><tr>
      <td colspan="2" align="center">
            <br><b>ArtWork File upload</b><br>
            <a href="/ArtInfo/Guidelines.html" target="_blank">Quick Reference Guide For Sending Artwork</a>
      </td>
</tr><tr>
      <td width="150"><font color="Red">*</font>Number of Art Files being Transferred</td>
      <td width="270">
            <cfinput type="text" name="NumbArtFiles" id="NumbArtFiles" value="#Order.NumbArtFiles#" message="Please enter a Number for Art File Transferred." validate="float" required="Yes" class="text"><br>
            (Please enter numeric value. Enter 0 for none.)
      </td>
</tr><tr>
      <td width="150">Number of Visuals being Transferred</td>
      <td width="270">
            <input type="text" name="NumbVisuals" value="#Order.NumbVisuals#" class="text"><br>
           
      </td>      
</tr><tr>
<td colspan="2">Please upload a jpeg or PDF of the Art files supplied above to insure everything transferred correctly
             with no missing elements, colors, layers, etc. </td>
             </tr>
<td colspan="2" align="center">
      <iframe name="filelist.cfm" src="filelist.cfm?OrderID=#Order.OrderID#" width="420" height="200" scrolling="yes"></iframe>
      Please upload native files in the following programs (listed in our order of preference): Illustrator,
            Freehand, Corel Draw, Photoshop, Quark Express, PageMaker, Indesign, PDF or EPS.  Microsoft programs
            are discouraged and often times are unusable for our operation.
</td>
</tr>
</table>

<br><br><br><hr>
<br>
<input type="hidden" name="OrderID" value="#Order.OrderID#">
<input type="submit" class="button" name="submit322" value="Submit">
&nbsp;
<input type="reset" class="button" value="   Reset Form   " onClick="willReset=confirm('Are you sure you want to clear your entries?');return willReset;">
<br><br>
</cfform>
</div>
</cfoutput>
<cfinclude template="../CustomerCenter/footer.cfm">
0
 
LVL 20

Expert Comment

by:trailblazzyr55
ID: 18898625
if for some reason you are still experiencing problems with the javascript after you test what I posted above, then run your page in Mozilla and debug through their javascript console, much more robust in terms of providing feedback on errors than IE. I also am using Dreamweaver MX, not really the place to debug javascript, use Mozilla's javascript console...
0
 

Author Comment

by:ommer
ID: 18898832
Thank you! This works!
That is a big step for me.

However, it is just one of many steps for the task at hand.
I will open another thread if I could not get them resolved within a reasonable time.

Thanks!
0
 
LVL 29

Expert Comment

by:Badotz
ID: 18899035
No worries - glad to help.
0
 
LVL 20

Expert Comment

by:trailblazzyr55
ID: 18899197
Glad that worked for you, fyi... unless you're using cfform for special functionality built into cfform, I would stick with the standard <form> tags including <input>'s instead of <cfinput>'s. This will help eliminate some of the issues you're having as well especially with the javascript.

Also make sure you don't purely rely on javascript for data integrity, you want javascript there for presentation and helpful reminders, but don't rely on it purely to make sure something is correct before updating a database or something in case the user has javascript tuurned off. Validate everything is correct with coldfusion, this way you'll be sure you're enforcing what you expect.

Good luck!
Thanks and glad I could help,
-tb55
0

Featured Post

NFR key for Veeam Backup for Microsoft Office 365

Veeam is happy to provide a free NFR license (for 1 year, up to 10 users). This license allows for the non‑production use of Veeam Backup for Microsoft Office 365 in your home lab without any feature limitations.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When setting up new project requests for our site, one of the most powerful tools our team has available to use is Axure (http://www.axure.com/). It’s a tool for creating software and web prototypes that can function and interact as if it were the a…
This article discusses how to create an extensible mechanism for linked drop downs.
The purpose of this video is to demonstrate how to update a WordPress Site’s version. WordPress releases new versions of its software frequently and it is important to update frequently in order to keep your site secure, and to get new WordPress…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question