0

I'm using the .net core framework with razor pages without MVC and I'm trying to integrate a form with a view component to make it reusable.

The problem is I noticed that it's not really made for. Indeed I use the asp-for attribute of the form which in reality is based on the parent PageModel in which I have bound an attribute corresponding to the field of my form.

I would like to know how you can create reusable component that contain forms to be used in a final PageModel.

Thank you :)

tr4cks
  • 126
  • 1
  • 8
  • All web frameworks push standard HTML, CSS, Javascript and WASM to the browser. There is no reason you cannot create plain old input elements and post the form to a controller. The Controller's model binder will try to use those fields, or you can access the data as form values too. – Crowcoder Apr 08 '21 at 12:24
  • Precisely the data are bound to the parent controller and not to the view component ; that's the problem and I wish I had a workaround I think that you should not use the asp-for attribute and therefore get the data as a parameter but the documention is not very informative on this subject – tr4cks Apr 09 '21 at 00:10
  • To try to be clearer I just want to be able to bind the asp-for attribute of a form inside a view component to an attribute of a parent class ModelPage via [BindProperty] I started to find a track [here](https://stackoverflow.com/questions/66297108/multiple-view-components-in-net-core-razor-page-not-binding-correctly) but it's not super clear – tr4cks Apr 09 '21 at 00:56

1 Answers1

1

If you want to make your partial view reusable,it means only one model should be called.

Do you want to use a partial view, and get the data from different models?

Then you can use a ViewModel to contain multiple different models,like:

public class MyViewModel
{
    public Profile Profile { get; set; }
    public Job Job { get; set; }
}
public class Profile
{      
    public string Name { get; set; }
}
//....other models

Index.cshtml.cs:

[BindProperty]
    public MyViewModel MyViewModel { get; set; }

    public void OnGet()
    {
        MyViewModel = new MyViewModel
        {
            Job = new Job { Name = "teacher" },
            Profile=new Profile {Name="Peter"}          
        };
    }

Index.cshtml (model= is used to pass model to partial):

<partial name="~/Pages/Shared/Partialview.cshtml" model="Model.MyViewModel" />

Then you can get the related model data in Partial view:

@model tr4cks491.Models.MyViewModel
<form method="post">
    <input asp-for="Job.Name" />
    <input asp-for="Profile.Name" />
    <input type="submit" value="Submit" />
</form>
Jerry Cai
  • 869
  • 1
  • 4
  • 4
  • Indeed it works. In fact I was trying to pass a string directly and couldn't. I'm new to this framework so I'm still confused about some principles. But if you want to do the same thing for view components I advise you to read this [article](https://stackoverflow.com/questions/66297108/multiple-view-components-in-net-core-razor-page-not-binding-correctly) because there are conflicts when you use several components in the same page. – tr4cks Apr 11 '21 at 17:45