Load selected JS depending on a checkbox on form

Forums General discussion Load selected JS depending on a checkbox on form

Viewing 5 reply threads
  • Author
    Posts
    • #24837
      Eddie Pryce
      Participant

      Is it possible to load custom JS depending on on a checkbox being selected in a tab?
      I have some custom JS that works as a cascading dropdown but i need to add in some more code but i only want the new JS to load if i have checked a box and the old code to stop working

      • This topic was modified 10 months, 2 weeks ago by Eddie Pryce.
    • #24862
      Alexander Bautz
      Keymaster

      You should be able to do this by triggering a function either on page load (by checking the value in the checkbox) or by a rule triggering on the checkbox. What kind of code is it you want to cancel, and what is it you like to trigger?

      Alexander

    • #24866
      Eddie Pryce
      Participant
      
      
      jQuery(document).ready(function ()  
      {
           jQuery().SPServices.SPCascadeDropdowns(  
          {  
              relationshipList: "Contact",  
              relationshipListParentColumn: "Account",  
              relationshipListChildColumn: "Full_x0020_Name", 
              parentColumn: "Account",  
              childColumn: "Contact",  
              debug: true  
          });
          
          jQuery().SPServices.SPCascadeDropdowns(  
          {  
              relationshipList: "Machine",  
              relationshipListParentColumn: "Account",  
              relationshipListChildColumn: "Title", 
              parentColumn: "Account",  
              childColumn: "Machine",  
              debug: true  
          });
          
          jQuery().SPServices.SPCascadeDropdowns(  
          {  
              relationshipList: "Site",  
              relationshipListParentColumn: "Account",  
              relationshipListChildColumn: "Title", 
              parentColumn: "Account",  
              childColumn: "Site",  
              debug: true  
          });
          
          jQuery().SPServices.SPCascadeDropdowns(  
          {  
              relationshipList: "Area",  
              relationshipListParentColumn: "Account",  
              relationshipListChildColumn: "Title", 
              parentColumn: "Account",  
              childColumn: "Area",  
              debug: true  
          });
          
          jQuery().SPServices.SPCascadeDropdowns(  
          {  
              relationshipList: "Project",  
              relationshipListParentColumn: "Account",  
              relationshipListChildColumn: "Title", 
              parentColumn: "Account",  
              childColumn: "Project",  
              debug: true  
          });
          
          
          
      });

      This is my current code and i need this to stop and a similar set of code to load depending on a checkbox but there will be 3 check-boxes each to load different JS,

      im not really clued up on JS but i managed to get the above working the way i need it to

    • #24868
      Alexander Bautz
      Keymaster

      If the checkbox is checked when the page loads you can use something like this (expecting the checkbox to be boolean Yes/No):

      if(getFieldValue("NameOfYourCheckbox"){
         // Is checked - run your code here
      }else{
         // Not checked - run your alternative code here.
      }

      Alexander

    • #24980
      Eddie Pryce
      Participant

      So i managed to get this semi working, but i have an if statement with 2 else ifs in it that selects code depending on which option is selected from a dropdown but its only allows the first selection to run then will stop working if the dropdown is changed.

      Is there a way to stop this happening ? i know users will select the wrong dropdown and will have to refresh the page to get it working again(already been told i need to change this) if i run an unbind or off in the jquery it stops the rule from taking effect as well

      
      
      // Hook into change event 
      jQuery("select[title='Create Case By']").on("change", function() {
          
          //reset
          //$("select[title='Create Case By']").unbind();
          
          
        if(jQuery("select[title='Create Case By']").val() == "Account") {
            jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Contact",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Full_x0020_Name", 
      			parentColumn: "Account",  
      			childColumn: "Contact",  
      			debug: true  
      		});
      		
      		jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Project",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Project",  
      			debug: true  
      		});
          
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Site",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Site",
      			debug: true  
      		});
              
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Area",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Area",			
      			debug: true  
      		});
      		
      		
      		
      		jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Machine",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Machine",  
      			debug: true  
      		});
      		
              }   
              
         else if (jQuery("select[title='Create Case By']").val() == "Contact") {
             
             jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Contact",  
      			relationshipListParentColumn: "Full_x0020_Name",  
      			relationshipListChildColumn: "Account", 
      			parentColumn: "Contact",  
      			childColumn: "Account",  
      			debug: true  
      		});
      		
      		jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Project",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Project",  
      			debug: true  
      		});
          
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Site",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Site",
      			debug: true  
      		});
              
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Area",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Area",			
      			debug: true  
      		});
      		
      		
      		
      		jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Machine",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Account",  
      			childColumn: "Machine",  
      			debug: true  
      		});
      		
      		jQuery('select[title="Contact"]').on("change", function() {
      			jQuery('select[title="Account"] :nth-child(2)').prop('selected', true);
      		});
      		
              }
          else if(jQuery("select[title='Create Case By']").val() == "Project") {
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Contact",  
      			relationshipListParentColumn: "Account",  
      			relationshipListChildColumn: "Full_x0020_Name", 
      			parentColumn: "Account",  
      			childColumn: "Contact",  
      			debug: true  
      		});
      		
      		jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Account",  
      			relationshipListParentColumn: "Project",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Project",  
      			childColumn: "Account",  
      			debug: true  
      		});
          
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Site",  
      			relationshipListParentColumn: "Project",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Project",  
      			childColumn: "Site",
      			debug: true  
      		});
              
              jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Area",  
      			relationshipListParentColumn: "Project",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Project",  
      			childColumn: "Area",			
      			debug: true  
      		});
      		
      		
      		
      		jQuery().SPServices.SPCascadeDropdowns(  
      		{  
      			relationshipList: "Machine",  
      			relationshipListParentColumn: "Project",  
      			relationshipListChildColumn: "Title", 
      			parentColumn: "Project",  
      			childColumn: "Machine",  
      			debug: true  
      		});
      		
      		//Auto select the first item in the list to override the default "(None)"
      		jQuery('select[title="Project"]').on("change", function() {
      			jQuery('select[title="Account"] :nth-child(2)').prop('selected', true);
      		});
      		
      		//Auto select the first item in the list to override the default "(None)"
      		jQuery('select[title="Project"]').on("change", function() {
      			jQuery('select[title="Site"] :nth-child(2)').prop('selected', true);
      		});
      
      		//Auto select the first item in the list to override the default "(None)"
      		jQuery('select[title="Project"]').on("change", function() {
      			jQuery('select[title="Area"] :nth-child(2)').prop('selected', true);
      		});
      
      		//Auto select the first item in the list to override the default "(None)"
      		jQuery('select[title="Project"]').on("change", function() {
      			jQuery('select[title="Machine"] :nth-child(2)').prop('selected', true);		
              });
      		
      		}	
        });

      i knows this might not be the most effective way to do this but it was the first way i could get working how we need it to work other than the issue im having

    • #24998
      Alexander Bautz
      Keymaster

      The code looks technically right. Does the code run to the correct if / else when you change it (if you add an alert or a console.log)?

      If it does it may be an issue with reset of the SPServices cascading dropdown. I don’t know this solution so I cannot tell if it can be reset when it has first been applied – you will have to check this with the user manual for this solution.

      Alexander

Viewing 5 reply threads
  • You must be logged in to reply to this topic.