Razor Pages PageRemote preventing asp-page-handler from being called

Question

Hi,

I'm facing an odd issue here.

I have a page where i have setup a PageRemote attribute to validate a field, and on the same page, i have 2 buttons that each call a distinct handler using the asp-page-handler property (1 to update the content, the other to delete it).

If i remove the PageRemote validation, the handlers for both buttons are triggered as expected, but when i leave the PageRemote validation on the page, the buttons specific handlers are not called, although the PageRemote handler is correctly triggered.

Furthermore, when leaving the PageRemote validation on the page, if i force its validation to return false, then afterwards the buttons trigger their respective handler, but if i do not force it, then the behaviour is as described earlier, where the handlers are not triggered.

Can someone explain me if there is a catch on using these two things on the same page, and/or how to overcome this?

Below is a sample of the page code:

public class EditModel : PageModel
{

    private IConfiguration _configuration;  

    [Required(ErrorMessageResourceType = typeof(ErrorMessages),  
        ErrorMessageResourceName = nameof(ErrorMessages.SlugRequired))]  
    [MinLength(3, ErrorMessageResourceType = typeof(ErrorMessages),  
        ErrorMessageResourceName = nameof(ErrorMessages.SlugMinLength))]  
    [MaxLength(128, ErrorMessageResourceType = typeof(ErrorMessages),  
        ErrorMessageResourceName = nameof(ErrorMessages.SlugMaxLength))]  
    [RegularExpression(@"^[0-9a-zA-Z_/-]*$", ErrorMessageResourceType = typeof(ErrorMessages),  
        ErrorMessageResourceName = nameof(ErrorMessages.SlugAllowedCharacters))]  
    [PageRemote(ErrorMessageResourceType = typeof(ErrorMessages),  
        ErrorMessageResourceName = nameof(ErrorMessages.SlugDuplicate),  
        AdditionalFields = "__RequestVerificationToken,GenericContentDTO.GenericContent.GenericContentId",  
        HttpMethod = "post",  
        PageHandler = "CheckSlug")]  
    [Display(Name = "URL Title")]  
    [BindProperty]  
    public string Slug { get; set; }  

    [TempData]  
    public string FormResultMessage { get; set; }  

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

    public EditModel(IConfiguration configuration)  
    {  
        _configuration = configuration;  
    }  

    public IActionResult OnGet(Guid genericContentId)  
    {  
        if (genericContentId.ToString() == "")  
        {  
            return NotFound();  
        }  

        ...  
		Code to load content  
		...  

        return Page();  

    }  

    public async Task OnPostUpdate()  
    {  

        if (!ModelState.IsValid)  
        {  
            return Page();  
        }  

        ...  
		Code to update content  
		...  

        return RedirectToPage(new { GenericContentId = GenericContentDTO.GenericContent.GenericContentId });  

    }  

    public IActionResult OnPostDelete()  
    {  

		...  
		Code to delete content  
          

    }  

    public JsonResult OnPostCheckSlug()  
    {  

        var token = HttpContext.Session.GetString("APIAuthorizationToken");  

        CheckSlugDTO CheckSlug = new CheckSlugDTO  
        {  
            Slug = Slug,  
            ContentId = GenericContentDTO.GenericContent.GenericContentId,  
            Exists = true  
        };  

        CheckSlug = APICommunicationHelper.PostData(CheckSlug, _configuration["AppConfigs:APIAddress"] + "api/CheckGenericContentSlugExistance", token);  

        return new JsonResult(!CheckSlug.Exists);  
    }  
}

And of the Razor Code:

@Anonymous "{GenericContentId:Guid}"
@默 MyProject.Pages.Generic_Contents.EditModel
@{
}

@TempData["FormResultMessage"]  

  
    Main  
    Meta  
  

  

      
        
  

          

        @Html.HiddenFor(model => model.GenericContentDTO.GenericContent.GenericContentId)  

          
              
              
              
          

          
              
              
              
          

          

              
                  
                  
              

          

          
              
            @Html.TextAreaFor(model => model.GenericContentDTO.GenericContent.Summary, new { @class = "form-control", @rows = 5 })  
              
          

          
              
            @Html.TextAreaFor(model => model.GenericContentDTO.GenericContent.ContentText, new { @class = "form-control editorHtml" })  
          

          
              
            @Html.CheckBoxFor(model => model.GenericContentDTO.GenericContent.IsActive)  
          

      

      
          
              
            @Html.TextAreaFor(model => model.GenericContentDTO.GenericContent.MetaDescription, new { @class = "form-control", @rows = 5 })  
              
          

          
              
            @Html.TextAreaFor(model => model.GenericContentDTO.GenericContent.MetaKeywords, new { @class = "form-control", @rows = 5 })  
              
          
      


      
        Cancel

@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

Thanks

Answer

Hi @0belix ,

First, to the delete button, it should not use the submit type button, because if using this type of button, once click the button, it will submit the form and do the model validation. So, try to modify the button to a hyperlink button, code like this:

 Delete Content

It will send a http get request and transfer the GenericContentId (assume this is the primary key) to the Delete handler, so we also need to change the Delete hander method as below:

    public IActionResult OnGetDelete(int genericContentId)  
    {  
        // find the GenericContent based on the GenericContentId  
        GenericContentDTO = _dataRepo.FindGenericContentByID(genericContentId);  

        //delete item from the database   

        return Page();  
    }

To the update button, you can use the Submit type button to submit the form and validate the entered value.

Second, to the PageRemote validation, since there has an AdditionalFields ("GenericContentDTO.GenericContent.GenericContentId") to validate, the OnPostCheckSlug should have two parameters, like this:
Note: in my sample, I changed the GenericContentId from Guid Type to Int type, you can change it to yours:

    public JsonResult OnPostCheckSlug(string slug, int GenericContentId)  
    {  
        //validate the entered slug.  
        var sluglist = new List() { "Sslug1", "Sslug2" };  

        var isexist = !sluglist.Contains(slug);  
        return new JsonResult(isexist);  
    }

The result is like this:

You can view the source code from these attachments: 176558-edit-html.txt 176625-edit-html-cs.txt 176539-mode.txt

Besides, since there has other validation such as required, MinLength or MaxLength, when you enter the slug value, if this value not achieve these rules, it will also prevent the update button.

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,
Dillion

Answer

Hi ZhiLv-MSFT,

First, let me thank you for the reply.

However, even after implementing the changes you suggested (which did not address the real issue here), the problem persists. The issue was not the validation being correctly fired, or the model validation being passed to the Delete handler via Post, since as i explained earlier, i can have any of those to correctly process the request when they are indeed fired.

The real issue is that if the user loads the page, and inside the Slug field is a valid value (and i do not change it), even if i change any of the other values on the other fields, and then press the Update button, if will not fire its handler, instead firing a default OnPost handler (i know it fires the OnPost since if i implement a default OnPost on the page and set a break point on it, it will get fired at that point).

But if upon loading the page, i change the value on the slug input to an invalid value, the validation is fired correctly, stating that the value is not acceptable, then changing it back to an acceptable value, and pressing the Update button, it will then fire the correct handler.

So, in sum, the issue persists, regardless of the suggested corrections... Any other ideas that might overcome this?

Share via

Razor Pages PageRemote preventing asp-page-handler from being called

2 answers

Your answer