how to bind to taghelper property in razor pages?

Question

how to bind to taghelper property in razor pages?

mc 6,396

[HtmlTargetElement("pagination")]

public class PaginationTagHelper : TagHelper

{

[HtmlAttributeName("page-index")]

public int PageIndex{get;set;}

}

and in Index.cshtml

<pagination page-index="PageIndex" />

I can not bind to PageIndex property in Index.cshtml.cs

public int PageIndex{get;set;}

how to bind PageIndex to TagHelper property?

Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2023-01-30T10:18:48.0166667+00:00

Could please share what issue you are getting with above code? Would you kindly share full reproducible code snippet?
mc 6,396 Reputation points

2023-01-31T01:09:49.2766667+00:00

@Farid Uddin Kiron MSFT thank you for your answer I just ask how to bind to property that in cs file.

<pagination page-index="PageIndex" />

I can not do this but

<input type="text" asp-for="Name" /> can bind to Name;

If I use my custom taghelper

<pagination page-index="Name" /> I can not bind to Name
Xinran Shen - MSFT 2,091 Reputation points

2023-01-31T01:54:42.4866667+00:00

PageIndex is a property of type int in your PaginationTagHelper class, So why you want to bind a string value to it in the view?
mc 6,396 Reputation points

2023-01-31T02:19:09.8666667+00:00

change to same type can not bind too.
mc 6,396 Reputation points

2023-01-31T02:29:39.7066667+00:00

@Xinran Shen - MSFT
Xinran Shen - MSFT 2,091 Reputation points

2023-01-31T08:08:34.4833333+00:00

But when I try to change the type to string, It bind successfully

Answer accepted by question author

0 additional answers

Your answer

Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2023-01-30T10:18:48.0166667+00:00

Could please share what issue you are getting with above code? Would you kindly share full reproducible code snippet?
mc 6,396 Reputation points

2023-01-31T01:09:49.2766667+00:00

@Farid Uddin Kiron MSFT thank you for your answer I just ask how to bind to property that in cs file.

<pagination page-index="PageIndex" />

I can not do this but

<input type="text" asp-for="Name" /> can bind to Name;

If I use my custom taghelper

<pagination page-index="Name" /> I can not bind to Name
Xinran Shen - MSFT 2,091 Reputation points

2023-01-31T01:54:42.4866667+00:00

PageIndex is a property of type int in your PaginationTagHelper class, So why you want to bind a string value to it in the view?
mc 6,396 Reputation points

2023-01-31T02:19:09.8666667+00:00

change to same type can not bind too.
mc 6,396 Reputation points

2023-01-31T02:29:39.7066667+00:00

@Xinran Shen - MSFT
Xinran Shen - MSFT 2,091 Reputation points

2023-01-31T08:08:34.4833333+00:00

But when I try to change the type to string, It bind successfully

Answer 1

Xinran Shen - MSFT 2,091

Hi 打玻璃, Combining with the previous question I answered, you want to bind and render the value of PageIndex into <div>xxx</div> right? Because <div></div> is not a self-closing tag, So you need to use:

<pagination page-index="Name" ></pagination>

instead of

<pagination page-index="Name" />

to render it. Please refer:

User's image

Then the Name can be bind and render successfully:

User's image

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,

Xinran Shen

mc 6,396 Reputation points

2023-01-31T09:24:32.6066667+00:00

no the Name is not a string

it is varaible in Index.cshtml.cs

public int Name{get;set;}

or

public string Name{get;set;}

and in Index.cshtml

<pagination page-index="Name"></pagination>

but I can not do it?

thank you.
Xinran Shen - MSFT 2,091 Reputation points

2023-01-31T09:44:59.9+00:00

Do you mean asp-index can receive a string like <pagination page-index="Name"></pagination> and it can also receive a int like <pagination page-index="10"></pagination>? If it is, I think you can set the type of PageIndex to string and in Process method, you can check if the value of PageIndex can be convert to int, If it can, convert it to int or just treat it as string.
mc 6,396 Reputation points

2023-01-31T10:03:44.0733333+00:00

No I mean asp-index is not like

<input asp-for="Name" />

it can receive Name from Model

Xinran Shen - MSFT 2,091

So you want to use page-index to receive model's property right? You can change the type of PageIndex to ModelExpression, Then use PageIndex.Model to the value of property.

[HtmlTargetElement("pagination")]
    public class PaginationTagHelper : TagHelper
    {
        [HtmlAttributeName("page-index")]
        public ModelExpression PageIndex { get; set; }

        public string aspFor { get; set; }


        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            
            output.Attributes.SetAttribute("class", aspFor);

            //Property name: PageIndex.Name
            //Current Value:  PageIndex.Model

            output.Content.SetHtmlContent("<div>" + PageIndex.Model + "</div>");

        }
    }

Share via

how to bind to taghelper property in razor pages?

0 additional answers

Your answer