Javascript Confirm not Stopping request from post back if pressed cancel? - javascript

I am using Javascript function with confirm() message box and also having RequiredFieldValidator if I press cancel on my confirm message box but ValidatorGroup is true then it not stopping a request from getting post back.
I want to implement in such a way that If validatorGroup is treu but function return false then request should not get post back
Here is my Code:-
<asp:Button ID="btnStaffSendRequest" runat="server" Text="Send" OnClientClick="UploadRefrrel()"
UseSubmitBehavior="false" ValidationGroup="SaveRequestGroup" OnClick="btnStaffSendRequest_OnClick"
TabIndex="1000" />
Here is my Javascript Function:-
<script language="javascript" type="text/javascript">
function UploadRefrrel() {
var hiddenFile = this.document.getElementById("<%= hfInputForm.ClientID %>");
var upload = $find("<%= radUploadFiles.ClientID %>");
var inputs = upload.getUploadedFiles();
var retVal;
if (hiddenFile != null && hiddenFile.value != "" && inputs.length == 0) {
retVal = confirm("FYI - Only 'Referral Form' is attached. Do you want to proceed without any other attachment?");
}
return retVal;
}
</script>

<asp:CustomValidator ID="validatePostBack" runat="server" Display="None" ClientValidationFunction="Validate_PostBack"
ValidationGroup="SaveRequestGroup" ErrorMessage="<br /> Please add other attachment."></asp:CustomValidator>
<telerik:RadScriptBlock ID="uploadReferel" runat="server">
<script language="javascript" type="text/javascript">
function Validate_PostBack(sender, e) {
var hiddenFile = this.document.getElementById("<%= hfInputForm.ClientID %>");
var upload = $find("<%= radUploadFiles.ClientID %>");
var inputs = upload.getUploadedFiles();
if (hiddenFile != null && hiddenFile.value != "" && inputs.length == 0) {
var retVal = confirm("FYI - Only 'Referral Form' is attached. Do you want to proceed without any other attachment?");
if (retVal == true) {
e.IsValid = true;
}
else {
e.IsValid = false;
}
}
}
</script>
</telerik:RadScriptBlock>
Found my solution and working fine

Related

Form validation for Empty checking is not working properly In asp.net

I want to validate my form to avoid Empty. I am using asp.net inbuilt controls on my page i am using loop to check all fields are fill or not but its always showing empty even-though after filled all field. Is there any another approach to achieve same.
I have design my page in such way that its post back after selection of drop down list. that's why its not working i don't know.
<body>
<form id="form1" runat="server">
<div id="DivMainWindow" class="mainHeaderOuter">
<%--Inside this Div my all ASP controls are present--%>
<asp:ListBox ID="ddlregion" runat="server"
<asp:ListItem Value="0">Select</asp:ListItem>
</asp:ListBox>
<dx:ASPxDateEdit ID="deOrderDate" runat="server" Width="220px" AllowUserInput="false" Height="25px"EditFormatString="dd-MMM-yyyy" DisplayFormatString="dd-MMM-yyyy" EditFormat="Custom"ClientInstanceName="deOrderDate" OnInit="deOrderDate_Init">
..............
<asp:Button ID="btnGenerate" OnClientClick="return validate();" runat="server" OnClick="btnGenerate_Click" Text="Generate" />
so on
JAva script :
<script>
function validate() {
var inputTags = document.getElementsByTagName("input");
for (i = 0; i < inputTags.length; i++) {
if (inputTags[i].value === "") {
alert("All fields are required");
return false;
}
}
return true;
}
while inspecting on browser i am getting this :
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="">
I also tried individual control to check its empty or not but its not looping in such a way :
var Region = document.getElementById('<%=ddlregion.ClientID %>').value;
var Depot = document.getElementById('<%=ddlDepot.ClientID %>').value;
var INQFileType = document.getElementById('<%=ddlInqfileType.ClientID %>').value;
var QUOFileType = document.getElementById('<%=ddlqoutatfileType.ClientID %>').value;
var elements = document.getElementById("form1").elements;
for (var i = 0, element; element = elements[i++];) {
if (deOrderDate.GetValue() == null) {
alert("Please Enter Order Date");
return false;
}
if (Region == "None Selected" || null) {
alert("Please Select Region");
return false;
}
if (Depot == "Select" || null) {
alert("Please Select Depot");
return false;
}
if (deInqDate.GetValue() == null) {
alert("Please Enter INQ Date");
return false;
}
if (QUOFileType == "Select") {
alert("Please Select File Type");
return false;
}
}
}
What i need to change in that to fix this issues

Call javascript from textbox clear 'x' event

I have two fields where the user can only write in one or the other, we validate the client side using the javascript below. The problem that I have is that the textboxes by default have a clear 'x' that when used doesn't trigger the javascript leaving one of the fields disabled.
How can I call the javascript function when the user clicks the clear 'x' of the textbox in order to get both fields enabled?
<asp:TextBox ID="txtFIELD1Val" runat="server" onKeyup="javascript:clearFields();" TabIndex="1" CssClass="cssTextbox"></asp:TextBox>
<asp:TextBox ID="txtFIELD2Val" runat="server" onKeyup="javascript:clearFields();" TabIndex="2" CssClass="cssTextbox"></asp:TextBox>
function clearFields() {
var txtFIELD1 = document.getElementById('<%= txtFIELD1Val.ClientID %>');
var txtFIELD2 = document.getElementById('<%= txtFIELD2Val.ClientID %>');
//Enable/Disable FIELD1 and FIELD2 fields based on text.
if (txtFIELD1.value == "" && txtFIELD2.value == "") {
txtFIELD1.disabled = false;
txtFIELD2.disabled = false;
}
else if (txtFIELD1.value == "" || txtFIELD2.value != "") {
txtFIELD1.disabled = true;
txtFIELD2.disabled = false;
}
else if (txtFIELD1.value != "" || txtFIELD2.value == "") {
txtFIELD1.disabled = false;
txtFIELD2.disabled = true;
}
}
Remove IE10's "clear field" X button on certain inputs?
See the second answer, seems to be the best approach to getting rid of the 'X' and the problems it's causing.

JavaScript Code Is Not Working In Ajax Model PopUp

in my webpage in a model PopUp Window i am comparing ages present in two textBox,using javascript but somehow it is not working.
kindly help to overcome from this issue.
Thanks In Advance.
my javascript code is
function CompareAge() {
var maxage = document.getElementById('<%=txtMaxAge.ClientID%>');
var minage = document.getElementById('<%=txtMinAge.ClientID%>');
var val = 'false';
if (maxage>=minage) {
val = 'true';
return true;
}
if (val == 'false') {
alert('Max-Age Alaways greater than or Equal Min-Age');
return false;
}
}
and popup window is like this
<ul>
<li>
<asp:Button ID="btnCancelInPopUpReservation" runat="server" CssClass="button" Text="Cancel" />
</li>
<li>
<asp:Button ID="btnSaveInPopUpReservation" runat="server" CssClass="button" Text="Save" OnClick="btnSaveInPopUpReservation_Click" ValidationGroup="g" OnClientClick="if(!CompareAge()) return false;"/>
</li>
I just tried your piece of code I think the problem lies here you should use .value for getting value in var maxage and var minage.
document.getElementById('<%= txtMaxAge.ClientID %>').value
document.getElementById('<%= txtMinAge.ClientID %>').value
<script type="text/javascript">
function CompareAge() {
var maxage = document.getElementById('<%= txtMaxAge.ClientID %>').value;
var minage = document.getElementById('<%= txtMinAge.ClientID %>').value;
var val = 'false';
if (maxage >= minage) {
val = 'true';
return true;
}
if (val == 'false') {
alert('Max-Age Alaways greater than or Equal Min-Age');
return false;
}
}

how to capture javascript var value into asp.net page

I have an asp.net page on which at a click on Button (btn1), i want to show message box asking user a question "Do you want to overwrite ?" with button "Ok/Overwrite" and "Cancel" , and based on user response , i will have to update my database.
So i was trying to accomplish it using Javascript Confirm function
var r = Confirm('Do you want to overwrite ?)
but now i have to capture this Var r into my page so that i can update my database accordingly
any help how can i do it ?
On this scenario, you don't need to pass in the value of r to the server; you simply don't postback.
Just have something like this:
<asp:button id="btn1" runat="server" OnClientClick="return confirm('Overwrite?');" OnClick="btn1_Click" Text="Submit" />
If the users clicks "OK" then the page will post back and you will update the DB. If the user clicks cancel, the page won't postback at all and you won't have to do anything.
Here is your code:-
Add a hidden field in Net(.aspx) page
<form id="form10" runat="server">
<asp:HiddenField ID="hdnField" runat="server" Value="false" />
</form>
The hidden field should be added under Form Tag.The value of this hidden field is initially "false".
Here is what you need to do in Code Behind file (.cs file)
protected void btnSubmits_Click(object sender, EventArgs e)
{
if (hdnField.Value == "false")
{
AddJavascriptCode(itemValue);
}
else if (hdnField.Value == "true")
{
lblMsg.Text = string.Format("You have entered {0}", itemValue);
hdnField.Value = "false";
}
}
Here is the code to capture the response from OK/Confirm or Cancel button.
private void AddJavascriptCode(string itemValue)
{
string script = #"<script language=""JavaScript"" type=""text/javascript"">
window.onload=function()
{
var IsConfirm = 1;
objField = document.getElementById('" + hdnField.ClientID + #"');
objSubmit = document.getElementById('" + btnSubmit.ClientID + #"');
IsConfirm = newConfirm('Test','You have entered " + itemValue + #" value. Do you want to overwrite ?',1,1,0);
if(IsConfirm == true)
{
objField.value = 'true';
objSubmit.click();
}
else
{
objField.value = 'false';
}
}
function newConfirm(title,mess,icon,defbut,mods)
{
if (document.all)
{
retVal = confirm(mess);
retVal = (retVal==1)
}
else
{
retVal = confirm(mess);
}
return retVal;
}
</script>";
Page.ClientScript.RegisterStartupScript(this.GetType(), "Test", script);
}
}
Hope this helps you :).

User Control with Client + Server Side CustomValidation; Wrong Client side validator is picked

I have a user control which contains a CustomValidator which is used according to whether a RadioButton is checked or not (there are several RadioButtons, I'm only showing the relevant one)
<asp:RadioButton runat="Server" ID="RadioBetween" GroupName="DateGroup" CssClass="date_group_options_control_radio" />
<asp:TextBox ID="FromDate" runat="server" Columns="8"></asp:TextBox>
<asp:TextBox ID="ToDate" runat="server" Columns="8"></asp:TextBox>
<asp:CustomValidator ID="DateValidator" runat="server" Display="Dynamic" ClientValidationFunction="ValidateDateFields_Client" OnServerValidate="ValidateDateFields"></asp:CustomValidator>
There is some client + server side validation code (the server side code does exactly the same thing and is skipped for brevity)
<script type="text/javascript">
function ValidateDateFields_Client(source, args)
{
if ("<%=EnableValidation%>" == "True")
{
var bRadioBetweenSelected = false;
var oRadio = document.getElementById('<%=RadioBetween.ClientID%>');
if (oRadio != null && (oRadio.checked == true || oRadio["checked"] == true))
{
bRadioBetweenSelected = true;
}
if (bRadioBetweenSelected)
{
var oFromDate = document.getElementById('<%=FromDate.ClientID%>');
var oToDate = document.getElementById('<%=ToDate.ClientID%>');
if (oFromDate != null && oToDate != null)
{
var sFromDate = oFromDate.value;
var sToDate = oToDate.value;
source.innerHTML = ValidateFromToDate(sFromDate, sToDate, args);
if (!args.IsValid)
{
return;
}
}
else
{
args.IsValid = true;
}
}
else
{
args.IsValid = true;
}
}
}
</script>
There are two instances of this control in the page. When running the client side version it hits the wrong one (the version of the control which is disabled). You can see from the generated HTML both are correctly specified. I'm not sure how .NET works out which clientside function to call given they both have the same name.
<script type="text/javascript">
//<![CDATA[
var ctl00_MCPH1_QueryTextValidator = document.all ? document.all["ctl00_MCPH1_QueryTextValidator"] : document.getElementById("ctl00_MCPH1_QueryTextValidator");
ctl00_MCPH1_QueryTextValidator.controltovalidate = "ctl00_MCPH1_SearchTextBox";
ctl00_MCPH1_QueryTextValidator.focusOnError = "t";
ctl00_MCPH1_QueryTextValidator.display = "Dynamic";
ctl00_MCPH1_QueryTextValidator.evaluationfunction = "CustomValidatorEvaluateIsValid";
ctl00_MCPH1_QueryTextValidator.clientvalidationfunction = "ValidateQueryText_Client";
ctl00_MCPH1_QueryTextValidator.validateemptytext = "true";
var ctl00_MCPH1_DisplayOptionsControl1_DateValidator = document.all ? document.all["ctl00_MCPH1_DisplayOptionsControl1_DateValidator"] : document.getElementById("ctl00_MCPH1_DisplayOptionsControl1_DateValidator");
ctl00_MCPH1_DisplayOptionsControl1_DateValidator.display = "Dynamic";
ctl00_MCPH1_DisplayOptionsControl1_DateValidator.evaluationfunction = "CustomValidatorEvaluateIsValid";
ctl00_MCPH1_DisplayOptionsControl1_DateValidator.clientvalidationfunction = "ValidateDateFields_Client";
var ctl00_MCPH1_PreferencesControl1_PreferencesTabContainer_DisplayOptionsTab_DisplayOptionsControl_DateValidator = document.all ? document.all["ctl00_MCPH1_PreferencesControl1_PreferencesTabContainer_DisplayOptionsTab_DisplayOptionsControl_DateValidator"] : document.getElementById("ctl00_MCPH1_PreferencesControl1_PreferencesTabContainer_DisplayOptionsTab_DisplayOptionsControl_DateValidator");
ctl00_MCPH1_PreferencesControl1_PreferencesTabContainer_DisplayOptionsTab_DisplayOptionsControl_DateValidator.display = "Dynamic";
ctl00_MCPH1_PreferencesControl1_PreferencesTabContainer_DisplayOptionsTab_DisplayOptionsControl_DateValidator.evaluationfunction = "CustomValidatorEvaluateIsValid";
ctl00_MCPH1_PreferencesControl1_PreferencesTabContainer_DisplayOptionsTab_DisplayOptionsControl_DateValidator.clientvalidationfunction = "ValidateDateFields_Client";
//]]>
</script>
Do i need to add something in to scope it? What's the best way to achieve this? If I disable the loading of the second control everything works fine.
Your client validation function is generated with the same name for both your user controls. There will be two ValidateDateFields_Client() functions in your page, and of course the interpreter will only call one of them.
One way to work around that problem would be to generate unique function names:
<script type="text/javascript">
function ValidateDateFields_Client_<%=RadioBetween.ClientID%>(source, args)
{
// ...
}
</script>
<asp:CustomValidator ID="DateValidator" runat="server" Display="Dynamic"
ClientValidationFunction="ValidateDateFields_Client_"
OnServerValidate="ValidateDateFields"></asp:CustomValidator>
protected void Page_PreRender(object sender, EventArgs e)
{
DateValidator.ClientValidationFunction += RadioBetween.ClientID;
}

Categories

Resources