I am working with multilevel filter based on radio selection, where I need to open hierarchy on parent selection
As on simple hide and show jQuery function I tried hiding fields with hardcode coding,
And I need smart way to handle lengthy hierarchy filter, which I am not able to do with code I have done
Here is a JSfiddle link - https://jsfiddle.net/Lqomhwg5/
<html>
<head>
<script>
function openProtocolView(){
$('input:radio[name=ProtocolViewVerticalSingleBoth]').each(function () { $(this).prop('checked', false); });
$('input:radio[name=ACodebcode]').each(function () { $(this).prop('checked', false); });
$('input:radio[name=bcode_ccvs]').each(function () { $(this).prop('checked', false); });
$("#ProtocolViewChild").css("display","block")
hideAllOtherViewThanProtocol()
}
function openSmartView(){
$("#smartViewChild").css("display","block")
hideAllOtherViewThanSmart()
}
function openShapeView(){
$("#shapeViewChild").css("display","block")
$("#shapeViewChildVerticalSingleSide").css("display","none")
$('input:radio[name=shapeViewVerticalSingleBoth]').each(function () { $(this).prop('checked', false); });
hideAllOtherViewThanShape()
}
</script>
</head>
<body>
<div class="main-div">
<div class="View-name" onclick="openProtocolView()">
<label for="ProtocolView">Protocol View</label>
<input type="radio" id="ProtocolView" name="MainView" value="ProtocolView">
</div>
<div class="View-name" onclick="openSmartView()">
<label for="smartView">Smart View</label>
<input type="radio" id="smartView" name="MainView" value="smartView">
</div>
<div class="View-name" onclick="openShapeView()">
<label for="shapeView">Shape View</label>
<input type="radio" id="shapeView" name="MainView" value="shapeView">
</div>
</div>
</body>
</html>
So is there any library or trick to handle the same with so many child and grand child filter options? Thanks.
