hello everyone, i have a button in asp.net as follows
<asp:Button ID="btnNext" runat="server" Height="26px" OnClientClick="return CheckIfOptionSelected();" OnClick="btnNext_Click" Text="Next"
Width="77px" />
i have done some validation to radio buttons, if nothing is selected in the radio buttons then it returns false...hence the server side event does not fire. This works fine, however, i have a jquery timer...and according to the requirement...after the timer elapse i want to submit the form...or cause the onclick to fire no matter what...so i've written the following
function CheckIfOptionSelected() {
var radioButton1 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_0'];
var radioButton2 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_1'];
var radioButton3 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_2'];
var radioButton4 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_3'];
if (radioButton1.checked != true && radioButton2.checked != true && radioButton3.checked != true && radioButton4.checked != true && countdownCurrent != 0) {
return false;
}
else {
countdownReset();
return true;
}
}
function countdownReset() {
var newCount = parseInt($('#ctl00_MainContent_example2submit').val()) * 100;
if (newCount > 0) { countdownCurrent = newCount; }
}
now this works fine as well...but only when nothing is selected in the radiobuttonlist...however ,if i select an item...and let the timer elapse...in this case the onclick does not fire. I don't know what the issue is?...FYI- the jquery causes the "Next" button to Click itself when the timer elapse.
the jquery i'm using...
var countdownTimer, countdownCurrent;
$(document).ready(function () {
countdownCurrent = $('#ctl00_MainContent_example2submit').val() * 100;
countdownTimer = $.timer(function () {
var min = parseInt(countdownCurrent / 6000);
var sec = parseInt(countdownCurrent / 100) - (min * 60);
var micro = pad(countdownCurrent - (sec * 100) - (min * 6000), 2);
var output = "00"; if (min > 0) { output = pad(min, 2); }
$('.countdowntime').html(output + ":" + pad(sec, 2) + ":" + micro);
if (countdownCurrent == 0) {
var btn = document.getElementById('<%=btnNext.ClientID%>');
btn.click();
} else {
countdownCurrent -= 7;
if (countdownCurrent < 0) { countdownCurrent = 0; }
}
}, 70, true);
$('#example2submit').bind('keyup', function (e) { if (e.keyCode == 13) { countdownReset(); } });
});
another thing i noticed is that the generated HTML contains onclick="return CheckIfOptionSelected();"...
<div class="ctrlStyle1">
<span id="ctl00_MainContent_btnNext$ajaxdest" name="__ajaxmark"><input type="submit" name="ctl00$MainContent$btnNext" value="Next" onclick="return CheckIfOptionSelected();" id="ctl00_MainContent_btnNext" style="height:26px;width:77px;" /></span>
<span id="ctl00_MainContent_btnSubmit$ajaxdest" name="__ajaxmark"></span>
</div>