Ibraheem Mansour
Ibraheem Mansour

Reputation: 99

Pass C# variable to JavaScript in ASP webforms

I'm using ASP web forms. Suppose I have a variable in my user control (ascx.cs)

protected void Page_Load(object sender, EventArgs e)
        {
            public string someText = "Hello World";
        }

I want to pass this variable to JavaScript. The code in the ascx file:

<%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CalendarUserControl.ascx.cs" Inherits="Fransabank.Calendar.CalendarUserControl" %>

<script type="text/javascript">
    console.log(someText);
</script>

I'm getting in the console window:

ReferenceError: someText is not defined

Upvotes: 2

Views: 4143

Answers (2)

DGibbs
DGibbs

Reputation: 14608

You can use an inline server tag:

public string SomeText
{
    get { return "sometext"; }
}

In your markup:

<script type="text/javascript">
    console.log(<%=SomeText%>);
</script>

Or you could use a HiddenField:

protected void Page_Load(object sender, EventArgs e)
{
     hdnSomeText.value = "sometext";
}

Markup:

<asp:HiddenField ID="hdnSomeText" runat="server" ClientIDMode="Static" />

<script type="text/javascript">
    console.log(document.getElementById('hdnSomeText').value);
</script>

Upvotes: 4

Kamil T
Kamil T

Reputation: 2216

EDIT

My bad, I thought you've been using ASP.Net MVC. I've left the MVC solution below, but I'll also show you how can this be done with ASP.Net.

In Web Forms, you can add a property in your code-behind:

public string someText {get; set;}

And in front-end:

<script type="text/javascript">
    console.log('<%= someText %>');
</script>

MVC Solution

Passing values like that can be achieved, but is - in most cases - wrong. You should rather use a ViewModel - this is what MVC was created for.

Create a Model:

public class MyViewModel
{
    public string someText {get; set;}
}

When you return your View from Controller, use:

public ActionResult Index
{
    return View(new MyViewModel() { someText = "lalalala" });
}

Your View (cshtml):

@model(MyViewModel) // be sure to use whole namespace, like Models.MyViewModel

And in your js:

<script type="text/javascript">
    console.log(@Model.someText);
</script>

Upvotes: 1

Related Questions