How can we make the general view, because code is reusing in different web pages?

Viewed 73

How can we make the general view of following web pages. From that general view we can implement if conditions to redirect to the view. here is the files picture: Calling all weeks from links in index.cshtml my cshtml files looks like:

week3.cshtml

@{
    ViewData["Title"] = "Testing Weeks API";
    Layout = "~/Views/Shared/_GameLayout.cshtml";

}
<script src="/lib/pixi.js/browser/pixi.js" ></script>
<script src="/OtherJS/pixi-viewport.js"></script>
<script src="/OtherJS/pixi-scrollbox.js"></script>
<script src="~/js/week-3.js" type="module"></script>

week4.cshtml

@{
    ViewData["Title"] = "Testing Weeks API";
    Layout = "~/Views/Shared/_GameLayout.cshtml";

}
<script src="/lib/pixi.js/browser/pixi.js" ></script>
<script src="/OtherJS/pixi-viewport.js"></script>
<script src="/OtherJS/pixi-scrollbox.js"></script>
<script src="~/js/week-4.js" type="module"></script>

I just dont want 10 weeks views file, I need just one weeks.cshtml from where I can redirect to links using if condition. Thanks in Advance for solution

3 Answers

just pass a value in viewbag and put a condition on it in your controller file. If that condition fulfills than show week3 else show week4.

 public IActionResult Week()
    {
        ViewBag.Name = 1;
        return View();
    }

then use it in your Weekcshtml file where you are displaying all weeks.

@if(ViewBag.Name == 1){ 
    <script src="~/js/week-3.js" type="module"></script>
    }
else{
    <script src="~/js/week-4.js" type="module"></script>
    }

You can try to pass a data to weeks.cshtml Model,here is a demo:

Model:

public class Model{
    public int number { get; set; }
}

View:

<script src="~/js/week-@(Model.number).js" type="module"></script>

Action:

public IActionResult TestJs() {

            return View(new Model {number=3});
        }

result: enter image description here

Suppose your index.cshtml has 10 links for 10 Week{1-10}.cshtml files but you want 1 Week.cshmtl that programmatically shows all 10 files without having 10 real cshmtl files.

You can simply pass a number with each link, for example in your index.cshtml file you can have

@foreach (var week in Model.Weeks)
    {
        <a  asp-page="./Week" asp-route-weekNumber="@week.Number"> Week-@week.Number </a>
    }

then your Week.cshtml would be like

@page "{weekNumber:int}"
@model Yournamespace.Pages.Home.WeekModel
@{
    ViewData["Title"] = "Testing Weeks API";
    Layout = "~/Views/Shared/_GameLayout.cshtml";

}
<script src="/lib/pixi.js/browser/pixi.js"></script>
<script src="/OtherJS/pixi-viewport.js"></script>
<script src="/OtherJS/pixi-scrollbox.js"></script>
<script src="~/js/week-@(Model.WeekNumber).js" type="module"></script>

and your Week.cshtml.cs would be like

public class WeekModel : PageModel
    {

        [BindProperty(SupportsGet = true)]
        public int WeekNumber { get; set; }

        public IActionResult OnGet(int weekNumber)
        {
            // Do something
            return Page();
        }

    }
Related