9.06 Get the future date in required format in SAP

Prerequisites

• Products: Liquid UI WS, Liquid UI Server, Client Software
• Commands: inputfield(), pushbutton(), del(), return()

Purpose

To get the future date in the current user’s date format based on the number of days entered. We will walk you through the following steps.

1. Delete unnecessary screen elements
2. Create an input field to enter the value for ‘No. of Days in future'
3. Create an input field to display the future date
4. Add a pushbutton to call the function that gets the future date
5. Create a function to validate if the variable holds a blank or null value
6. Create a function to change the date from 6 digits or 8 digits to the correct format
7. Create a function to get the future date based on the number of days

User Interface

Create this file inside your script folder for customizing SAP Easy Access screen SAPLSMTR_NAVIGATION.E0100.sjs
//Now, let's start adding the following script content to the above file.

Customization

1. Open SAP Easy Access screen and delete the image container on it, as shown below:
   
    

   // Deletes an image container on SAP Easy Access screen 
   del("X[IMAGE_CONTAINER]");
   

   
   
   
    
2. Add an input field to enter the number of days in the future.
   
    

   // Creates an input field with the label  'No. of Days in future' to enter no of days in the future. 
   inputfield( [1,1], "No. of Days in future", [1,24],{"name":"z_days", "size":3", "required":});
   

   
   
   
    
3. Add an input field to display the future date.
    

   // Creates an input field with the label Date to display the future date. 
   inputfield([2,1], "Date", [2,24], {"name":"z_target_date", "size":10});
   

   
   
   
    
4. Add a pushbutton to call the function, when clicked.
    

   // Creates a pushbutton with the label as Get future date to call a function, when clicked.  
   pushbutton([2,36], "Get future date","?",{"process":getFutureDate});

    

   

    
5. Now, add the following Liquid UI script to this file, and save the file.
    

   // Validate if the variable holds blank or null value
   function isBlank(jvar){
       if(typeof jvar == 'string'){
           jvar = jvar.trim();
       }
       return(jvar == 'undefined' || jvar == null || jvar == "" || jvar == void 0);
   }
   
   // Change date from 6 digit or 8 digit to correct format
   function formatDate(date,dformat){
       var date1 = "";
       month = date.substring(4,6);
       year = date.substring(0,4);
       date = date.substring(6,8);
       
       switch (dformat){
               case '1':
                   date1 = date + "." + month + "." + year;
                   break;
               case '2':
                   date1 = month + "/" + date + "/" + year;            
                   break;
               case '3':
                   date1 = month + "-" + date + "-" + year;                            
                   break;
               case '4':
                   date1 = year + "." + month + "." + date;            
                   break;
               case '5':
                   date1 = year + "/" + month + "/" + date;                
                   break;
               case '6':
                   date1 = year + "-" + month + "-" + date;
                   break;
           }
       return(date1);    
   }
   
   // Get future date based on the number of days 
   function getFutureDate(){
       if(isBlank(z_days)) {
           return('E: Enter number of Days');
       }
       
       onscreen 'SAPLSMTR_NAVIGATION.0100'
           var curr_date = new Date();
           curr_date.setMilliseconds(curr_date.getMilliseconds()+(z_days*24*60*60*1000));
   
           var tmp_cur_month = curr_date.getMonth();
           var tmp_cur_date = curr_date.getDate();
           var tmp_cur_year = curr_date.getFullYear();
   
           if(tmp_cur_month<9)
               tmp_cur_month = "0"+(tmp_cur_month+1);
           else
               tmp_cur_month = (tmp_cur_month+1).toString();
   
           if(tmp_cur_date<10)
                           tmp_cur_date = "0"+tmp_cur_date;
   
           z_target_date = formatDate(tmp_cur_year+tmp_cur_month+tmp_cur_date,"2");
           enter('?');
   }

SAP Process

1. Now, refresh the SAP screen, and you will see the created Liquid UI fields. Enter the value for No. of Days in future field, which is required, and click on Get future date. The future date according to the value entered will be displayed in the Date input field, as shown in the image below.