Show/hide text field depending on select option
You can use Conditional (ternary) Operator.

Syntax :

condition ? expr1 : expr2 


Reformated code :

function showHide(){
    var selectedValue =document.getElementById("choice_criteria_id").value;
    document.getElementById("id_src_addr").style.display = (selectedValue == "source_ip") ? "inline" : "none";
    document.getElementById("id_dst_addr").style.display = (selectedValue == "dest_ip") ? "inline" : "none";
    document.getElementById("id_port").style.display = (selectedValue == "port") ? "inline" : "none";
    document.getElementById("id_port_range").style.display = (selectedValue == "port_range") ? "inline" : "none";
}


Example in CodePen