Hi arie.keren,
I have modified in your code.So please refer the below code and Implement as per your requirement.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>E-Learning | Pre Test</title>
<script type="text/javascript">
var mins
var secs;
function cd() {
mins = 30 * m("1");
secs = 0 + s(":01");
redo();
}
function m(obj) {
for (var i = 0; i < obj.length; i++) {
if (obj.substring(i, i + 1) == ":")
break;
}
return (obj.substring(0, i));
}
function s(obj) {
for (var i = 0; i < obj.length; i++) {
if (obj.substring(i, i + 1) == ":")
break;
}
return (obj.substring(i + 1, obj.length));
}
function dis(mins, secs) {
var disp;
if (mins <= 9) {
disp = " 0";
} else {
disp = " ";
}
disp += mins + ":";
if (secs <= 9) {
disp += "0" + secs;
} else {
disp += secs;
}
return (disp);
}
function redo() {
secs--;
if (secs == -1) {
secs = 59;
mins--;
}
document.getElementById("txtdisp").value = dis(mins, secs);
if ((mins == 0) && (secs == 0)) {
window.alert("Waktu telah habis. Tekan OK untuk lanjut.");
window.open("module.aspx", "_parent ")
} else {
cd = setTimeout("redo()", 1000);
}
}
function init() {
cd();
}
window.onload = init;
</script>
<style>
#txt
{
border: none;
font-family: verdana;
font-size: 16pt;
font-weight: bold;
border-right-color: #FFFFFF;
}
</style>
</head>
<body>
<form id="Form1" runat="server">
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</cc1:ToolkitScriptManager>
<!-- topbar starts -->
<div class="navbar navbar-default" role="navigation">
<div class="navbar-inner">
<button type="button" class="navbar-toggle pull-left animated flip">
<span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span><span
class="icon-bar"></span><span class="icon-bar"></span>
</button>
<ul class="collapse navbar-collapse nav navbar-nav top-menu">
<li><a href="#">E-Learning System NS Group</a></li>
</ul>
<!-- user dropdown starts -->
<div class="btn-group pull-right">
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<img src="../../icons/user.png" alt="" />
<span class="hidden-sm hidden-xs">
<asp:Label ID="lblUser" runat="server"></asp:Label></span> <span class="caret">
</span>
</button>
<ul class="dropdown-menu">
<li><a href="../../profile.aspx">
<img src="../../icons/info_rhombus.png" alt="" />
Profil</a></li>
<li class="divider"></li>
<li><a href="../../changeLogin.aspx">
<img src="../../icons/vcard_edit.png" alt="" />
Ubah Sandi</a></li>
<li class="divider"></li>
<li><a href="../../default.aspx">
<img src="../../icons/control_power_blue.png" alt="" />
Logout</a></li>
</ul>
</div>
<!-- user dropdown ends -->
</div>
</div>
<!-- topbar ends -->
<div class="ch-container">
<div class="row">
<!-- left menu starts -->
<div class="col-sm-2 col-lg-2">
<div class="sidebar-nav">
<div class="nav-canvas">
<div class="nav-sm nav nav-stacked">
</div>
<ul class="nav nav-pills nav-stacked main-menu">
<li class="nav-header">
<img src="../../img/logo-nss.png" alt="" width="100%" /></li>
<li class="nav-header"></li>
<li><a class="ajax-link" href="../../beranda.aspx">
<img src="../../icons/monitor.png" alt="" /><span> Beranda</span></a> </li>
<li><a class="ajax-link" href="../../gallery.aspx">
<img src="../../icons/film.png" alt="" /><span> Galeri Foto</span></a> </li>
<li><a class="ajax-link" href="../../about.aspx">
<img src="../../icons/user.png" alt="" /><span> Tentang Kami</span></a> </li>
<li class="nav-header hidden-md">
<h4>
User</h4>
</li>
<li><a class="ajax-link" href="../../module.aspx">
<img src="../../icons/view_sent_summary.png" alt="" /><span> Module</span></a>
</li>
<li><a class="ajax-link" href="../../rules.aspx">
<img src="../../icons/table_format.png" alt="" /><span> Rules</span></a> </li>
<li><a class="ajax-link" href="../../qna.aspx">
<img src="../../icons/layout_link.png" alt="" /><span> Q&A</span></a> </li>
<li><a class="ajax-link" href="../../library.aspx">
<img src="../../icons/book.png" alt="" /><span> Library</span></a> </li>
<%--<li><a class="ajax-link" href="../../panel.aspx"><img src="../../icons/film_go.png" alt="" /><span> Panel/Kelas Digital</span></a>
</li>--%>
<li><a class="ajax-link" href="../../testimonial.aspx">
<img src="../../icons/new_comment.png" alt="" /><span> Testimonial</span></a>
</li>
<%--<li><a class="ajax-link" href="../../forum/forum.aspx"><img src="../../icons/comment_box.png" alt="" /><span> Forum</span></a>
</li>--%>
<li class="nav-header hidden-md" id="mnAdmin" runat="server">
<h4>
Admin</h4>
</li>
<li id="mnStatistik" runat="server"><a class="ajax-link" href="../../admin/statistik.aspx">
<img src="../../icons/quota_modification.png" alt="" /><span> Statistik Pengguna</span></a>
</li>
<li id="mnGaleri" runat="server"><a class="ajax-link" href="../../admin/galeriFoto.aspx">
<img src="../../icons/film.png" alt="" /><span> Galeri Foto</span></a> </li>
<li id="mnModule" runat="server"><a class="ajax-link" href="../../admin/module.aspx">
<img src="../../icons/view_sent_summary.png" alt="" /><span> Module</span></a>
</li>
<li id="mnRules" runat="server"><a class="ajax-link" href="../../admin/rules.aspx">
<img src="../../icons/table_format.png" alt="" /><span> Rules</span></a> </li>
<li id="mnLibrary" runat="server"><a class="ajax-link" href="../../admin/library.aspx">
<img src="../../icons/book.png" alt="" /><span> Library</span></a> </li>
<%--<li id="mnForum" runat="server"><a class="ajax-link" href="../../admin/forums.aspx"><img src="../../icons/comment_edit.png" alt="" /><span> Forums</span></a>
</li>
<li id="mnCategory" runat="server"><a class="ajax-link" href="../../admin/category.aspx"><img src="../../icons/color_picker_default.png" alt="" /><span> Categories</span></a>
</li>--%>
<li id="mnLevel" runat="server"><a class="ajax-link" href="../../admin/level.aspx">
<img src="../../icons/allow_users_edit_ranges.png" alt="" /><span> Level</span></a>
</li>
<li id="mnUser" runat="server"><a class="ajax-link" href="../../admin/users.aspx">
<img src="../../icons/user.png" alt="" /><span> Registrasi Pengguna</span></a>
</li>
<li class="accordion" id="Li3" runat="server"><a href="#" id="mnTest" runat="server">
<img src="../../icons/computer_edit.png" alt="" /><span> Test</span></a>
<ul class="nav nav-pills nav-stacked">
<li id="mnMasterTipe" runat="server"><a class="ajax-link" href="../../admin/masterTipe.aspx">
Master Tipe</a></li>
<li id="mnPreTest" runat="server"><a class="ajax-link" href="../../admin/preTest.aspx">
Pre Test</a></li>
<li id="mnSetPre" runat="server"><a class="ajax-link" href="../../admin/SettingPretest.aspx">
Setting Pre Test</a></li>
<li id="mnPostTest" runat="server"><a class="ajax-link" href="../../admin/postTest.aspx">
Post Test</a></li>
<li id="mnSetPost" runat="server"><a class="ajax-link" href="../../admin/SettingPostest.aspx">
Setting Post Test</a></li>
</ul>
</li>
<li id="mnReport" runat="server"><a class="ajax-link" href="../../admin/report.aspx">
<img src="../../icons/page.png" alt="" /><span> Report</span></a> </li>
</ul>
</div>
</div>
</div>
<!--/span-->
<!-- left menu ends -->
<div id="content" class="col-lg-10 col-sm-10">
<!-- content starts -->
<div>
<ul class="breadcrumb">
<li>
<h4>
<asp:Label ID="lblInfo" runat="server"></asp:Label></h4>
</li>
<%-- <li>
<a href="#">Dashboard</a>
</li>--%>
</ul>
</div>
<!--/list-->
<div class="row">
<div class="box col-md-12">
<div class="box-inner">
<div class="box-header well">
<h2>
<img src="../../icons/time.png" alt="" />
Waktu Pengerjaan Test</h2>
<div class="box-icon">
<a href="#" class="btn btn-minimize">
<img src="../../icons/control_eject_blue.png" alt="" /></a>
</div>
</div>
<div class="box-content">
<!--/isi content-->
<form name="cd">
<center>
<div style="margin-left: 190px">
<input id="txtdisp" readonly="true" type="text" value="10:00" border="0" name="disp"></div>
</center>
</form>
<!--/akhir content-->
</div>
</div>
</div>
</div>
<!--/list-->
<div class="row">
<div class="box col-md-12">
<div class="box-inner">
<div class="box-header well">
<h2>
<img src="../../icons/table_tab.png" alt="" />
Silahkan Isi Pre Test Di Bawah ini sebelum PLAY & OPEN File</h2>
<div class="box-icon">
<a href="#" class="btn btn-minimize">
<img src="../../icons/control_eject_blue.png" alt="" /></a>
</div>
</div>
<div class="box-content">
<!--/isi content-->
<%--<asp:GridView runat="server" id="grd" AutoGenerateColumns="false" Width="100%">--%>
<asp:Label ID="lblKodeModule" runat="server" ForeColor="Red" Font-Size="X-Small"
Visible="false" />
<asp:Label ID="lblKodeTipe" runat="server" ForeColor="Red" Font-Size="X-Small" Visible="false" />
<asp:GridView ID="grdView" runat="server" AllowPaging="true" Width="100%" AutoGenerateColumns="False"
CellPadding="4" ForeColor="#333333" OnPageIndexChanging="ShowPageCommand" PageSize="1">
<AlternatingRowStyle BackColor="#E6E6FA" ForeColor="Black" Font-Italic="false" />
<HeaderStyle CssClass="HeaderGrid" />
<PagerSettings FirstPageText="First" LastPageText="Last" Mode="NextPrevious" PreviousPageText="Previous"
NextPageText="Next" Visible="false" />
<PagerStyle CssClass="PagerGrid" />
<RowStyle CssClass="IsiGrid" Wrap="false" />
<Columns>
<asp:TemplateField HeaderText="No.">
<ItemTemplate>
<%# Container.DataItemIndex + 1 %>
</ItemTemplate>
<HeaderStyle Width="30px" HorizontalAlign="Center" />
<ItemStyle Width="30px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Pertanyaan">
<ItemTemplate>
<h5>
<asp:Label ID="qstn" runat="server" Text='<%#Eval("question") %>'></asp:Label></h5>
<asp:RadioButton ID="rad1" runat="server" Text='<%#Eval("op1") %>' GroupName="A" /><br />
<asp:RadioButton ID="rad2" runat="server" Text='<%#Eval("op2") %>' GroupName="A" /><br />
<asp:RadioButton ID="rad3" runat="server" Text='<%#Eval("op3") %>' GroupName="A" /><br />
<asp:RadioButton ID="rad4" runat="server" Text='<%#Eval("op4") %>' GroupName="A" /><br />
<asp:HiddenField ID="hf" runat="server" Value='<%#Eval("subject_code") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<br />
<asp:UpdatePanel ID="updatePanel2" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:Button class="btn btn-primary btn-sm" ID="btnFirst" runat="server" Text="Awal" />
<asp:Button class="btn btn-primary btn-sm" ID="btnNext" runat="server" Text="Lanjut" />
<asp:Button class="btn btn-primary btn-sm" ID="btnPrev" runat="server" Text="Kembali" />
<asp:Button class="btn btn-primary btn-sm" ID="btnLast" runat="server" Text="Akhir" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnFirst" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="btnNext" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="btnPrev" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="btnLast" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<!--/akhir content-->
</div>
</div>
</div>
</div>
<!-- ModalPopupExtender Login -->
<asp:LinkButton ID="lnkDummy" runat="server"></asp:LinkButton>
<cc1:ModalPopupExtender ID="modalPopUpLogin" runat="server" PopupControlID="pnlConfirmLogin"
TargetControlID="lnkDummy" CancelControlID="btnModalCancelLogin" BackgroundCssClass="modalBackground">
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlConfirmLogin" runat="server" CssClass="modalPopup" align="center"
Style="display: none" Height="170px" Width="330px" Font-Names="Tahoma" Font-Size="Small">
<div class="header">
Peringatan !!!
</div>
<div class="body">
Anda harus melakukan LOGIN untuk mengakses halaman ini.
</div>
<div class="footer" align="center">
<asp:Button ID="btnModalOKLogin" CssClass="btn btn-primary btn-sm" runat="server"
Text="OK" OnClick="btnModalOKLogin_Click" />
<asp:Button ID="btnModalCancelLogin" runat="server" Text="OK" Style="display: none;" />
</div>
</asp:Panel>
<asp:Button ID="ButtonHdnLogin" runat="server" Text="Button" Style="display: none;" />
<!-- Akhir ModalPopupExtender Login -->
<!-- ModalPopupExtender Hak Akses -->
<cc1:ModalPopupExtender ID="modalPopUpAkses" runat="server" PopupControlID="pnlConfirmAkses"
TargetControlID="ButtonHdnAkses" CancelControlID="btnModalCancelAkses" BackgroundCssClass="modalBackground">
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlConfirmAkses" runat="server" CssClass="modalPopup" align="center"
Style="display: none" Height="150px" Width="300px" Font-Names="Tahoma" Font-Size="Small">
<div class="header">
Peringatan !!!
</div>
<div class="body">
Anda tidak memiliki Hak untuk mengakses Halaman ini
</div>
<div class="footer">
<asp:Button ID="btnModalOKAkses" runat="server" Text="OK" OnClick="btnModalOKAkses_Click"
CssClass="btn btn-primary btn-sm" />
<asp:Button ID="btnModalCancelAkses" runat="server" Text="OK" CssClass="btn btn-primary btn-sm"
Style="display: none;" />
</div>
</asp:Panel>
<asp:Button ID="ButtonHdnAkses" runat="server" Text="Button" Style="display: none;" />
<!-- Akhir ModalPopupExtender Hak Akses -->
<footer class="row">
<p class="col-md-9 col-sm-9 col-xs-12 copyright">©2017 <a href="#">Arie Gunawan, SKom., MMSi.</a> </p>
<p class="col-md-3 col-sm-3 col-xs-12 powered-by">Powered by: <a href="#">System Development</a></p>
</footer>
</div>
<!--/.fluid-container-->
</div>
</div>
</form>
</body>
</html>
Screenshot