Simple problem with <form> tag

[Orlando]

Hi,

I'm porting a simple Energy cost calculator made in Javascript.
When i use the <form> tag Kendo UI isn't correcly displayed. This simple tag ins't supported or im wrong?

How can i fix this code to work with kendo ui? how can i access to my fields watts, hours and how to call the javascript function?



<div data-role="view" id="forms" data-title="Calculadora de Consumo" data-layout="layout" data-transition="slide" data-init="initForm" >

    <ul data-role="listview" data-style="inset" data-type="group">

         

         

        <li>

         

            Sepa cuánto consumen sus artefactos.

            <ul>

                <li>

                    <input type="tel" name="watts" size="5" value="0" />Watts del artefacto

                </li>

                 

                <li>

                    <input type="tel" name="hours" size="5" value="0" />Horas de funcionamiento

                </li>

                 

                <li>

                <input type="tel" name="unitcost" size="9"  value="105" />Costo KWh

                </li>

                <li>

                    <input type="button" value="Calculate" onclick="workitout(this.form)" />

                </li>

                 

                <li>

                <input type="text" name="daycost" size="7" />Costo diario

                </li>

                <li>

                <input type="text" name="qtrcost" size="7" />Costo mensual

                </li>

                 

                <li>

                <input type="text" name="yrcost" size="7" />Costo anual

                </li>

                 

            </ul>

             

        </li>

         

    </ul>

</div>

<script language="JavaScript" type="text/JavaScript">

<!--

function workitout(form)

{

var kw = form.watts.value / 1000;

var hrs = parseInt(form.hours.value);

 

var cost = (form.unitcost.value * kw * hrs) / 100;

var annual = cost * 365;

var quarter = annual / 12;

  

cost = round(cost);

annual = round(annual);

annual = round(annual);

 

form.daycost.value = cost;

form.qtrcost.value = quarter;

form.yrcost.value = annual;

}

function round (num) {

num = Math.round(num * 100) / 100;

num = (num + 0.001) + '';

return num.substring(0, num.indexOf('.') + 3);

}   

//  End -->

</script>