$selectOption.Action

by mtambulut

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>TEST</title>
</head>

<body>
    How can I get the code to fire on load, maintaining the change/keypress?<br/>
<select id="textFieldId" name="textFieldId">
    <option value="1">End Date</option>
    <option value="2">End Date Plus 30</option>
    <option value="3">End Date Plus Custom</option>
    <option value="4">Print Date Plus Custom</option>
    <option value="5">Static Expiration Date (New)</option>
</select>
    <pre id="id1">If user selects 1</pre>
    <pre id="id2">If user selects 2</pre>
    <pre id="id3">If user selects 3</pre>
    <pre id="id4">If user selects 4</pre>
    <pre id="id5">If user selects 5</pre>
</body>
</html>

CSS

pre {display: none;}

JavaScript

$(document).ready(function(){
    $("#textFieldId").val("3").change();
    $("#textFieldId").on("change keyup", myFunction);
});

function myFunction(){
    var selectedVal = $(this).val();
    $("pre").hide();
    $("#id" + selectedVal).show();
    switch(selectedVal){
        case "1":
            //call a function
        break;
        case "2":
            //call a function
        break;            
    }        
    return false;
}