Adding options in choice fields dynamically in Nintex forms 2013

  • 23 November 2017
  • 9 replies
  • 70 views

Badge +3

I have a requirement where i need to calculate last 10 week ending dates of the week(Saturday) and the future Week end dates of the current year in a drop down on new form load.

I have the calculation for SP column to get current week end date as "=Today-WEEKDAY(Today,3)+5"

Is there a way where i can loop through previous 10 week end dates and then next week end dates by subtracting and adding 7 to current week end dates through JS?

What function can i use to calculate. I'm a beginner in JS.


9 replies

Userlevel 6
Badge +13

Another easy way to populate the choices in a choice control is to add the value from an item property. So you could use calculated columns (10 in this case to create each of your values and then add these column references in your choice control options. Or alternatively use workflow to populate the 10 choices into a single multi line text column and add that single column reference to your choice control.

Just a no code alternative for you. I accept JS will be a cleaner solution but I always try and avoid code where I can so my clients can support it easier after I leave.

Badge +3

But this will not be feasible for my solution as it needs the future week ending dates of the current year as well. Using a workflow to do all the math would be a risky option as i need the functionality on form load(Unless i update the values in another list and schedule those options to refresh everyday with a site WF and use it as a lookup).

So i am looking for a JS solution.

Badge +3

i developed a solution which populates the dates as needed. But the same is not submitting for some reasons (An unexpected error has occured). ‌ 

NWF$(document).ready(function () {
var curr = new Date;
var first = curr.getDate() - curr.getDay();
var last = first + 6;
var lastDay = new Date(curr.setDate(last));
//to log current week end date in mm/dd/yyyy format
var lastDayDate = lastDay.getDate();
var lastDayMonth = lastDay.getMonth() + 1;
var lastDayYear = lastDay.getFullYear();
var currentYear = lastDay.getFullYear();
//get previous 10 weekend dates and log in mm/dd/yyyy format
for(var i=0; i<10; i++)
{
var prevWeekend = lastDay.getDate()-7;
lastDay = new Date(curr.setDate(prevWeekend));
lastDayDate = lastDay.getDate();
lastDayMonth = lastDay.getMonth() + 1;
lastDayYear = lastDay.getFullYear();
lastDayFormatted = (lastDayMonth) + '/' + lastDayDate + '/' + lastDayYear;
// console.log(lastDayFormatted);
NWF$("#"+ddlDates).append ("<option value="+lastDayFormatted+">" + lastDayFormatted + "</option>");
}
// to get next week end dates for current year
curr = new Date;
lastDay = new Date(curr.setDate(last));
lastDayDate = lastDay.getDate();
lastDayMonth = lastDay.getMonth() + 1;
lastDayYear = lastDay.getFullYear();
lastDayFormatted = lastDayMonth + '/' + lastDayDate + '/' + lastDayYear;
// console.log(lastDayFormatted);
NWF$("#"+ddlDates).append ("<option="+lastDayFormatted+">" + lastDayFormatted + "</option>");
for(i=0; i<53; i++)
{
var nextWeekend = lastDay.getDate()+7;
lastDay = new Date(curr.setDate(nextWeekend));
lastDayDate = lastDay.getDate();
lastDayMonth = lastDay.getMonth() + 1;
lastDayYear = lastDay.getFullYear();
if (currentYear==lastDayYear)
{
lastDayFormatted = lastDayMonth + '/' + lastDayDate + '/' + lastDayYear;
// console.log(lastDayFormatted);
NWF$("#"+ddlDates).append ("<option="+lastDayFormatted+">" + lastDayFormatted + "</option>");
}
else
{
break;
}
}
});

Userlevel 5
Badge +14

If you're trying to dynamically update the selection of options in an actual Choice Control on a Nintex Form, it will not work. 

It generates the 'acceptable' range of values (those are, the choices that exist when the control was generated), and anything other than that, should ideally throw an error, which it does. 

If you want to dynamically create some type of selection, I would recommend maybe creating a Rich Text control which is populated with an actual <select> html element that you can manipulate to your heart's content, and subsequently attach an event to which pushes the value of whatever is inside of that control to a single line text, or calculated control, which doesn't have the restriction of being defined beforehand. 


Userlevel 5
Badge +14

wouldn't it be easier to use regular date picker and configure it to allow select just Saturdays within range of  -10weeks and +1week?

212317_pastedImage_1.png

212323_pastedImage_4.png

212322_pastedImage_3.png

Badge +3

Interesting, Can you please help me in knowing hoe to configure that?

Userlevel 5
Badge +14

it's quite easy, some 5 line of code laugh.png

NWF.FormFiller.Events.RegisterAfterReady(function (){
   NWF$('#' + dateCtrl).datepicker('option',{
       beforeShowDay: function(currDate){
           if(currDate.getDay() == 6 )
               return [true,""];
           return [false,""];
       },
       minDate: -10*7,
       maxDate: +2*7,
   })
})
Badge +11
Interesting :)

Now, what needs changing to make it fit only for weekdays [Mon to Friday]
As well as to be able to select only from today and onwards.
Badge +11

I got it, after some research

To show Monday to Friday and starting from today's date:

 

NWF.FormFiller.Events.RegisterAfterReady(function (){
   NWF$('#' + dateCtrl).datepicker('option',{
  minDate: 0,  
  maxDate: '0+30',  
  beforeShowDay: NWF$.datepicker.noWeekends,  
  onSelect: function(datestr){  
  startdate = $(this).datepicker('getDate');  
 }});  
});

 

I have limited to show next 30 working days by maxDate
Otherwise you can say maxDate: '+1y' to show 1 year worth of dates.

 

Hint: the 30 days are including the weekends lol

So if you want 30 working days then you need to add + weekend days.

 

 

 

Reply