locked
How and where do you post "Jquery Ajax post" in Razor pages RRS feed

  • Question

  • User1140794346 posted

    hi guys

    I am new to razor pages, but have a wealth of experience in other .net apps

    I am working on a personal project that heavily requires JQuery posts e.g. seen below. My question is, where do I post the requests to ? Do I create a controller and post to the controller ? If so, then do I get the scaffolding controller actions to create the CRUD pages, which the controller will serve back ?  Or do I post to another razor page ?

    Please help

    I have been searching online for examples, but I only see MVC examples

            function LearningRazor(input) {
     
    
                var token = $('#__RequestVerificationToken').val();
     
                $.ajax({
    
                    type: "POST",
                    url: "/Upload/AjaxUpload",
                    contentType: false,
                    processData: false,
                    data: formData,
                    success: function (message) {
                      /// test
                    },
                    error: function (message) {
                       /// test
                    }
    
                });
            };
    
    
    

    Monday, August 24, 2020 12:47 PM

Answers

  • User-821857111 posted

    You would use controllers (Api Controllers) in a Razor Pages app to send JSON data to your AJAX call. You will probably only do this if you have a fair amount of data services being called by AJAX methods. Otherwise, you can just add the occasional named handler method to your PageModel class that returns a JsonResult. 

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, August 24, 2020 4:02 PM
  • User475983607 posted

    ehi.baye

    Its not JSON data, its just sending updates to the website, db calls and other post/get functions

    AJAX commonly sends/receives JSON data because JSON is the standard object notation for JavaScript.  Generally when you have AJAX you also have a JavaScript applications and partial page updates.  It does not have to work that way.  You could use standard x-www-form-urlencoded content.  The community can provide better assistance if you provide sample code that illustrates what you are trying to do weather the code works as expected or not.  The community will need enough code to reproduce the any problems. 

    ehi.baye

    where do I add the API Controllers ?

    Web API and MVC controllers use different routing than Razor Pages.  Create a "Controllers" folder.  Right click "add" and add an Web API or MVC controller.  Depending on your project you might need to configure Web API or MVC in the startup.cs file.  If you are not sure how to do this simply create an Web API and/or MVC project and review the configuration.  There's also the reference documentation which explains the details.

    Sample Web API configuration in a Razor Pages project.

            public void ConfigureServices(IServiceCollection services)
            {
                services.AddRazorPages();
                services.AddControllers();
            }
    app.UseEndpoints(endpoints =>
    {
        endpoints.MapRazorPages();
        endpoints.MapControllers();
    });

    ehi.baye

    in the pages folder or separate, also what are the other MVC Controllers for ?

    MVC and Razor Pages solve the same problem.  Typically, you pick one or the other not both.  But there is nothing stopping you from configuring  MVC controllers and Views.  Again, see the docs.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, August 24, 2020 6:23 PM

All replies

  • User475983607 posted

    See the following excellent blog on the subject.

    https://www.learnrazorpages.com/razor-pages/ajax

    I typically use Web API and JSON formatted data with AJAX.

    Monday, August 24, 2020 1:07 PM
  • User1140794346 posted

    thanks

    but quick question, what then are the controllers there for ?

    Monday, August 24, 2020 3:51 PM
  • User475983607 posted

    but quick question, what then are the controllers there for ?

    I'm not sure what you are asking.

    Monday, August 24, 2020 3:54 PM
  • User-821857111 posted

    You would use controllers (Api Controllers) in a Razor Pages app to send JSON data to your AJAX call. You will probably only do this if you have a fair amount of data services being called by AJAX methods. Otherwise, you can just add the occasional named handler method to your PageModel class that returns a JsonResult. 

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, August 24, 2020 4:02 PM
  • User1140794346 posted

    Ok thanks

    Its not JSON data, its just sending updates to the website, db calls and other post/get functions

    where do I add the API Controllers ? in the pages folder or separate, also what are the other MVC Controllers for ?

    Monday, August 24, 2020 5:11 PM
  • User475983607 posted

    ehi.baye

    Its not JSON data, its just sending updates to the website, db calls and other post/get functions

    AJAX commonly sends/receives JSON data because JSON is the standard object notation for JavaScript.  Generally when you have AJAX you also have a JavaScript applications and partial page updates.  It does not have to work that way.  You could use standard x-www-form-urlencoded content.  The community can provide better assistance if you provide sample code that illustrates what you are trying to do weather the code works as expected or not.  The community will need enough code to reproduce the any problems. 

    ehi.baye

    where do I add the API Controllers ?

    Web API and MVC controllers use different routing than Razor Pages.  Create a "Controllers" folder.  Right click "add" and add an Web API or MVC controller.  Depending on your project you might need to configure Web API or MVC in the startup.cs file.  If you are not sure how to do this simply create an Web API and/or MVC project and review the configuration.  There's also the reference documentation which explains the details.

    Sample Web API configuration in a Razor Pages project.

            public void ConfigureServices(IServiceCollection services)
            {
                services.AddRazorPages();
                services.AddControllers();
            }
    app.UseEndpoints(endpoints =>
    {
        endpoints.MapRazorPages();
        endpoints.MapControllers();
    });

    ehi.baye

    in the pages folder or separate, also what are the other MVC Controllers for ?

    MVC and Razor Pages solve the same problem.  Typically, you pick one or the other not both.  But there is nothing stopping you from configuring  MVC controllers and Views.  Again, see the docs.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, August 24, 2020 6:23 PM