CODEWITHSUNDEEP
htmlforms
jrad
jrad

Reputation: 3190

HTML form action on part of form

I'm making a form and want something to happen when just a certain part of the form has been completed. I've got some checkboxes, a dropdown menu, and three read-only text fields. I need something to pop up when the checkboxes and dropdown fields have been populated, but have no idea how to do this. I tried putting a form within a form, but after that failed and I later read up on the matter, I found that to be impractical. Anyhow, here's my code for the form:

<form action="http://siedb1.sys.virginia.edu/~jhr3ct/Code/Reserve%20Confirmation.php">
        Facility: <input type="checkbox" name="facility" value="AFC">AFC
        <input type="checkbox" name="facility" value="Memorial Gym">Memorial Gym
        <input type="checkbox" name="facility" value="Slaughter">Slaughter
        <input type="checkbox" name="facility" value="North Grounds">North Grounds<br>
        Type of Room/Court: 
        <select>
            <option value="default">Choose room...</option>
            <option value="squash">Squash</option>
            <option value="handball">Handball</option>
            <option value="racquetball">Racquetball</option>
            <option value="multipurpose">Multipurpose</option>
        </select><br>
        Room: <input type="text" name="start" readonly="readonly"><br>
        Start Time: <input type="text" name="start" readonly="readonly"><br>
        End Time: <input type="text" name="end" readonly="readonly"><br><br>
        <input id="submit" type="submit" value="Submit">
    </form>

Thanks for the help!

Upvotes: 0

Views: 199

Answers (3)

prageeth
prageeth

Reputation: 7395

If you need to show a popup after all check boxes are checked and the dropdown is changed add this kind of a function to the onclick events of all the check boxes and onchange event of the dropdown box.

function func() {
      var inputTags = document.getElementsByTagName('input');
      var dropdowns = document.getElementsByTagName('SELECT');
      for (var i = 0; i < inputTags.length; i++) {
          if (inputTags[i].type == 'checkbox') {
             var aCheckBox = inputTags[i];
             if(!aCheckBox.checked) {
                return;
             }
         }
      }
      if(dropdowns[0].value == 'default') {
          return;
      }
      alert("All checkboxes and dropdowns are filled.");
}

<form action="../Confirmation.php">
     <input onclick="func()" type="checkbox" name="facility" value="AFC">AFC
     <input onclick="func()" type="checkbox" name="facility"
                   value="Slaughter">Slaughter
     <select onchange="func()" id="ss">
</form>

Upvotes: 1

Jean
Jean

Reputation: 772

Just to point you in the right direction: You will have to use javascript to check your form inputs values, and to show a pop-up window.

You could use jQuery to do that easily, and make a listener for the form submit() action, where you could check if your checkboxes and dropdown are selected.

The jQuery doc is here: http://api.jquery.com/submit/

Upvotes: 0

Jeff B.
Jeff B.

Reputation: 1167

You might be interested in learning basic javascript form events. There is many tutorials on internet. I suggest you this one: http://www.javascriptkit.com/jsref/select.shtml

Upvotes: 5

Related Questions