Skip to main content
Nintex Community Menu Bar

Service Calendar Scheduler - Limit Date Picker based on Choice

  • March 25, 2019
  • 5 replies
  • 28 views

Forum|alt.badge.img+1

I am trying to create a Service Request Scheduler. I would like to Limit the Date Picker based on Service Drop-Down. 

 

For example; If I only do Oil Changes on Monday. When the user selects Oil Change from the Service type field, I only want Mondays to be selectable in the Date Picker. If a user selects Brake Repair, I only want Tuesday - Thursday selectable. Additionally, I need to limit the hours selectable to between 10am and 4pm, in 1 hour increments. 

5 replies

Forum|alt.badge.img+1

More or less figured it out. Here's the form script based on other work found in the forums.

The first part limits the hours in the time picker and the other functions limit the dates selectable in the date picker.

NWF$("select[name$='Hours'] option").each(function(){
     if(NWF$(this).val().match(/^(([1-9]|12) AM)|(([5-9]|1[0-1]) PM)/g)) {
          NWF$(this).remove();
     }
});
NWF.FormFiller.Events.RegisterAfterReady(function () {  
    NWF$('#' + Service).change(function(evt){
        switch(evt.target.value){
            case 'Oil Change' :
            NWF$('#' + dateCtrl).datepicker('option',{
            beforeShowDay: function(currDate){
                   if(currDate.getDay() == 1 )
                         return [true,""];
                   return [false,""];
     }
     })
                break;
 
         }
    });
    NWF$('#' + Service).change(function(evt){
        switch(evt.target.value){
            case 'Brake Repair' :
            NWF$('#' + dateCtrl).datepicker('option',{
            beforeShowDay: function(currDate){
                   if(currDate.getDay() == 5 )
                         return [true,""];
                   return [false,""];
     }
     })
                break;
 
         }
    });
 
    NWF$('#' + Service).change(function(evt){
        switch(evt.target.value){
            case 'Tire Repair' :
            NWF$('#' + dateCtrl).datepicker('option',{
            beforeShowDay: function(currDate){
                   if(currDate.getDay() == 2 || currDate.getDay() == 3 || currDate.getDay() == 4 )
                         return [true,""];
                   return [false,""];
     }
     })
                break;
 
         }
    });

Forum|alt.badge.img+2

Hey @hotwheelzffx , I got a form very similar to what you have.  I can't get your code to work.  I'm using Nintex Forms 2013 Version 2.11.9.0.  Is that you complete code or is it messing additional code?


Forum|alt.badge.img+1
  • Author
  • November 10, 2020

You might just be missing an extra '}):'

at the end of the code.

Make sure your form fields have JavaScript Client IDs filled out and matching your code.


Forum|alt.badge.img+2

Yup, I noticed that and added the missing });, but no luck.


Forum|alt.badge.img+1
  • Author
  • November 10, 2020

I re-created this app from scratch. The only differences between what I originally posted was the missing }); and maybe killing the space after "function" NWF.FormFiller.Events.RegisterAfterReady(function()