How to send data from razor to lightbox in asp net core 3 1

Introduction

ASP.NET is a popular programming language used for building web applications. In this article, we will discuss how to send data from Razor to Lightbox in ASP.NET Core 3.1.

Step 1: Setting up the Environment

Before we begin, make sure you have ASP.NET Core 3.1 installed on your machine. You can download it from the official website.

Step 2: Creating a Razor Page

To send data from Razor to Lightbox, we first need to a Razor page. In your ASP.NET Core project, navigate to the folder and add a new Razor page. Let's name it “SendData.cshtml”.


@page
@model SendDataModel

Send Data to Lightbox

In the above code, we have created a simple form with an input field and a submit button. The form is bound to the “Data” property of the model.

Step 3: the Form Submission

Next, we need to handle the form submission in the Razor page's code-behind file. Add a new class named “SendDataModel.cshtml.cs” in the same folder as the Razor page.


public class SendDataModel : PageModel
{
    [BindProperty]
    public string Data { get; set; }

    public IActionResult OnPost()
    {
        // Logic to send data to Lightbox
         RedirectToPage("Lightbox");
    }
}

In the above code, we have a property named “Data” and decorated it with the [BindProperty] . This attribute allows us to bind the form data to the property automatically.

The OnPost method is executed when the form is submitted. Inside this method, you can write the logic to send the data to the Lightbox. In this example, we are redirecting to another Razor page named “Lightbox”.

Step 4: Displaying the Data in Lightbox

Finally, we need to create the Lightbox Razor page to display the data sent from the SendData page. Create a new Razor page named “Lightbox.cshtml” in the Pages folder.


@page
@model LightboxModel

Lightbox

Data received from SendData page: @Model.Data

In the above code, we are displaying the data received from the SendData page using the @Model.Data .

Conclusion

In this article, we have discussed how to send data from Razor to Lightbox in ASP.NET Core 3.1. By following the outlined above, you can easily pass data different Razor pages in your ASP.NET Core application.

Rate this post

Leave a Reply

Your email address will not be published. Required fields are marked *

Table of Contents