아임웹 코드 - 선택된 옵션에 따라 요금제 계산하기

※ 본 코드는 통신사, 휴대폰 구매 시 사용하는 상황을 가정하여 간단하게 계산식을 구현한 코드로, 실제 사용하실 떄에는

     옵션값과 공식 등을 모두 적절하게 교체해주셔야 합니다.

※ 필요 시 선택된 옵션에 맞는 상담 입력폼과 연동하여 사용할 수 있습니다.

    <div id="cover">

        <section id="#dhlswhr" style="border-right: 1px solid #dedede; padding-right: 20px;">

            <h2 class="xkdlxmf">이용조건 선택</h2>

            <!-- 1 -->

            <div class="xoqList">

                <p class="subxkdlxmf">약정선택</p>

                <div class="xoqinput">

                    <div>

                        <input type="radio" name="qkdqjq" value="500,000" id="wldnjsrma" checked>

                        <label for="wldnjsrma">공시지원금</label>

                    </div>

                    <div>

                        <input type="radio" name="qkdqjq" value="540,000" id="dirwjd" >

                        <label for="dirwjd">요금제할인(선택약정)</label>

                    </div>

                </div>

            </div>

            <!-- 2 -->

            <div class="xoqList">

                <p class="subxkdlxmf">할부개월</p>

                <div class="xoqinput Grid3f">

                    <div>

                        <input type="radio" name="rlrks" value="24" id="24month" checked>

                        <label for="24month">24개월</label>

                    </div>

                    <div>

                        <input type="radio" name="rlrks" value="30" id="30month" >

                        <label for="30month">30개월</label>

                    </div>

                    <div>

                        <input type="radio" name="rlrks" value="36" id="36month" >

                        <label for="36month">36개월</label>

                    </div>

                </div>

            </div>

            <!-- 3 -->

            <div class="xoqList">

                <p class="subxkdlxmf">사용중인 통신사</p>

                <div class="xoqinput Grid4f">

                    <div>

                        <input type="radio" name="xhdtlstking" value="SKT" id="xhdtlstkSKT" checked>

                        <label for="xhdtlstkSKT">SKT</label>

                    </div>

                    <div>

                        <input type="radio" name="xhdtlstking" value="KT" id="xhdtlstkKT" >

                        <label for="xhdtlstkKT">KT</label>

                    </div>

                    <div>

                        <input type="radio" name="xhdtlstking" value="LGU+" id="xhdtlstkingLG" >

                        <label for="xhdtlstkingLG">LGU+</label>

                    </div>

                    <div>

                        <input type="radio" name="xhdtlstking" value="알뜰폰" id="xhdtlstkdkfemf" >

                        <label for="xhdtlstkdkfemf">알뜰폰</label>

                    </div>

                </div>

            </div>

            <!-- 4 -->

            <div class="xoqList">

                <p class="subxkdlxmf">사용하실 통신사</p>

                <div class="xoqinput Grid3f">

                    <div>

                        <input type="radio" name="xhdtlstk" value="SKT" id="GxhdtlstkSKT" checked>

                        <label for="GxhdtlstkSKT">SKT</label>

                    </div>

                    <div>

                        <input type="radio" name="xhdtlstk" value="KT" id="GxhdtlstkKT" >

                        <label for="GxhdtlstkKT">KT</label>

                    </div>

                    <div>

                        <input type="radio" name="xhdtlstk" value="LGU+" id="GxhdtlstkLG" >

                        <label for="GxhdtlstkLG">LGU+</label>

                    </div>

                </div>

            </div>

            <!-- 5 -->

            <div class="xoqList qhgjadusfud">

                <p class="subxkdlxmf">용량</p>

                <div class="xoqinput">

                    <div>

                        <input type="radio" name="dydfid" value="2,000,000" id="gb256" checked>

                        <label for="gb256">256G</label>

                    </div>

                    <div>

                        <input type="radio" name="dydfid" value="2,500,000" id="gb512" >

                        <label for="gb512">512G</label>

                    </div>

                </div>

            </div>

            <!-- 6 -->

            <div class="xoqList SKTdyrmawp">

                <p class="subxkdlxmf">요금제</p>

                <div class="xoqinput">

                    <select name="dyrmawp" id="SKTdyrmawpSel">

                        <option value="platinum">5GX플래티넘</option>

                        <option value="prime">5GX프라임</option>

                    </select>

                    <div style="text-align: right; line-height: 40px;">

                        월

                        <span id="SKTdyrmawpValue"></span>

                        원

                    </div>

                </div>

                <div style="margin-top: 10px;" id="SKTdyrmawpText"></div>

            </div>

            <div class="xoqList KTdyrmawp" style="display: none;">

                <p class="subxkdlxmf">요금제</p>

                <div class="xoqinput">

                    <select name="dyrmawp" id="KTdyrmawpSel">

                        <option value="premium">슈퍼플랜 프리미엄 초이스</option>

                        <option value="special">슈퍼플랜 스페셜 초이스</option>

                    </select>

                    <div style="text-align: right; line-height: 40px;">

                        월

                        <span id="KTdyrmawpValue"></span>

                        원

                    </div>

                </div>

                <div style="margin-top: 10px;" id="KTdyrmawpText"></div>

            </div>

            <div class="xoqList LGdyrmawp" style="display: none;">

                <p class="subxkdlxmf">요금제</p>

                <div class="xoqinput">

                    <select name="dyrmawp" id="LGdyrmawpSel">

                        <option value="premiersuper">5G 프리미어 슈퍼</option>

                        <option value="premierplus">5G 프리미어 플러스</option>

                    </select>

                    <div style="text-align: right; line-height: 40px;">

                        월

                        <span id="LGdyrmawpValue"></span>

                        원

                    </div>

                </div>

                <div style="margin-top: 10px;" id="LGdyrmawpText"></div>

            </div>

        </section>

        <section id="dhfmswhr">

            <h2 style="font-size: 20px;">가격</h2>

            <div class="xoqemf">

                <p class="subxkdlxmf">출고가</p>

                <div><input type="text" value="" id="cnfrhrk">원</div>

            </div>

            <div class="xoqemf">

                <p id="qkdqjqText" class="subxkdlxmf"></p>

                <div>

                    <span>-</span>

                    <input type="text" value="" id="qkdqjqValue" style="width: 60px;">원

                </div>

            </div>

            <div class="xoqemf" style="background-color: #dedede;">

                <p class="subxkdlxmf">할부원금</p>

                <div><input type="text" value="" id="dnjsrma">원</div>

            </div>

            <div class="xoqemf">

                <p class="subxkdlxmf">할부개월</p>

                <div><input type="text" value="" id="rlrksValue">개월</div>

            </div>

            <div class="xoqemf">

                <p class="subxkdlxmf">사용중인 통신사</p>

                <div><input type="text" value="" id="xhdtlstkingValue"></div>

            </div>

            <div class="xoqemf">

                <p class="subxkdlxmf">사용하실 통신사</p>

                <div><input type="text" value="" id="xhdtlstkValue"></div>

            </div>

            <div class="xoqemf">

                <p class="subxkdlxmf">용량</p>

                <div id="dydfidText"></div>

            </div>

            <div class="xoqemf SKTxoqemf">

                <p class="subxkdlxmf">요금제</p>

                <div id="SKTdyrmawpTextValue"></div>

            </div>

            <div class="xoqemf KTxoqemf" style="display: none;">

                <p class="subxkdlxmf">요금제</p>

                <div id="KTdyrmawpTextValue"></div>

            </div>

            <div class="xoqemf LGxoqemf" style="display: none;">

                <p class="subxkdlxmf">요금제</p>

                <div id="LGdyrmawpTextValue"></div>

            </div>

            <div class="Grid5f">

                <p class="subxkdlxmf">월 할부원금</p>

                <span> + </span>

                <p class="subxkdlxmf">요금제</p>

                <span> = </span>

                <p class="subxkdlxmf">금액</p>

            </div>

            <div class="Grid5f SKTResult">

                <p class="subxkdlxmf" id="SKTmonthPay">

                    <span>원</span>

                </p>

                <span> + </span>

                <p class="subxkdlxmf" id="SKTdyrmawpMonth"></p>

                <span> = </span>

                <p class="subxkdlxmf" id="SKTtotalResult"></p>

            </div>

            <div class="Grid5f KTResult" style="display: none;">

                <p class="subxkdlxmf" id="KTmonthPay"></p>

                <span> + </span>

                <p class="subxkdlxmf" id="KTdyrmawpMonth"></p>

                <span> = </span>

                <p class="subxkdlxmf" id="KTtotalResult"></p>

            </div>

            <div class="Grid5f LGResult" style="display: none;">

                <p class="subxkdlxmf" id="LGmonthPay"></p>

                <span> + </span>

                <p class="subxkdlxmf" id="LGdyrmawpMonth"></p>

                <span> = </span>

                <p class="subxkdlxmf" id="LGtotalResult"></p>

            </div>

            </section>

        </section>

    </div>

<style>

    body {

        margin: 0;

    }

    * {

        box-sizing: border-box;

    }

    #cover {

        width: 70%;

          height: 650px;

        background: #f5f5f5;

        margin: 0 auto;

        display: grid;

        grid-template-columns: 1fr 1fr;

        padding: 20px;

        gap: 20px;

        color:black;

    }

    #cover .xkdlxmf {

        margin: 0;

        font-size: 20px;

    }

    #cover .subxkdlxmf {

        font-size: 14px;

        margin-top: 10px;

        margin-bottom: 10px;

    }

    #cover .xoqinput {

        display: grid;

        grid-template-columns: 1fr 1fr;

    }

    #cover .xoqinput>div>label {

        width: 100%;

        display: block;

        height: 40px;

        border: 1px solid #a9a9a9;

        text-align: center;

        line-height: 40px;

        cursor: pointer;

        color: #a9a9a9;

        font-size: 14px;

    }

    #cover .xoqinput>div:nth-child(1)>label {

        border-top-left-radius: 10px;

        border-bottom-left-radius: 10px;

    }

    #cover .xoqinput>div:last-child>label {

        border-top-right-radius: 10px;

        border-bottom-right-radius: 10px;

    }

    #cover input[type="radio"] {

        display: none;

    }

    #cover input[type="radio"]:checked + label {

        color: blue;

        border-color: blue;

    }

    #cover .Grid3f {

        grid-template-columns: 1fr 1fr 1fr;

    }

    #cover .Grid4f {

        grid-template-columns: 1fr 1fr 1fr 1fr;

    }

    #cover .Grid5f {

        display: flex;

        align-items: center;

        display: grid;

        grid-template-columns: 3fr 0.5fr 3fr 0.5fr 3fr;

        gap: 20px;

        text-align: center;

        margin-top: 20px;

    }

    #cover select {

        border: 1px solid #dedede;

        height: 40px;

        outline: none;

    }

    #cover .xoqemf {

        display: flex;

        justify-content: space-between;

        align-items: center;

    }

    #cover input[type="text"] {

        margin: 0;

        padding: 0;

        text-align: right;

        border: none;

        background: none;

        outline: none;

    }

</style>

<script>

    // 라디오 버튼 이벤트

    document.querySelectorAll('input[name="qkdqjq"]').forEach(function(qkdqjq) {

        qkdqjq.addEventListener('change',function(){

            if(qkdqjq.checked) {

                qkdqjqLabelText();

                qkdqjqInputValue(qkdqjq.value);

                calculateValue();

                monthCalculateValue();

                totalPay();

            }

        })

    })

    // 처음 로딩시 나타날 텍스트와 value

    window.onload = function() {

        // 약정선택 value

        var initialqkdqjqValue = document.querySelector('input[name="qkdqjq"]:checked').value;

        document.getElementById('qkdqjqValue').value = initialqkdqjqValue;

        // 약정선택 text

        var initialqkdqjqLabelText = document.querySelector('input[name="qkdqjq"]:checked + label')

        var LabelText = initialqkdqjqLabelText.textContent

        document.getElementById('qkdqjqText').innerText = LabelText;

        // 할부개월 value

        var initialrlrksValue = document.querySelector('input[name="rlrks"]:checked').value;

        document.getElementById('rlrksValue').value = parseFloat(initialrlrksValue);

        // 사용중인통신사 value

        var initialxhdtlstkingValue = document.querySelector('input[name="xhdtlstking"]:checked').value;

        document.getElementById('xhdtlstkingValue').value = initialxhdtlstkingValue;

        // 사용할통신사 value

        var initialxhdtlstkValue = document.querySelector('input[name="xhdtlstk"]:checked').value;

        document.getElementById('xhdtlstkValue').value = initialxhdtlstkValue;

        // 용량 value

        var initialdydfidValue = document.querySelector('input[name="dydfid"]:checked').value;

        document.getElementById('cnfrhrk').value = initialdydfidValue;

        // 용량 text

        var initialdydfidLabelText = document.querySelector('input[name="dydfid"]:checked + label')

        var dydfidLabelText = initialdydfidLabelText.textContent;

        document.getElementById('dydfidText').innerText = dydfidLabelText;

        calculateValue();

        monthCalculateValue();

        totalPay()

    }

    function parseNumberFromString(str) {

        return parseFloat(str.replace(/,/g, ''));

    }

    // 숫자를 쉼표로 구분하여 문자열로 변환하는 함수

    function formatNumberWithCommas(num) {

        return num.toLocaleString();

    }

    // 할부 원금 계산

    function calculateValue() {

        var cnfrhrk = document.querySelector('#cnfrhrk').value;

        var gkfdls = document.querySelector('#qkdqjqValue').value;

        var dnjsrma = parseNumberFromString(cnfrhrk) - parseNumberFromString(gkfdls);

        document.getElementById('dnjsrma').value = formatNumberWithCommas(dnjsrma);

    }

    // 약정선택에서 radio버튼 checked된 label의 text를 보여주기

    function qkdqjqLabelText() {

        var radioLabel = document.querySelector('input[name="qkdqjq"]:checked + label');

        if(radioLabel) {

            var radioLabelText = radioLabel.textContent;

            document.getElementById('qkdqjqText').innerText = radioLabelText;

        }

    }

    // 약정선택에서 radio버튼 checked된 value값 보여주기

    function qkdqjqInputValue (value) {

        document.getElementById('qkdqjqValue').value = value;

    }

    // 할부개월

    let rlrks = document.querySelectorAll('input[name="rlrks"]').forEach(function(rlrks) {

        rlrks.addEventListener('click',function(){

            if(rlrks.checked) {

                rlrksValue(rlrks.value);

                calculateValue();

                monthCalculateValue();

                totalPay();

            }

        })

    })

    // 할부개월 선택이 보여지는 개월 수

    function rlrksValue(value) {

        document.getElementById('rlrksValue').value = value;

    }

    // 월 할부원금 계산

    function monthCalculateValue() {

        let dnjsrma2 = document.getElementById('dnjsrma').value;

        let dirwjdMonth = document.querySelector('input[name="rlrks"]:checked').value

        let monthPay = Math.floor(parseNumberFromString(dnjsrma2) / parseNumberFromString(dirwjdMonth));

        document.getElementById('SKTmonthPay').innerText = formatNumberWithCommas(monthPay);

        document.getElementById('KTmonthPay').innerText = formatNumberWithCommas(monthPay);

        document.getElementById('LGmonthPay').innerText = formatNumberWithCommas(monthPay);

    }

    // 사용중인 통신사

    let xhdtlstking = document.querySelectorAll('input[name="xhdtlstking"]').forEach(function(xhdtlstking){

        xhdtlstking.addEventListener('change',function(){

            if(xhdtlstking.checked) {

                xhdtlstkingValue(xhdtlstking.value);

            }

        })

    })

    // 사용중인 통신사 선택시 보여지는 통신사

    function xhdtlstkingValue(value) {

        document.getElementById('xhdtlstkingValue').value = value;

    }

    // 사용하실 통신사

    let xhdtlstk = document.querySelectorAll('input[name="xhdtlstk"]').forEach(function(xhdtlstk) {

        xhdtlstk.addEventListener('change',function(){

            if(xhdtlstk.checked) {

                xhdtlstkValue(xhdtlstk.value);

            }

        })

    })

    // 사용하실 통신사 선택시 보여지는 통신사

    function xhdtlstkValue (value) {

        document.getElementById('xhdtlstkValue').value = value;

    }

    // 통신사 선택시 선택한 통신사에따라 요금제 나오기

    let SKTdyrmawp = document.querySelector('.SKTdyrmawp');

    let KTdyrmawp = document.querySelector('.KTdyrmawp');

    let LGdyrmawp = document.querySelector('.LGdyrmawp');

    let SKTxoqemf = document.querySelector('.SKTxoqemf');

    let KTxoqemf = document.querySelector('.KTxoqemf');

    let LGxoqemf = document.querySelector('.LGxoqemf');

    let SKTResult = document.querySelector('.SKTResult');

    let KTResult = document.querySelector('.KTResult');

    let LGResult = document.querySelector('.LGResult');

    let xhdtlstkSelect = document.querySelectorAll('input[name="xhdtlstk"]');

    for(var i = 0; i < xhdtlstkSelect.length; i++) {

        xhdtlstkSelect[i].addEventListener('change',function(){

            if(xhdtlstkSelect[0].checked) {

                SKTdyrmawp.style.display = "block";

                KTdyrmawp.style.display = "none";

                LGdyrmawp.style.display = "none";

                SKTxoqemf.style.display = "flex";

                KTxoqemf.style.display = "none";

                LGxoqemf.style.display = "none";

                SKTResult.style.display = "grid";

                KTResult.style.display = "none";

                LGResult.style.display = "none";

            }else if(xhdtlstkSelect[1].checked) {

                SKTdyrmawp.style.display = "none";

                KTdyrmawp.style.display = "block";

                LGdyrmawp.style.display = "none";

                SKTxoqemf.style.display = "none";

                KTxoqemf.style.display = "flex";

                LGxoqemf.style.display = "none";

                SKTResult.style.display = "none";

                KTResult.style.display = "grid";

                LGResult.style.display = "none";

            }else if(xhdtlstkSelect[2].checked) {

                SKTdyrmawp.style.display = "none";

                KTdyrmawp.style.display = "none";

                LGdyrmawp.style.display = "block";

                SKTxoqemf.style.display = "none";

                KTxoqemf.style.display = "none";

                LGxoqemf.style.display = "flex";

                SKTResult.style.display = "none";

                KTResult.style.display = "none";

                LGResult.style.display = "grid";

            }

        })

    }

    // 용량

    let dydfid = document.querySelectorAll('input[name="dydfid"]').forEach(function(dydfid) {

        dydfid.addEventListener('change',function(){

            if(dydfid.checked) {

                dydfidLabelText();

                dydfidValue(dydfid.value);

                calculateValue();

                monthCalculateValue();

                totalPay();

            }

        })

    })

    // 용량 선택시 보여지는 출고가의 값

    function dydfidValue(value) {

        document.getElementById('cnfrhrk').value = value;

    }

    // 용량 선택시 보여지는 용량

    function dydfidLabelText() {

        var dydfidRadioLabelText = document.querySelector('input[name="dydfid"]:checked + label');

        if(dydfidRadioLabelText) {

            var dydfidLabelText = dydfidRadioLabelText.textContent;

            document.getElementById('dydfidText').innerText = dydfidLabelText;

        }

    }

    // SK요금제

    var sktOptionData = {

        'platinum' : { value1 : "125,000", value2 : "음성 문자 무제한", value3 : "데이터 완전무제한", value4 : "5GX플래티넘"},

        'prime' : {value1 : "89,000", value2 : "음성 문자 무제한", value3 : "데이터 완전무제한", value4 : "5GX프라임"},

    }

    function SKTgetSelectedOptionData() {

        var selectElement = document.querySelector('#SKTdyrmawpSel');

        var selectedOptionId = selectElement.value;

        return sktOptionData[selectedOptionId];

    }

    function SKTdisplaySelectedOptionData() {

        var selectedData = SKTgetSelectedOptionData();

        var dyrmawpValue = document.getElementById('SKTdyrmawpValue');

        dyrmawpValue.innerText = selectedData.value1;

        var dyrmawpMonth = document.getElementById('SKTdyrmawpMonth');

        dyrmawpMonth.innerText = selectedData.value1;

        var dyrmawpText = document.getElementById('SKTdyrmawpText');

        dyrmawpText.innerText = selectedData.value2 + " / " + selectedData.value3;

        var dyrmawpTextValue = document.getElementById('SKTdyrmawpTextValue');

        dyrmawpTextValue.innerText = selectedData.value4;

    }

    document.getElementById('SKTdyrmawpSel').addEventListener('change',function(){

        SKTdisplaySelectedOptionData();

        totalPay();

    })

    SKTdisplaySelectedOptionData();

    // KT요금제

    var ktOptionData = {

        'premium' : { value1 : "130,000", value2 : "음성 문자 무제한", value3 : "데이터 완전무제한", value4 : "슈퍼플랜 프리미엄 초이스" , value5 : "데이터 로밍 무제한(최대 3Mbps 속도제어)"},

        'special' : {value1 : "110,000", value2 : "음성 문자 무제한", value3 : "데이터 완전무제한", value4 : "슈퍼플랜 스페셜 초이스" , value5:"넷플릭스, 시즌 초이스 무료제공"},

    }

    function KTgetSelectedOptionData() {

        var selectElement = document.querySelector('#KTdyrmawpSel');

        var selectedOptionId2 = selectElement.value;

        return ktOptionData[selectedOptionId2];

    }

    function KTdisplaySelectedOptionData() {

        var selectedData = KTgetSelectedOptionData();

        var dyrmawpValue = document.getElementById('KTdyrmawpValue');

        dyrmawpValue.innerText = selectedData.value1;

        var dyrmawpMonth = document.getElementById('KTdyrmawpMonth');

        dyrmawpMonth.innerText = selectedData.value1;

        var dyrmawpText = document.getElementById('KTdyrmawpText');

        dyrmawpText.innerText = selectedData.value2 + " / " + selectedData.value3 + " / " + selectedData.value5;

        var dyrmawpTextValue = document.getElementById('KTdyrmawpTextValue');

        dyrmawpTextValue.innerText = selectedData.value4;

    }

    document.getElementById('KTdyrmawpSel').addEventListener('change',function(){

        KTdisplaySelectedOptionData();

        totalPay();

    })

    KTdisplaySelectedOptionData();

    // LG요금제

    var lgOptionData = {

        'premiersuper' : { value1 : "115,000", value2 : "음성 문자 무제한", value3 : "데이터 완전무제한+나눠쓰기100GB", value4 : "5G 프리미어 슈퍼"},

        'premierplus' : {value1 : "105,000", value2 : "음성 문자 무제한", value3 : "데이터 완전무제한+나눠쓰기100GB", value4 : "5G 프리미어 플러스"},

    }

    function LGgetSelectedOptionData() {

        var selectElement = document.querySelector('#LGdyrmawpSel');

        var selectedOptionId2 = selectElement.value;

        return lgOptionData[selectedOptionId2];

    }

    function LGdisplaySelectedOptionData() {

        var selectedData = LGgetSelectedOptionData();

        var dyrmawpValue = document.getElementById('LGdyrmawpValue');

        dyrmawpValue.innerText = selectedData.value1;

        var dyrmawpMonth = document.getElementById('LGdyrmawpMonth');

        dyrmawpMonth.innerText = selectedData.value1;

        var dyrmawpText = document.getElementById('LGdyrmawpText');

        dyrmawpText.innerText = selectedData.value2 + " / " + selectedData.value3;

        var dyrmawpTextValue = document.getElementById('LGdyrmawpTextValue');

        dyrmawpTextValue.innerText = selectedData.value4;

    }

    document.getElementById('LGdyrmawpSel').addEventListener('change',function(){

        LGdisplaySelectedOptionData();

        totalPay();

    })

    LGdisplaySelectedOptionData();

    // 전체 금액

    function totalPay() {

        let SKTmonthPay2 = document.getElementById('SKTmonthPay').textContent

        let SKTdyrmawpMonth2 = document.getElementById('SKTdyrmawpMonth').textContent

        let SKTresult = parseNumberFromString(SKTmonthPay2) + parseNumberFromString(SKTdyrmawpMonth2);

        document.getElementById('SKTtotalResult').innerText = formatNumberWithCommas(SKTresult);

        let KTmonthPay2 = document.getElementById('KTmonthPay').textContent

        let KTdyrmawpMonth2 = document.getElementById('KTdyrmawpMonth').textContent

        let KTresult = parseNumberFromString(KTmonthPay2) + parseNumberFromString(KTdyrmawpMonth2);

        document.getElementById('KTtotalResult').innerText = formatNumberWithCommas(KTresult)

        let LGmonthPay2 = document.getElementById('LGmonthPay').textContent

        let LGdyrmawpMonth2 = document.getElementById('LGdyrmawpMonth').textContent

        let LGresult = parseNumberFromString(LGmonthPay2) + parseNumberFromString(LGdyrmawpMonth2);

        document.getElementById('LGtotalResult').innerText = formatNumberWithCommas(LGresult)

    }

</script>