Click here to Skip to main content
15,918,404 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
HI All,

I have created an ASP.Net form that has 2 labels, 2 textboxes & 2 buttons.
I want to pass the values in ASP.Net textboxes to JavaScript function and trigger is from code behind.

I have successfully triggered the JavaScript function from code behind using the below statement.

C#
protected void btnOK_Click(object sender, EventArgs e)
        {

         ScriptManager.RegisterClientScriptBlock(this, GetType(), "MyKey", "myFunction();", true);

        }

But when I tried to pass the values it didn't give me an output.
HTML
<script  type ="text/javascript" >
        function myFunction() {
      
            var vUserName = document.getElementById("txtUserName").value;
            var vPassword = document.getElementById("txtPassword").value;
           
            var vFullInfo = vUserName + vPassword;
            
            alert(vFullInfo);

        }
</script>


What I have tried:

Below is the full source code for the total solution.

Form01
ASP.NET
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="frmStudInfo.aspx.cs" Inherits="WebApplication01.frmStudInfo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>First ASP.Net Application</title>

    <script  type ="text/javascript" >
        function myFunction() {
      
            var vUserName = document.getElementById("txtUserName").value;
            var vPassword = document.getElementById("txtPassword").value;
           
            var vFullInfo = vUserName + vPassword;
            
            alert(vFullInfo);
        }
</script>

</head>
<body>
    <form id="form1" runat="server" method="post">

        <asp:Label ID="Label1" runat="server" Text="User Name"></asp:Label>
        <asp:TextBox ID="txtUserName" runat="server"></asp:TextBox>
        <br />
        <asp:Label ID="Label2" runat="server" Text="Password"></asp:Label>
        <asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
        <br />
        <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
        <asp:Button ID="btnOK" runat="server" OnClick="btnOK_Click" Text="OK" />
    
    </form>
</body>
</html>


Code Behind Form 01
C#
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication01
{
    public partial class frmStudInfo : System.Web.UI.Page
    {
        private string strUserName;
        private string strPassword;

        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void btnOK_Click(object sender, EventArgs e)
        {

         ScriptManager.RegisterClientScriptBlock(this, GetType(), "MyKey", "myFunction();", true);

        }
    }
}


I checked the code and find out the JavaScript function i.e. MyFunction() does not capture the values from the form. So that the issue is at the passing values from the form to the JS function.

Could someone please explain what whould have gone wrong?

Thanks,
Chiranthaka
Posted
Updated 25-Feb-18 19:49pm
v2
Comments
A_Griffin 24-Feb-18 9:24am    
At what point do you want to pass these values to your JS function? Forget ScriptManager - I've never found a use for it yet. If you want it when btnOK is clicked, simply add
btnOK.Attributes.Add("onclick", "return myFunction()");
in page_load in your code behind, and make your function return true or false according to whether or not you want to button for post back or not. (You should not nee the OnClick="btnOK_Click" in your markup.)
Chiranthaka Sampath 7-Apr-18 5:06am    
Once I execute the ASP.Net Form, I will type the values into the text boxes and after that I will click on the 'OK' button. At that point I want to pass the values in the text boxes to the JavaScript function. Triggering the JavaScript() function from code behind have achieved with ScriptManager. But still the alert shows the values as null.

JavScript() is in the head tag

Try This:

Code behind:


protected void btnOK_Click(object sender, EventArgs e)
     {
         string fisrtname = "FirstName";
         string lastname = "LastName";
         Page.ClientScript.RegisterStartupScript(this.GetType(), "key", "showAlert('" + fisrtname + "','" + lastname + "');", true);

     }


Script:

<script type="text/javascript">
       function showAlert(mydata1, mydata2) {
           var vUserName = document.getElementById("txtUserName").value = mydata1;
           var vPassword = document.getElementById("txtPassword").value = mydata2;

           var vFullInfo = vUserName + vPassword;

           alert(vFullInfo);
       }
   </script>


Please vote, if solution works for you.
 
Share this answer
 
try
ScriptManager.RegisterStartupScript(this, GetType(), "MyKey", "myFunction();", true);

or
ClientScript.RegisterStartupScript(this.GetType(), "MyKey", "myFunction();", true);

both works.
 
Share this answer
 
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900