Calling asp-page handler method from javascript

Blooming Developer 276 Reputation points
2021-10-31T09:31:56.037+00:00

Hi all,

i am not able to post my question here.
Please find my question in attached file. Anyhelp would be appreciated

Please click here 145155-callingaspmethodjavascript.txt

ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,195 questions
{count} votes

2 answers

Sort by: Most helpful
  1. Zhi Lv - MSFT 32,016 Reputation points Microsoft Vendor
    2021-11-01T03:10:37.82+00:00

    Hi @Blooming Developer ,

    From your code, since you are using the type="submit" button, I assume there must have a form, right? After clicking the submit button, it will submit the form by default. In this scenario, if you are using the Ajax method to submit the form, it will submit twice. So, in the submit button click event, to use Ajax method, you must call the event.preventDefault(); command to prevent the default from submit action. You can refer the following code to use JQuery Ajax method to call the handler method:

    In the Index page, create a handler method as below:

    public class IndexModel : PageModel  
    {  
        private readonly ILogger<IndexModel> _logger;  
        private readonly ICurriculumService _repository;  
        public IndexModel(ILogger<IndexModel> logger, ICurriculumService datatRepository)  
        {  
            _logger = logger;  
            _repository = datatRepository;  
        }  
        public void OnGet()  
        {  
        }  
    
        public async Task<IActionResult> OnPostSubmitAsync()  
        {  
            return new JsonResult("success");  
        }  
    }  
    

    Then in the Index.cshtml: add a form with javascript:

    145306-image.png

    You can download the index.cshtml code from here: 145278-indexcshtml.txt

    The result as below:

    145260-1.gif

    If you want to redirect to another page after calling the handler, you can use change the request url via the window. location .href(please remove the space) in the Ajax success function. Or you can remove the Ajax method, and in the button click event, you can add the custom validation, then based on the result to submit the form (get the form by id, then use the submit method submit the form).

    Update:

    Code like this: document.getElementById("mainform").submit();

    145673-image.png

    The result as below:

    145609-1.gif


    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


  2. Bir Yazilim 1 Reputation point
    2022-09-05T17:39:25.273+00:00

    great help about a very confusing subject, thanks

    0 comments No comments