Odd Form Submission

[Xtremer360]

I'm trying to figure out where my problem is. Its not submitting my form. I'm getting the alert but when it submits it does the url?variables=whatever deal.

 

<?php require ('php/eventnames.php'); ?>
    
<script type="text/javascript" src="forms/addnew/js/eventnames.js"></script>

<!-- Form -->
<form action="#" id="eventNameForm" >
    <fieldset>
    	<legend>Add New Event Name</legend>
            <div class="field required">
        		<label for="eventName">Event Name</label>
        		<input type="text" class="text" name="eventName" id="eventName" title="Event Name"/>
        		<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
        	</div>
            <div class="field required">
        		<label for="shortName">Event Short Name</label>
        		<input type="text" class="text" name="shortName" id="shortName" title="Event Short Name"/>
        		<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
        	</div>
            <div class="field required">
        		<label for="eventType">Event Type</label>
                <select class="dropdown" name="eventType" id="eventType" title="Event Type">
                    <option value="">- Select -</option>
                    <?php
                        $eventTypes = array('Singular', 'Recurring', 'Pay Per View');
                        foreach($eventTypes as $et):
                    ?>        
                        <option value="<?php echo $et; ?>"><?php echo $et; ?></option>
                    <?php endforeach; ?>
                </select>
        		<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
        	</div>
            <input type="hidden" name="userID" id="userID" value="<?php echo $userID; ?>" />      
            <input type="submit" class="submit" name="submitEventName" id="submitEventName" title="Submit Event Name" value="Submit Event Name"/>
</fieldset>
</form>
<!-- /Form -->

<!-- Messages -->
<div class="message message-error">
    <h6>Required field missing</h6>
    <p>Please fill in all required fields. </p>
</div>
<div class="message message-success">
    <h6>Operation succesful</h6>
    <p>Content Page was added to the database.</p>
</div>

 

$(document).ready(function() {
     $('div.message-error').hide();
     $('div.message-success').hide();
     alert("Test Alert!");
     ("#eventNameForm").validate({ 
         rules: {
             eventName: {
                 required: true
             },
             shortName: {
                 required: true
             },
             eventType: {
                 required: true,
                 rangelength: [1]
             }
         },
         messages: {
             eventName: "Please enter the event name!",
             shortName: "Please enter the event's short name!",
             eventType: "Please enter the event type!"
         },
         submitHandler: function(form) {
             var userID = $("input#userID").val();
             var eventName = $("input#eventName").val();
             var shortName = $("input#shortName").val(); 
             var eventType = $("select#eventType").val();
             var dataString = 'userID=' + userID + '&eventName=' + eventName + '&shortName=' + shortName + '&eventType=' + eventType + '&submitEventName=True';
             $.ajax({
                 type: "POST",
                 url: "processes/eventnames.php",
                 data: dataString,
                 success: function(myNewVar) { 
                     if (myNewVar == 'good') {
                         $('div.message-error').hide();
                         $("div.message-success").html("<h6>Operation successful</h6><p>" + eventName + " Page saved successfully.</p>");
                         $("div.message-success").show().delay(10000).hide("slow");
                         $(':input','#eventNameForm')
                         .not(':submit, :hidden')
                         .val(''); 
                     } else if (myNewVar == 'bad1') {
                         $('div.message-success').hide();
                         $("div.message-error").html("<h6>Operation unsuccessful</h6><p>" + eventName + " already exists in the database.</p>");
                         $("div.message-error").show();    
                     } else if (myNewVar == 'bad2') {
                         $('div.message-success').hide();
                         $("div.message-error").html("<h6>Operation unsuccessful</h6><p>" + shortName + " already exists in the database.</p>");
                         $("div.message-error").show();     
                     } else if (myNewVar == 'bad3') {
                         $('div.message-success').hide();
                         $("div.message-error").html("<h6>Operation unsuccessful</h6><p>" + eventName + " and " + shortName + " already exists in the database.</p>");
                         $("div.message-error").show();     
                     } 
                 }
             });
             return false; 
         }   
     });
});

[Xtremer360]

Issue was fixed I forgot to put a $ in front of the ("#eventNameForm").validate({

 

however can someone tell me how I can get my validation plugin to see there there is a selection being made to my dropdown and to not report it as an error.

[cunoodle2]

Are you getting an error message of any kind?

[Xtremer360]

No. Basically when I click submit its still saying that there isn't a choice being made with my dropdown which is the eventType. And there is a selection made.