On dropdown value change, need to set due date column value using javascript

Question

I have choice value dropdown for priority with value - High, Normal, low. If Priority is "high" , Duedate= Current date + 2; If Priority is "Normal" , Duedate= Current date + 3; If Priority is "Low" , Duedate= Current date + 4;

I need to do this using javascript /Jquery as I am working on Sharepoint Online. I can't use Sharepoint designer or infopath.

This is the code I have written.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>
<script>

_spBodyOnLoadFunctionNames.push("dropdownvalue");

function dropdownvalue() {

    //add an onchange event to the dropdown
    var theSelect = getTagFromIdentifierAndTitle("select","DropDownChoice","Priority").onchange = function() {ChangeEvent()};
}

function ChangeEvent()
{   
    var submittedDate= $("input[title='Submitted Date']").val();
    //var submittedDate = new Date(ctx.CurrentItem.SubmittedDate);
    //get the dropdown
    var dropDown = getTagFromIdentifierAndTitle("select","DropDownChoice","Priority");
     var dueDate = new Date(ctx.CurrentItem.DueDate);
    //get the selected value
    var priority= dropDown.options[dropDown.selectedIndex].text;
    var now = new Date();
    //var nowPlus = new Date();


    switch(priority) {
        case "High (<3 days)": 
            dueDate.setDate(now.getDate()+2);
            break; 
        case "Normal (3 days)": 
            dueDate.setDate(now.getDate()+3);
            break; 
        case "Low (>3 days)": 
            dueDate.setDate(now.getDate()+4);
            break;
    default:
        date = null;
    }
}
</script>

Answer 1

You can use the following code for your requirement:

<script src="//code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    var today = new Date();   
    var todayDay = today.getDate();   
    var todayMon = today.getMonth() + 1;   
    var todayYear = today.getYear(); 

    $("select[title='Priority'").change(function(){

    var value = $(this).find("option:selected").text();

    if(value== 'High'){
    Day=todayDay+2;
    DueDate=todayMon + "/" + Day + "/" + todayYear;
    $("input[title='DueDate']").val(DueDate);
    }

    if(value== 'Normal'){
    Day=todayDay+3;
    DueDate=todayMon + "/" + Day + "/" + todayYear;
    $("input[title='DueDate']").val(DueDate);
    }

    if(value== 'Low'){
    Day=todayDay+4;
    DueDate=todayMon + "/" + Day + "/" + todayYear;
    $("input[title='DueDate']").val(DueDate);
    }

    });


})
</script>

The result is：

Note: You need to change the choice column and date column to yours.

Answer 2

<script language="javascript" type="text/javascript">

var today = new Date();

$(function(){

$("select[title='Priority Required Field']").change(function(){

var value = $(this).find("option:selected").text();

if(value == 'High (<3 days)'){
var slaDate = addBusinessDays(today, 2);    
var DateCreated = new Date(Date.parse(slaDate)).format("MM/dd/yyyy");
$("input[title='Due Date Required Field']").val(DateCreated);
}
else if (value == 'Normal (3 days)')
{          
var slaDate = addBusinessDays(today, 3);
var DateCreated = new Date(Date.parse(slaDate)).format("MM/dd/yyyy");
$("input[title='Due Date Required Field']").val(DateCreated);
}
else if (value == 'Low (>3 days)')
{
var slaDate = addBusinessDays(today, 4);
var DateCreated = new Date(Date.parse(slaDate)).format("MM/dd/yyyy");
$("input[title='Due Date Required Field']").val(DateCreated);
}
else
{
var DateCreated = new Date(Date.parse(today)).format("MM/dd/yyyy");
$("input[title='Due Date Required Field']").val(DateCreated);
}

});
});

function addBusinessDays(date,NoD) 
 {
    d = new Date(date.getTime());

    var day = d.getDay();

   d.setDate(d.getDate() + NoD);

   var dayNumber = d.getDay();

   d = new Date(date.getTime());

   if(dayNumber == 6)
   {
    d.setDate(d.getDate() + (NoD + 2))
   }
   else if(dayNumber == 0)
   {
    d.setDate(d.getDate() + (NoD + 1))
    }
   else
    {
    d.setDate(d.getDate() + NoD);
    }

    return d;
     }


 </script>