SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Apr 2010
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question External JS form field validation

    Hello all,

    I have a external JS problem I have been working on for 2 days now, any help would be appreciated.

    I have a form that in the head area of the PHP landing page has the following source of JS:
    Code:
    <script type="text/javascript" src="/js/gcert_process_form.js"></script>
    on the same page it has an include to grab the form:
    Code:
    <?php include(DIR_WS_PHP."gcert_form.inc.php");?>
    _____________________________________________________

    That being said here is the form code:
    Code:
    <form id="contact_form" name="contact_form" method="post" action="/process_gcert_form.php">
    <p>
    <label class="contact">* Which location is most convenient?</label>
    <select name="location">
    <option selected><?php if ($location){ echo $location;}else{ echo "Choose one";}?></option>
    <option disabled="disabled" value "">-----------------------------------------</option>
    <option value="Sheridan">confidential 1</option>
    <option value="Pen Centre">confidential 2</option>
    <option value="Grantham">confidential 3</option>
    </select><br />
    
    <label class="contact">* First Name:</label><input type="text" name="fname" size="25" value="<?php if ($fname){ echo $fname;}?>" /><br /> 
    <label class="contact">* Last Name:</label><input type="text" name="lname" size="25" value="<?php if ($lname){ echo $lname;}?>"  /><br />                   
    <label class="contact">Age:</label>
    <select name="age" id="age">
    <option selected><?php if (isset($age)){ echo $age;}else{ echo "Choose one";}?></option>
    <option disabled>-------</option>
    <option>13 - 17</option>
    <option>18 - 24</option>
    <option>25 - 29</option>
    <option>30 - 39</option>
    <option>40 - 49</option>
    <option>50 - 59</option>
    <option>60 - 69</option>
    <option>70 and over</option>
    </select><br /><br />
    <label class="contact">Gender:</label>
    <input type="radio" name="gender" value="Male" style="margin:0; padding:0; border:none;" <?php if ($gender=="Male"){ echo "checked";}?>>Male&nbsp;&nbsp;<input type="radio" name="gender" value="Female" style="margin:0; padding:0; border:none;" <?php if ($gender=="Female"){ echo "checked";}?>>Female<br /><br />
    <label class="contact">Address:</label><input type="text" name="address" size="25" value="<?php if (isset($address)){ echo $address;}?>" /><br />
    <label class="contact">City:</label><input type="text" name="city" size="25" value="<?php if (isset($city)){ echo $city;}?>"/> <br />                            
    <label class="contact">Postal Code:</label><input type="text" name="pcode" value="<?php if ($pcode){ echo $pcode;}?>"/><br />                          
    <label class="contact">* Phone number:</label><input type="text" name="phone" value="<?php if ($phone){ echo $phone;}?>" /><br />                         
    <label class="contact">* E-Mail Address:</label><input type="text" name="email" size="25" value="<?php if ($email){ echo $email;}?>"/><br />
    <label class="contact">* Certificate Code:</label><input type="text" name="gcode" size="15" value="<?php if ($gcode){ echo $gcode;}?>"/><br />
    <input type= "hidden" id="gcodedate" name="gcodedate" value="<?php echo( $gcode);?>">
                                                   
    <label class="contact">Your question or comments:</label>
    <textarea rows="5" cols="45" name="message"><?php if (isset($message)){ echo $message;}?></textarea>    <br>       
    <input type="hidden" name="contact_form_completed" value="1" />
    <input type="hidden" name="interest" value="<?php if (isset($interest)){ echo $interest;}?>" />
    <div id="ajax_loading"><img align="absmiddle" src="/img/spinner.gif" style="border:none; margin:0; padding:0;">&nbsp;Processing...</div>               
    <div style="margin-top: 10px;" align="center"><input id="submit" class="inquirebttn" type="image" src="/img/transparent.gif" alt="Make Inquiry" title="Make Inquiry" name="submit" style="border:none;" />
    </p>
    </div>
    
    </form>
    In the sourced javascript page I am trying to grab a php variable and pass it into the JS page for processing. Here is how I try to grab the variable:

    Code:
    function getValue(form) {
    var gcodeben = contact_form.gcodedate.value;
    }
    var exdategc = "";
    
    //if statement to say that if gcode is one of the 5 then print expiry date.
    if (gcodeben="lux")
      {
      exdategc="May 31, 2010";
      }
    else if (gcodeben="trill")
      {
      exdategc="May 31 2010";
      }
    else if (gcodeben="zine")
      {
      exdategc="April 30 2010";
      }
    else if (gcodeben="spv")
      {
      exdategc="June 30 2010";
      }
    else if (gcodeben="golf")
      {
      exdategc="May 31 2010";
      }
    else
      {
      exdategc="(error: expiry date not available)";
      }
    
    
    $('expire').set('html', '<div id="finished" style="text-align:left; font-size:14px; font-weight:normal;">This certificate expires on <span style="font-size:14px; font-weight:normal; color:#ff0000;">'+exdategc+'</span></div>');
    How do I fix the Javascript in order to properly retrieve the correct variable?

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    PHP creates the page.
    The page is sent to the web browser
    The web browser loads the page
    The JavaScript is run on the page.

    The only way to "grab" a php variable is to have PHP explicitly write that variable to the page, for example:

    PHP Code:
    echo 'var jsVariable = "' $phpString '";'
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member
    Join Date
    Apr 2010
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Thank you for the processing hint. So I have revamped my code, but unfortunately the output still does not function.

    Here is a link to the landing page:
    Link to PHP landing page

    Here is the updated code in the form field:
    Code:
    <form id="contact_form" name="contact_form" method="post" action="/process_gcert_form.php">
    <label class="contact">* Certificate Code:</label><input type="text" name="gcode" size="15" value="<?php if ($gcode){ echo $gcode; echo 'var gcodepms = "' . $gcode . '";';}?>"/>
    </form>
    Here is the updated JS code:
    Code:
    function finished()
    {
    $('status').set('html', '<div id="finished" style="text-align:left; font-size:14px; font-weight:normal;">Thank You. Please print this page. You will be contacted by an authorized<br /> Premier Medical Spa Clinic Coordinator via telephone withing 24hrs.</div>');
    $('barcode').setStyle('display', 'block');
    //take in gcode
    var exdategc = "";
    
    //if statement to say that if gcode is one of the 5 then print expiry date.
    if (gcodepms=="lux")
      {
      exdategc="May 31, 2010";
      }
    else if (gcodepms=="trill")
      {
      exdategc="May 31 2010";
      }
    else if (gcodepms=="zine")
      {
      exdategc="May 31 2010";
      }
    else if (gcodepms=="spv")
      {
      exdategc="June 30 2010";
      }
    else if (gcodepms=="golf")
      {
      exdategc="May 31 2010";
      }
    else if (gcodepms=="fedex")
      {
      exdategc="July 31 2010";
      }
    else
      {
      exdategc="(error: expiry date not available)";
      }
    
    
    $('expire').set('html', '<div id="finished" style="text-align:left; font-size:14px; font-weight:normal;">This certificate expires on <span style="font-size:14px; font-weight:normal; color:#ff0000;">'+exdategc+'</span></div>');
    $('status2').set('html', '<div id="finished" style="text-align:left; font-size:12px; font-weight:normal;">One per client only. This certificate may be used towards any laser aesthetic service at Premier Medical Spa. May not be redeemed or exchanged for cash*</div>');
    }
    Any ideas why the last two divs are not showing? in the previous format they were showing, but not anymore. Everything up until the if statement is being output.

  4. #4
    SitePoint Member
    Join Date
    Apr 2010
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok So there is a correction to be made: I had to put the "echo 'var gcodepms = "' . $gcode . '";'; on the php landing page which shows up in the uirl so basicaly the apge that keeps includign aall of the necessary fiels (aka the landing page). However, now all it does show output ont he screen that says:
    var gcodepms = "";


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •