Javascript will not execute

software development

#1

Newb to javascript and php. I spent yesterday afternoon trying to figure out why the blocks of javascript I put in a file containing php and html are just being completely ignored.

Only the onChange() in the following form works, and that’s only if I put an alert(); in there, if I put a call to any of the functions in my script nothing happens. It’s as if the entire script is invisible other than that one part.

I’ve omitted the rest of the code on the page and only included the form and the javascript which is related to it. It’s supposed to disable the submit button until something is entered into all the fields on the form, and also change what is available in the 2nd dropdown based on what’s chosen in the first.

<?php if(!isset($_POST['submitinformation'])){ ?>
<form name = "NewCharacterInfo" action="<?php echo $_SERVER['PHP_SELF']?>" method = "post">
  
  <p> Thy manner of beard <br/>
        
  <select name="beardclass" id="beardclass" onChange="disableRoles(this.selectedIndex);">
    <option value="mountaineer">Mountaineer</option>
    <option value="riker">Riker</option>
    <option value="goatee">Goatee</option>
    <option value="gunslinger">Gunslinger</option>
    <option value="lemoustache">Le Moustache</option>
    <option value="beardless">Beardless</option>
    <option value="madmanspatches">Madman's Patches</option>
  </select>
    
    
  </p>
  
  
  <p>
    
    The role of thy beard <br/>
    
  <select name="beardroleselect" id = "beardroleselect">
   <option value="tank">Tank - Able to withstand massive punishment</option>
   <option value="beardmancer">Beardmancer - Attuned to the mystical powers of your beard</option>
   <option value="bandito">Bandito - Cunning and guile are your greatest assets</option>
  </select>
  
  </p>
  
  <p>
    
    Please choose the name thy deeds shall be attributed to <br/>
        
  <input type="text" input id = "username" input name = "username" maxlength = 15>
  
  </p>
  
  <p>
    
    Enter an valid email address for your beard account <br/>
    
  <input type="text" input id = "email" input name = "email">
  
  </p>
  
  <p>
    
    Enter a password between 6 and 25 characters in length <br/>
    
  <input type="text" input id = "password" input name = "password" maxlength = 25>
  
  </p>
  
  <p>
    
  <input type="submit" input id = "submitinformation" input name="submitinformation"  value = "Choose this Beard Path">
  
  </p>
  
  
  
</form>

#2

You are trying to use features of the JQuery library (jquery.com) without first loading jQuery. Stick a tag to load jQuery into your document’s .

Also, unrelatedly but worth mentioning: the tag has been deprecated for over a decade, and is unsupported by most browsers. Use a CSS stylesheet instead.


#3

Thanks for the advice, I was missing a call to JQuery. Even with the JQuery.js in place in the program and the call to it in the header:

I still have the same result of script being totally ignored when I load the browser page. I tried moving the script around, out of the header, into the body before the form, after the form, and no matter what I do it’s as if the code is totally invisible. I feel like there must be something simple I’m missing.

The above line should call the disableRoles function, which never gets called. I stuck an alert(i); as a line in there in the hopes that it would pop-up with the selected index of the choice from the first dropdown as a way for me to see that the function is actually being called, and I never saw this alert.

As a test to ensure java was wasnt being blocked by my browsers (Firefox and Chrome) I tried this, which works fine, and produces the pop-up alert:


#4

Check your browser’s JavaScript console for error messages. Chances are that there’s something in there throwing an error.


#5

JavaScript console? What is this you speak of?

In seriousness I didn’t realize these were built in to my browser already, until you mentioned it and I looked for it. Takin’ novice to a whole new level here. Turned up the error, sure enough.

} else if {i == 1){ //Riker
beardroleselect.options[0].disabled = true;
beardroleselect.options[1].disabled = false;
beardroleselect.options[2].disabled = false;
} else if {i == 2){ //Goatee

A bunch of { where there should be ) broke most the script, while preserving the rest of the program. With that out of the way, worked just fine.