Having trouble with JavaScript function returning false?

Question

Having trouble with JavaScript function returning false?

I am trying to call a JavaScript function on an ASP.NET button client click event and want to prevent postback. The function is working, but it is not preventing the page from posting back. Here is my JavaScript code:

function User2Check()
    {
        var user2id=document.getElementById("txtP2UserName");
        var user2password=document.getElementById("txtP2Password");

        if(user2id.value=='' && user2password.value!='')
        {
            alert("User name is required");
            user2id = document.getElementById("txtP2UserName").focus();
            e.preventDefault();                
            return false;
        }
        if(user2id.value!='' && user2password.value=='')
        {
            alert("Password is required");
            user2id = document.getElementById("txtP2UserPassword").focus();
            e.preventDefault();                
            return false;

        }


    }

The way I am calling this function is:

<asp:Button runat="server" ID="btnSubmit" OnClientClick="return User2Check();" TabIndex="12" Text="Submit" onclick="btnSubmit_Click" />

Please provide guidance.

javascript asp.net

Answer 1

Answer №1

The parameter in your javascript function is not being passed from the button's OnClientClick event. It appears that despite e being null, the function continues to run because the focus() calls are made before any operations on e. This may be causing unexpected behavior in the function.

Answer 2

The parameter in your javascript function is not being passed from the button's OnClientClick event. It appears that despite e being null, the function continues to run because the focus() calls are made before any operations on e. This may be causing unexpected behavior in the function.

Answer 3

Answer №2

It is recommended to use && instead of &

if(user2id.value!='' && user2password.value=='')

AND : The Function requires an argument, but you are calling it without any argument

You can achieve this by:

function User2Check(e)
{
    var user2id=document .getElementById("txtP2UserName");
    var user2password=document .getElementById("txtP2Password");

    if(user2id.value=='')
    {
        alert("User name is required");
        user2id=document .getElementById("txtP2UserName").focus();
        e.preventDefault();                
        return false;
    }
    if(user2password.value=='')
    {
        alert("Password is required");
        user2id=document .getElementById("txtP2UserPassword").focus();
        e.preventDefault();                
        return false;
    }

    return true;
}

}

<asp:Button runat="server" ID="btnSubmit" OnClientClick="return User2Check(event);" TabIndex="12" Text="Submit" onclick="btnSubmit_Click" />

Answer 4

It is recommended to use && instead of &

if(user2id.value!='' && user2password.value=='')

AND : The Function requires an argument, but you are calling it without any argument

You can achieve this by:

function User2Check(e)
{
    var user2id=document .getElementById("txtP2UserName");
    var user2password=document .getElementById("txtP2Password");

    if(user2id.value=='')
    {
        alert("User name is required");
        user2id=document .getElementById("txtP2UserName").focus();
        e.preventDefault();                
        return false;
    }
    if(user2password.value=='')
    {
        alert("Password is required");
        user2id=document .getElementById("txtP2UserPassword").focus();
        e.preventDefault();                
        return false;
    }

    return true;
}

}

<asp:Button runat="server" ID="btnSubmit" OnClientClick="return User2Check(event);" TabIndex="12" Text="Submit" onclick="btnSubmit_Click" />

Answer 5

Answer №3

Try using the following code without including " e.preventDefault();" in it.

function User2Check()
{
var user2id=document .getElementById("txtP2UserName");
var user2password=document .getElementById("txtP2Password");

if(user2id.value=='')
{
    alert("User name is required");
    user2id=document .getElementById("txtP2UserName").focus();
    return false;
}
if(user2password.value=='')
{
    alert("Password is required");
    user2id=document .getElementById("txtP2UserPassword").focus();
    return false;
}
  return true;
}

Also, on the server side code make sure to include

<asp:Button runat="server" ID="btnSubmit" OnClientClick="return User2Check();" TabIndex="12" Text="Submit" onclick="btnSubmit_Click" />

Answer 6

Try using the following code without including " e.preventDefault();" in it.

function User2Check()
{
var user2id=document .getElementById("txtP2UserName");
var user2password=document .getElementById("txtP2Password");

if(user2id.value=='')
{
    alert("User name is required");
    user2id=document .getElementById("txtP2UserName").focus();
    return false;
}
if(user2password.value=='')
{
    alert("Password is required");
    user2id=document .getElementById("txtP2UserPassword").focus();
    return false;
}
  return true;
}

Also, on the server side code make sure to include

<asp:Button runat="server" ID="btnSubmit" OnClientClick="return User2Check();" TabIndex="12" Text="Submit" onclick="btnSubmit_Click" />

Answer 7

Answer №4

There is a typo in the function name - it should be focus();

Once that error occurs, the program will halt execution.

Answer 8

There is a typo in the function name - it should be focus();

Once that error occurs, the program will halt execution.

Answer 9

Answer №5

If it seems like you aren't getting a true response, try adding an exclamation point before the function name. Here's an example:

!function(){
    // Your code goes here!
}

Answer 10

If it seems like you aren't getting a true response, try adding an exclamation point before the function name. Here's an example:

!function(){
    // Your code goes here!
}

Having trouble with JavaScript function returning false?

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Leveraging jQuery template for JSON visualization

Steps for running the function saved in variable `x`, with the value `function(){alert('a')}` assigned to it

Creating a stylish gradient text color with Material-UI's <Typography /> component

Encountered a problem when incorporating delay functions into redux-saga testing using the Redux Saga Test Plan library

What steps can I take to reset my JavaScript code once its original purpose has been fulfilled?

achieving initial value to show upon page load

What is the best way to make tooltips track a specific data point they are connected to in D3?

The issue with Multiselect arises when the array is being set up initially

What is the best way to retrieve the second to last element in a list

Blending ASP.NET Core 2.0 Razor with Angular 4 for a Dynamic Web Experience

Notifications for AngularJS tabs

Tips for retrieving the content of an input field using Angular

At what point is the args variable required by Dojo?

Having an issue with displaying the country name and country code in a table using the Angular7 custom pipe

Errors in Data Capture from AJAX Dropdown Selections

Navigation Bar Dropdown Menu Not Responding to Clicks

Does D3 iterate through the entire array every time we define a new callback?

tips on assigning a unique ID to an item in a firebase database collection

ScrollReveal.js won't function as intended

scrollable material ui chips list with navigation arrows