Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

HTML
<script> 
$(function() {
	
 	var boxes = $("[class*='articleList']");
    var questions2 = $('div[class=q_depth2]');
    var questions3 = $('div[class=q_depth3]');

    for (var i = 0; i < boxes.length; i++) {
        boxes[i].style.display = "none";
    }

    for (var j = 0; j < questions2.length; j++) {
        questions2[j].style.display = "none";
    }

    for (var r = 0; r < questions3.length; r++) {
        questions3[r].style.display = "none";
    }

});
	
function select_depth1(value) {
    var dataIndex = value;
    var depth2;
    var q_depth2_list = document.getElementsByClassName('q_depth2');
    var q_depth3_list = document.getElementsByClassName('q_depth3');

    $("input:radio[name*='q_depth2']").prop('checked', false);
    $("input:radio[name*='q_depth3']").prop('checked', false);

    for (var i = 0; i < q_depth2_list.length; i++) {
        q_depth2_list[i].style.display = "none";
    }
    for (var ij = 0; ij < q_depth2depth3_list.length; ij++) {
        q_depth2depth3_list[ij].style.display = "none";
    }

    var boxes = $("[class*='articleList']");
    for (var ji = 0; ji < q_depth3_list.lenghtboxes.length; ji++) {
        q_depth3_list[jboxes[i].style.display = "none";
    }

    if (dataIndex == 0 | dataIndex == 1) {

        depth2 = document.getElementById('q_depth2_1');
        depth2.style.display = '';
    }
    else if (dataIndex == 2) {
        depth2 = document.getElementById('q_depth2_2');
        depth2.style.display = '';
    }
    else {
        depth2 = document.getElementById('q_depth2_3');
        depth2.style.display = '';
    }
}

function select_depth2(value) {
    var dataIndex = value;
    var depth1_value = $('input[name=q_depth1]:checked').val();
    var open_articleList;
    
    var boxes = $("[class*='articleList']");

    for (var i = 0; i < boxes.length; i++) {
        boxes[i].style.display = "none";
    }

    var q_depth3_list = document.getElementsByClassName('q_depth3');
    for (var j = 0; j < q_depth3_list.lenghtlength; j++) {
        q_depth3_list[j].style.display = "none";
    }

    if (depth1_value == 2 & dataIndex == 1) {
        var depth3 = document.getElementById('q_depth3_1');
        depth3.style.display = '';

    } else {
        var list_num = depth1_value + '' + dataIndex;
        open_articleList = document.getElementsByClassName('articleList_' + list_num);

        open_articleList[0].style.display = '';

    }

}

function select_depth3(value) {
    var dataIndex = value;
    var depth1_value = $('input[name=q_depth1]:checked').val();
    var depth2_value = $('input[name=q_depth2_2]:checked').val();

    var depth3 = depth1_value + '' + depth2_value;

    var open_articleList;

    var boxes = $("[class*='articleList']");
    for (var i = 0; i < boxes.length; i++) {
        boxes[i].style.display = "none";
    }

    open_articleList = document.getElementsByClassName('articleList_' + depth3 + '' + dataIndex);
    open_articleList[0].style.display = '';
    
}

</script>

<style>
	.radioLabel_dpt1 {
		font-size: 12pt;
		line-height: 1.8;
	}

    .radioLabel_dpt2 {
		font-size: 12pt;
		line-height: 1.8;
	}

    .radioLabel_dpt3 {
		font-size: 12pt;
		line-height: 1.8;
	}
</style>



<div style="margin-top: 18px;" class="q_depth1">
	<span style="font-size: 14pt; font-weight: bold;">Select a problem type you have</span><br><br>
    <input type="radio" id="q_detph1_0" name="q_depth1" value="0" onclick="select_depth1(this.value)" >
        <label  class="radioLabel_dpt1" for="q_detph1_0">A device feature does not work</label><br>
    <input type="radio" id="q_depth1_1" name="q_depth1" value="1" onclick="select_depth1(this.value)" >
        <label  class="radioLabel_dpt1" for="q_depth1_1">Device operates abnormally</label><br>
    <input type="radio" id="q_depth1_2" name="q_depth1" value="2" onclick="select_depth1(this.value)" >
        <label  class="radioLabel_dpt1" for="q_depth1_2">Device cannot connect wireless communication (network, BT, etc.)</label><br>
    <input type="radio" id="q_depth1_3" name="q_depth1" value="3" onclick="select_depth1(this.value)" >
        <label  class="radioLabel_dpt1" for="q_depth1_3">Device have a power-related problem</label><br>
</div>

<div style="margin-top: 18px;" class="q_depth2" id="q_depth2_1">
    <span style="font-size: 14pt; font-weight: bold;">What feature have problem?</span><br><br>
    <input type="radio" id="q_detph21_0" name="q_depth2_1" value="0" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_detph21_0">System features</label><br>
    <input type="radio" id="q_depth21_1" name="q_depth2_1" value="1" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth21_1">Other features & App features</label><br>
    <input type="radio" id="q_depth21_2" name="q_depth2_1" value="2" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth21_2">Scanner</label><br>
    <input type="radio" id="q_depth21_3" name="q_depth2_1" value="3" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth21_3">Keypad</label><br>
</div>


<div style="margin-top: 18px;" class="q_depth2" id="q_depth2_2">
    <span style="font-size: 14pt; font-weight: bold;">What feature have problem?</span><br><br>
    <input type="radio" id="q_detph22_0" name="q_depth2_2" value="0" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_detph22_0">Newtork (Wi-Fi, LTE...)</label><br>
    <input type="radio" id="q_depth22_1" name="q_depth2_2" value="1" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth22_1">Bluetooth</label><br>
    <input type="radio" id="q_depth22_2" name="q_depth2_2" value="2" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth22_2">NFC</label><br>
    <input type="radio" id="q_depth22_3" name="q_depth2_2" value="3" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth22_3">RFID</label><br>
</div>

<div style="margin-top: 18px;" class="q_depth2" id="q_depth2_3">
    <span style="font-size: 14pt; font-weight: bold;">What kind of model you use?</span><br><br>
    <input type="radio" id="q_detph23_0" name="q_depth2_3" value="0" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_detph23_0">Android device</label><br>
    <input type="radio" id="q_depth23_1" name="q_depth2_3" value="1" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth23_1">Bluetooth scanner</label><br>
    <input type="radio" id="q_depth23_2" name="q_depth2_3" value="2" onclick="select_depth2(this.value)">
        <label class="radioLabel_dpt2" for="q_depth23_2">RFID reader</label><br>
</div>


<div style="margin-top: 18px;" class="q_depth3" id="q_depth3_1">
    <span style="font-size: 14pt; font-weight: bold;">What kind of model you use?</span><br><br>
    <input type="radio" id="q_detph3_0" name="q_depth3" value="0" onclick="select_depth3(this.value)">
        <label class="radioLabel_dpt3" for="q_detph3_0">Android device</label><br>
    <input type="radio" id="q_depth3_1" name="q_depth3" value="1" onclick="select_depth3(this.value)">
        <label class="radioLabel_dpt3" for="q_depth3_1">Bluetooth scanner</label><br>
    <input type="radio" id="q_depth3_2" name="q_depth3" value="2" onclick="select_depth3(this.value)">
        <label class="radioLabel_dpt3" for="q_depth3_2">RFID reader</label><br>
</div>


    



Divbox
classarticleList_00

Content by Label
showLabelsfalse
showSpacefalse
reversetrue
excludeCurrenttrue
cqllabel = "troubleshooting" and label = "depth1-0" and label = "depth2-0"

...