Skip to content

P
PERFORMA_REPLICA
Commit 6c4ca055 by Saliya Randunu
Options

fix the issue with occupation popup re open popup after saving

parent e67837be
Showing with 74 additions and 31 deletions
cmsWebApp/webroot/css/common.css
...@@ -6863,8 +6863,7 @@ input{ ...@@ -6863,8 +6863,7 @@ input{
} }
.occupation_content {} .occupation_content {}
.occupation_content_list {}
/*.occupation_content_list ul {display: none;}*/
.occupation_content_row {height: 400px;position: relative;} .occupation_content_row {height: 400px;position: relative;}
.occupation_content_column { float: left; ; width: 25%; overflow-y:auto; max-height: 400px; position: relative;} .occupation_content_column { float: left; ; width: 25%; overflow-y:auto; max-height: 400px; position: relative;}
.occupation_content_column.dyn-div ul{padding-left: 20px;} .occupation_content_column.dyn-div ul{padding-left: 20px;}
...@@ -6876,7 +6875,7 @@ input{ ...@@ -6876,7 +6875,7 @@ input{
.occupation_content_column li.clicked {border-right: 0} .occupation_content_column li.clicked {border-right: 0}
.occupation_content_column li.clicked > span {background: #fff;color: #03a0e7;font-weight: 700;} .occupation_content_column li.clicked > span {background: #fff;color: #03a0e7;font-weight: 700;}
/*.occupation_content_list li.clicked > ul {display: block;}*/
#occupation-list .jBox-container {border-radius: 3px; padding: 0} #occupation-list .jBox-container {border-radius: 3px; padding: 0}
#occupation-list .jBox-content {padding: 0;font-size: 13px;} #occupation-list .jBox-content {padding: 0;font-size: 13px;}
......
cmsWebApp/webroot/extensions/adminportal/job_detail.jsp
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
<script type="text/javascript"> <script type="text/javascript">
var lastclickedOccid = 0 , lastclickedOcc = "" ; var lastclickedOccid = 0 , lastclickedOcc = "" ;
var occPopup; var occPopup;
var occlistObj = {"level0" : null , "level1" : null , "level2" : null , "level3" : null };
$(document).ready(function() $(document).ready(function()
{ {
setupRecalc ($("form#editJob"), {'recalcOnError':true}); setupRecalc ($("form#editJob"), {'recalcOnError':true});
...@@ -33,6 +34,12 @@ ...@@ -33,6 +34,12 @@
{ {
$("button[name$='loadJobFromTemplate']").click(); $("button[name$='loadJobFromTemplate']").click();
}); });
if ($("#select-occupation-id").val()) {
lastclickedOccid = $("#select-occupation-id").val();
}else {
lastclickedOccid = 0 ;
}
var popup_width = 1040; var popup_width = 1040;
...@@ -48,60 +55,97 @@ ...@@ -48,60 +55,97 @@
$(".occupation_content_column").css("width", popup_width/4 ); $(".occupation_content_column").css("width", popup_width/4 );
}, },
onOpen : function(){ onOpen : function(){
if(lastclickedOccid===0){ $(".dyn-div").empty();
$(".dyn-div").empty();
$('.occupation_content_column ul li').removeClass("clicked"); $('.occupation_content_column ul li').removeClass("clicked");
$(".occupation_select_info").css("width","75%"); $(".occupation_select_info").css("width","75%");
if(lastclickedOccid!==0){
var currEle = $(".main-list-div").find("li[data-id='"+ lastclickedOccid +"']");
//
occlistObj[currEle.parent('ul').attr("class")] = lastclickedOccid ;
checkParents(currEle);
for (i = 0; i < 4; i++) {
if (occlistObj["level"+i] ){
popuplateSelectLists ($(".main-list-div").find("li[data-id='"+ occlistObj["level"+i] +"']"));
$(".level"+i+"-div").find("li").removeClass("clicked");
$(".level"+i+"-div").find("li[data-id='"+ occlistObj["level"+i] +"']").addClass("clicked");
occlistObj["level"+i] = null ;
}
}
} }
} }
}); });
$(document).on("click",".occupation_content_column ul li",function(){ $(document).on("click",".occupation_content_column ul li",function(){
popuplateSelectLists($(this));
});
$("#save-job-occ").on("click",function(){
if(lastclickedOccid!==0){
occPopup.close();
}
});
});
function checkParents(currEle){
newCurrEle = currEle.parent('ul').parent("li");
if (newCurrEle.length){
occlistObj[newCurrEle.parent("ul").attr("class")] = newCurrEle.data("id") ;
checkParents(newCurrEle);
}else{
return false;
}
}
function popuplateSelectLists(thisEle){
lastclickedOccid = $(this).data('id'); lastclickedOccid = thisEle.data('id');
lastclickedOcc = $(this).data('occ'); lastclickedOcc = thisEle.data('occ');
$(".select-occupation").val(lastclickedOcc); $(".select-occupation").val(lastclickedOcc);
$("#select-occupation-id").val(lastclickedOccid); $("#select-occupation-id").val(lastclickedOccid);
$(this).siblings('li').removeClass("clicked"); thisEle.siblings('li').removeClass("clicked");
$(this).addClass("clicked"); thisEle.addClass("clicked");
if( !$(this).parent().hasClass("third-child")) { if( !thisEle.parent().hasClass("level3")) {
$(".occupation_select_info").show(); $(".occupation_select_info").show();
var nextUl = $(this).find('ul').first().clone(); var nextUl = thisEle.find('ul').first().clone();
$("." + nextUl.attr('class') + "-div").empty(); $("." + nextUl.attr('class') + "-div").empty();
$("." + nextUl.attr('class') + "-div").nextAll().empty(); $("." + nextUl.attr('class') + "-div").nextAll().empty();
if(nextUl) { if(nextUl) {
nextUl.appendTo($("." + nextUl.attr('class') + "-div")); nextUl.appendTo($("." + nextUl.attr('class') + "-div"));
} }
if($(this).parent().hasClass("second-child")) { if(thisEle.parent().hasClass("level2")) {
$(".occupation_select_info").hide(); $(".occupation_select_info").hide();
} }
else { else {
if( $(this).hasClass("main-item")) { if( thisEle.hasClass("main-item")) {
$(".occupation_select_info").css("width","50%").show(); $(".occupation_select_info").css("width","50%").show();
}else{ }else{
if( $(this).parent().hasClass("first-child")) { if( thisEle.parent().hasClass("level1")) {
$(".occupation_select_info").css("width","25%").show(); $(".occupation_select_info").css("width","25%").show();
} }
} }
} }
} }
}); }
$("#save-job-occ").on("click",function(){
if(!lastclickedOccid===0){
occPopup.close();
}
});
});
function addWorkflow() function addWorkflow()
{ {
...@@ -436,7 +480,7 @@ ...@@ -436,7 +480,7 @@
<div class="occupation_content_row"> <div class="occupation_content_row">
<div class="main-list-div occupation_content_column"> <div class="main-list-div occupation_content_column">
<ul class="occupation_content_list"> <ul class="level0">
<% <%
Occupation[] firstLevelOccupations = Occupation.SearchByAll() Occupation[] firstLevelOccupations = Occupation.SearchByAll()
.andLevel(new EqualsFilter<>(OccupationLevel.LEVEL_1)) .andLevel(new EqualsFilter<>(OccupationLevel.LEVEL_1))
...@@ -446,21 +490,21 @@ ...@@ -446,21 +490,21 @@
%> %>
<li class="main-item" data-id="<%= firstLevel.getObjectID()%>" data-occ="<%= firstLevel%>"> <li class="main-item" data-id="<%= firstLevel.getObjectID()%>" data-occ="<%= firstLevel%>">
<span> <%= firstLevel%> </span> <span> <%= firstLevel%> </span>
<ul class="first-child"> <ul class="level1">
<% <%
for (Occupation secondLevel : firstLevel.getChildOccupationsSet()) for (Occupation secondLevel : firstLevel.getChildOccupationsSet())
{ {
%> %>
<li data-id="<%= secondLevel.getObjectID()%>" data-occ="<%= secondLevel%>"> <li data-id="<%= secondLevel.getObjectID()%>" data-occ="<%= secondLevel%>">
<span> <%= secondLevel%></span> <span> <%= secondLevel%></span>
<ul class="second-child"> <ul class="level2">
<% <%
for (Occupation thirdLevel : secondLevel.getChildOccupationsSet()) for (Occupation thirdLevel : secondLevel.getChildOccupationsSet())
{ {
%> %>
<li data-id="<%= thirdLevel.getObjectID()%>" data-occ="<%= thirdLevel%>"> <li data-id="<%= thirdLevel.getObjectID()%>" data-occ="<%= thirdLevel%>">
<span> <%= thirdLevel%></span> <span> <%= thirdLevel%></span>
<ul class="third-child"> <ul class="level3">
<% <%
for (Occupation fourthLevel : thirdLevel.getChildOccupationsSet()) for (Occupation fourthLevel : thirdLevel.getChildOccupationsSet())
{ {
...@@ -488,11 +532,11 @@ ...@@ -488,11 +532,11 @@
%> %>
</ul> </ul>
</div> </div>
<div class="first-child-div occupation_content_column dyn-div"></div> <div class="level1-div occupation_content_column dyn-div"></div>
<div class="second-child-div occupation_content_column dyn-div"></div> <div class="level2-div occupation_content_column dyn-div"></div>
<div class="third-child-div occupation_content_column dyn-div"></div> <div class="level3-div occupation_content_column dyn-div"></div>
</div> </div>
<div class="occupation_select_info"> <div class="occupation_select_info">
Select the most appropriate Category to help narrow down your Occupation Select the most appropriate Category to help narrow down your Occupation
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment