Hi,
The below code should work for you.
HTML:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<body onload="hide()">
<g:evaluate var="jvar_taskId" expression="RP.getWindowProperties().get('sysId')" />
    <input type="hidden" id="hidden_sys_id" name="hidden_sys_id" value="${jvar_taskId}"></input>
<g:ui_form>
<table style="width:700px;">
<tr>
<td style="width:25%">
<g:form_label>
Project Name :
</g:form_label>
</td>
<td style="width:60%">
<g:ui_reference name="project_ref" id="project_ref" query="u_jira_project_nameISNOTEMPTY" table="sn_jira_spoke_jira_to_servicenow_projects" onchange="setIssueTypeFilter(this)" />
</td>
</tr>
<tr id = "initialhide">
<td style="width:25%">
<g:form_label>
Issue Type :
</g:form_label>
</td>
<td style="width:60%">
<g:ui_reference name="issue_ref" id="issue_ref" table="sn_jira_spoke_issue_types_from_jira_project" />
</td>
</tr>
<tr>
<td>
<g:dialog_buttons_ok_cancel ok_id="submitData" ok="return continueOK()" ok_type="button" ok_text="${gs.getMessage('okay')}" ok_style_class="btn btn-primary" cancel_type="button" cancel_id="cancelData" cancel_style_class="btn btn-default" cancel="return continueCancel()"/>
</td>
</tr>
</table>
</g:ui_form>
</body>
   </j:jelly>

Client Script:

function hide(){
	gel('initialhide').style.display = 'none';
}
function setIssueTypeFilter(object){
	if(object.value != ""){
		gel('initialhide').style.display = '';
	}
	else{
		gel('initialhide').style.display = 'none';
	}
}

Notice the following changes. An onLoad function was added to the body which made sure that the second field was hidden when the page loads. The onChange function on the first field ensures that the second field is displayed only when the first field holds some value. Also note that I have added an "id" to the table row tag for the second field to toggle the display.
Thanks!
P.S. Please mark as Helpful if I was able to clear your doubt.