Link to home
Start Free TrialLog in
Avatar of msgl
msgl

asked on

Validate differet fields depending on what is selected in a dropdown in a form with jQuery?

I have the following code to validate some fields on a sharepoint newform.aspx. To not submit the form in sharepoint I must return a false statement to the default function PreSaveItem.

Validation:
//bind a change event to all controls to validate
      $("input[title=Target Date],input[id$=UserField_hiddenSpanData],input[title=Start Date],select[title=Strategic Objective],select[title=Strategic

Priority]").change(function(){
            checkControls()
      });

      //the change event function - check the status of each control
      function checkControls(){

      //set a variable to count the number of valid controls
      var controlsPassed = 0;

      //set up a selector to pick .each() of the target controls
      $("input[title=Target Date],input[id$=UserField_hiddenSpanData],input[title=Start Date],select[title=Strategic Objective],select[title=Strategic

Priority]").each(function(){

            //if the control value is not zero AND is not zero-length
            var txt = $('#ctl00_m_g_c6ae303a_6013_4adb_8057_63a214bcfd24_ctl00_ctl00_UserField_hiddenSpanData').val();
            var val = $(this).val();
            if($(this).is(':hidden') || (val != 0 && val.length != 0 && txt.length != 0)) {

                  //add one to the counter
                  controlsPassed += 1;
            }

            });

      //call the PreSaveItem function and pass the true/false statement of 5 valid controls

return (controlsPassed == 5)

      }
          function PreSaveItem() {
                return checkControls()
         }


I want to validate different elements depending on what I have selected in a dropdown list called Item Level.

I get the values from Item Level with:

            $("select[title='Item Level']").change(function() {
            var itemLevel = $(this).val();            
            if (itemLevel == "Strategic Objective") {


            alert(itemLevel);
            }
            if (itemLevel == "Strategic Priority") {


            alert(itemLevel);
            }
            if (itemLevel == "Milestone Action") {


            alert(itemLevel);
            }
            if (itemLevel == "Performance Measure") {


            alert(itemLevel);
            }

            });

I thought it would be easy to just chuck the validation code into the if's but it doesn't work.

For example:

            $("select[title='Item Level']").change(function() {
            var itemLevel = $(this).val();            
            if (itemLevel == "Strategic Objective") {


            alert(itemLevel);
            }
            if (itemLevel == "Strategic Priority") {


            alert(itemLevel);
            }
            if (itemLevel == "Milestone Action") {
            //bind a change event to all controls to validate
      $("input[title=Target Date],input[id$=UserField_hiddenSpanData],input[title=Start Date],select[title=Strategic Objective],select[title=Strategic

Priority]").change(function(){
            checkControls()
      });

      //the change event function - check the status of each control
      function checkControls(){

      //set a variable to count the number of valid controls
      var controlsPassed = 0;

      //set up a selector to pick .each() of the target controls
      $("input[title=Target Date],input[id$=UserField_hiddenSpanData],input[title=Start Date],select[title=Strategic Objective],select[title=Strategic

Priority]").each(function(){

            //if the control value is not zero AND is not zero-length
            var txt = $('#ctl00_m_g_c6ae303a_6013_4adb_8057_63a214bcfd24_ctl00_ctl00_UserField_hiddenSpanData').val();
            var val = $(this).val();
            if($(this).is(':hidden') || (val != 0 && val.length != 0 && txt.length != 0)) {

                  //add one to the counter
                  controlsPassed += 1;
            }

            });

      //call the PreSaveItem function and pass the true/false statement of 5 valid controls

return (controlsPassed == 5)

      }
          function PreSaveItem() {
                return checkControls()
         }


            alert(itemLevel);
            }
            if (itemLevel == "Performance Measure") {


            alert(itemLevel);
            }

            });

and in the item level item Strategic Objective validate some other elements. Any ideas?

Thanks in advance.
ASKER CERTIFIED SOLUTION
Avatar of LeicaLouie
LeicaLouie

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of msgl
msgl

ASKER

solved my problem