2 Replies - 445 Views - Last Post: 02 October 2014 - 09:25 AM

#1 robp2175  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 1
  • Joined: 02-October 14

To execute or not execute Jquery Script Based On Form Selection

Posted 02 October 2014 - 05:25 AM

I have a jquery script that validates an email field in my form. This script makes sure the form accepts only email addresses ending with a certain domain. However, I have another field in my form where a user identified if they are staff, faculty, or other. If they choose other, I want to forego the email validation and let the user enter any valid email address. Here is some of my relevant code. Any help is greatly appreciated.


The Jquery


    <script>
    $.validator.addMethod(
            "regex",
            function(value, element, regexp) {
                var re = new RegExp(regexp);
                return this.optional(element) || re.test(value);
            }, "<span class='error2'>You must use your EMCC email address.</span>"
    );
        $().ready(function() {
            // validate the comment form when it is submitted
            $("#commentForm").validate();

            // validate signup form on keyup and submit
            $("#helpdeskform").validate({
                rules: {
                    fullname: "required",
                    fullname: {
                        required: true,
                        minlength: 2
                    },
                    tickettitle: {
                        required: true,
                        minlength: 5
                    },
                    schoolid: {
                        required: true,
                        minlength: 7
                    },
                    phone: {
                        required: true,
                        phoneUS: true
                    },
                    password: {
                        required: true
                    },
                   
                    email: {
                        required: true,
                        email: true,
                        regex: '^[a-zA-Z0-9_.+-][email protected]|student.emcc.edu+$'
                    },
                    agree: "required"
                },
                messages: {
                    fullname: {
                        required: "This field is required",
                        minlength: "Please enter your name"
                    },
                    tickettitle: {
                        required: "This field is required",
                        minlength: "Please enter a brief description of the problem"
                    },
                    schoolid: {
                        required: "This field is required",
                        minlength: "This ID Number Is Invalid"
                    },
                    phone: {
                        required: "This field is required",
                        minlength: "Please enter your name"
                    },
                    password: {
                        required: "Please provide your computer password"
                    },
                    email: {
                    required: "Please enter a valid email address",
                    },
                    agree: "Please accept our policy"
                }
            });

            // propose username by combining first- and lastname
            $("#username").focus(function() {
                var firstname = $("#firstname").val();
                var lastname = $("#lastname").val();
                if (firstname && lastname && !this.value) {
                    this.value = firstname + "." + lastname;
                }
            });

            //code to hide topic selection, disable for demo
            var newsletter = $("#newsletter");
            // newsletter topics are optional, hide at first
            var inital = newsletter.is(":checked");
            var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
            var topicInputs = topics.find("input").attr("disabled", !inital);
            // show when newsletter is checked
            newsletter.click(function() {
                topics[this.checked ? "removeClass" : "addClass"]("gray");
                topicInputs.attr("disabled", !this.checked);
            });
        });
    </script>



The HTML (Relevant Code is in bold)

  <form method="post" id="helpdeskform" name="helpdeskform" action="tracking.injector2.php">
       <input type="hidden" name="_type" value="Helpdesk" />
       <input type="hidden" name="_auto_import" value="1" />
        <input type="hidden" name="urgency" value="3" />
       <div id="title" style="width: 880px; box-shadow: 5px 5px 5px #B3ACAC; color:white; font-size:24px; padding:10px 0 10px 0 ;text-align:center; margin: 0 0 10px 0; background-color:#23659F;-moz-border-radius:15px; border-radius: 15px;  -webkit-border-radius: 15px; ">Helpdesk Support Form</div>
             
              <fieldset style="width: 860px; box-shadow: 5px 5px 5px #B3ACAC; -moz-border-radius:15px; border-radius: 15px;  -webkit-border-radius: 15px; border: 2px #000 solid;"><legend><label for="ticketdetails" style="font-size:18px;">Ticket Details:</label></legend>
              <table width="760" border="0" style="margin: 0 20px 0 20px;">
            <tbody>
            <tr><td colspan="5">
            <tr valign="top" >
                <td  style="height: 40px; "><label for="date">Date Recd:</label></td>
                <td><?php $date = date('m/d/Y'); echo $date; ?></td>
                <td style="width:120px;"><label for="name">EMCC ID #:</label><span class="required">*</span></td>
                <td><input type="schoolid" name="schoolid" id="schoolid" size="30"></td>
              </tr>
              <tr valign="top">
                <td style="width:110px; height: 40px;"> <label for="name">Name:</label><span class="required">*</span></td>
                <td  style="width:250px;"><input type="text" name="fullname" id="fullname" class="input"></td>
                <td id="colRight" valign="top"><label for="phone">Phone:</label><span class="required">*</span></td>
                <td valign="top"><input type="phone" name="phone" id="phone" size="30"></td>
              </tr>
              <tr valign="top">
                <td valign="top" style="height: 50px;"><label for="email">Email:</label><span class="required">*</span>
                </td>
                <td valign="top"><input type="text" name="email" id="email" size="30"></td>
                <td valign="top"><label for="password">Computer Password:</label><span class="required">*</span></td>
                <td valign="top"><input type="password" name="password" id="password" size="30"></td>
              </tr>
              <tr>
                <td>&nbsp;</td>
                <td>&nbsp;</td>
                <td>&nbsp;</td>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td><label for="user">Choose One:</label></td>
                [b]<td>
                  <select name="user" id="user">
                    <option value="student" selected="selected">Student</option>
                    <option value="staff">Staff</option>
                    <option value="faculty">Faculty</option>
                    <option value="other">Other</option>
                </select></td>[/b]
                <td><label for="power">Power Pack Left?</label></td>
                <td>
                  <select name="power" id="power">
                    <option value="no">No</option>
                    <option value="yes">Yes</option>
                </select></td>
              </tr>
              <tr>
                <td>&nbsp;</td>
                <td>&nbsp;</td>
                <td><label for="drive">Flash/Ext HDD</label></td>
                <td><select name="drive" id="drive">
                    <option value="no">No</option>
                    <option value="yes">Yes</option>
                </select></td>
              </tr>
              <tr>
                <td>&nbsp;</td>
                <td colspan="3">&nbsp;</td>
              </tr>
              <tr>
                <td colspan="4"><label for="tickettitle">Brief Description Of Problem:</label><span class="required">*</span>&nbsp;&nbsp;<input name="name" type="text" class="tickettitle" id="tickettitle" style="width: 500px;"></td>
              </tr>
              <tr>
                <td colspan="2">&nbsp;</td>
                <td>&nbsp;</td>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td colspan="2"><label for="content">Detailed Description Of The Problem:</label></td>
                <td>&nbsp;</td>
                <td></td>
              </tr>
              <tr>
                <td colspan="4">
                <textarea name="content" id="problem" class="textarea" style="width:800px;"></textarea></td>
              </tr>
              <tr>
                <td colspan="2" align="left"><span class="required">* Required Field</span></td>
              
                <td>&nbsp;</td>
                <td align="right"><input type="submit" name= 'add' value="Submit" /></td>
              </tr>
              </tbody></table>
              </fieldset>


Is This A Good Question/Topic? 0
  • +

Replies To: To execute or not execute Jquery Script Based On Form Selection

#2 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2343
  • View blog
  • Posts: 9,400
  • Joined: 03-December 12

Re: To execute or not execute Jquery Script Based On Form Selection

Posted 02 October 2014 - 05:40 AM

If I am understanding correctly, you want to validate their role first. Then, only call the function if they do not fit the specified roles. Make an array of the roles that are exempt and if the user type is not in the array call the function.
Was This Post Helpful? 0
  • +
  • -

#3 ArtificialSoldier  Icon User is online

  • D.I.C Lover
  • member icon

Reputation: 1842
  • View blog
  • Posts: 5,793
  • Joined: 15-January 14

Re: To execute or not execute Jquery Script Based On Form Selection

Posted 02 October 2014 - 09:25 AM

If you want to use that validator structure then you probably need to make a custom validation function to get the select value and test that first, then test the email against one of two regular expressions.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1