Mano Prathibhan C
Mano Prathibhan C

Reputation: 518

ASP.NET Executing JavaScript Confirm alert message in C# code behind only if condition is satisfied

I am using a confirmation window that will add a new value to database if the user clicks OK in the popup window. Also i have to verify a specific criteria before that. I have button and text box and the text box contains a required field validator. So if i click the button this validator fires first.

I will enter a number in this text box and press add, it will fetch a name value corresponding to this number from database and if name is found then it should ask a confirmation "Do you want to add this name?" and if name is not found then it should just popup a alert saying "name not found". If number value is less than 6 then it will show another popup saying "number not valid". I have done this as given below.

ASP.NET

<asp:TextBox ID="text_add" runat="server" MaxLength="6"></asp:TextBox>
<asp:RequiredFieldValidator ID="required_add_" ControlToValidate="text_add" ErrorMessage="Required" runat="server">Required</asp:RequiredFieldValidator>
<asp:Button ID="button_add" runat="server" Text="Add" OnClientClick="Confirm()" OnClick="button_add_Click" />

JavaScript

<script type = "text/javascript">
    function Confirm() {
        if (Page_ClientValidate()) {
            var confirm_value = document.createElement("INPUT");
            confirm_value.type = "hidden";
            confirm_value.name = "confirm_value";
            if (confirm("Do you confirm?")) {
                confirm_value.value = "Yes";
            } else {
                confirm_value.value = "No";
            }
            document.forms[0].appendChild(confirm_value);
        }
    }
</script>

C#

protected void button_add_Click(object sender, EventArgs e)
{
    if (text_add.Text.Length < 6)
    {
        ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "alert('Number not valid!')", true);
    }
    else
    {
        //fetch name from DB
        if (//name found)
        {
            string confirmValue = Request.Form["confirm_value"];
            if (confirmValue == "Yes")
            {
                //add the name
            }
        }
        else
        {
            ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "alert('Name not found!')", true);
        }
    }
}

Here what happens is whenever i enter a number into text box and click the button, the Confirm() function is executed at first even if the number is less than 6 digits and in case i enter 6 digits and the name is not found in database same way the Confirm() function is executed. If i enter number less than 6 digits the confirm box comes first and after that the alert saying "number not valid" comes. How can i fire the confirm() function only if the conditions are met. I want to fire the confirm() function only if the button press event goes into the if (//name found) condition.

EDIT

I have removed the OnClientClick from the button and then changed the C# code to the following

protected void button_add_Click(object sender, EventArgs e)
{
    if (text_add.Text.Length < 6)
    {
        ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "alert('Number not valid!')", true);
    }
    else
    {
        //fetch name from DB
        if (//name found)
        {
            ScriptManager.RegisterStartupScript(this, typeof(string), "confirm", "Confirm();", true);
            string confirmValue = Request.Form["confirm_value"];
            if (confirmValue == "Yes")
            {
                this.AddData(sender, e);
            }
        }
        else
        {
            ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "alert('Name not found!')", true);
        }
    }
}

protected void AddData(object sender, EventArgs e)
{
    // add data
}

I have made a seperte function to add data. I have added the ScriptManager to open confirm box and removed the OnClientClick in button. Now when i press the button the confirm box opens only if all conditions are satisfied. But when i press OK in confirm box nothing happens. The AddData function is not executed.

Upvotes: 1

Views: 3231

Answers (2)

Farzin Kanzi
Farzin Kanzi

Reputation: 3435

You must have a hidden field between your post backs that shows it is in first post back or after confirmation:

<asp:HiddenField ID="isReadyForSave" runat="server" Value="false"/>

And change your code:

protected void button_add_Click(object sender, EventArgs e)
{
 if(isReadyForSave.Value == "true" && Request.Form["confirm_value"] == "yes")
 {
  AddData();
  isReadyForSave.Value = "false";
  return;
 }
if (text_add.Text.Length < 6)
{
    ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "alert('Number not valid!')", true);
}
else
{
    //fetch name from DB
    if (//name found)
    {
        ScriptManager.RegisterStartupScript(this, typeof(string), "confirm", "Confirm();", true);


            isReadyForSave.Value = "true";

    }
    else
    {
        ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "alert('Name not found!')", true);
    }
}
}

And change you javascript confirm() function to this:

function Confirm() {
if (Page_ClientValidate() && 
 document.getElementById('text_add').value.length >5) {
    var confirm_value = document.createElement("INPUT");
    confirm_value.type = "hidden";
    confirm_value.name = "confirm_value";
    if (confirm("Do you confirm?")) {
        confirm_value.value = "Yes";
    } else {
        confirm_value.value = "No";
    }
    document.forms[0].appendChild(confirm_value);
    return true;
}
else return false;
} 

Upvotes: 0

Farzin Kanzi
Farzin Kanzi

Reputation: 3435

Change your confirm function to this:

function Confirm() {
    if (Page_ClientValidate() && 
  document.getElementById('text_add').value.length >5) {
        var confirm_value = document.createElement("INPUT");
        confirm_value.type = "hidden";
        confirm_value.name = "confirm_value";
        if (confirm("Do you confirm?")) {
            confirm_value.value = "Yes";
        } else {
            confirm_value.value = "No";
        }
        document.forms[0].appendChild(confirm_value);
    }
   else return false;
} 

And change The

onClientClick=Confirm();

to this:

onClientClick= return Confirm()

to avoid submit under 6 length text.

Upvotes: 0

Related Questions