Ajax successful event fails to trigger

Having Trouble Implementing Okta Authentication with WebForms The login functionality is working, but the redirect part is not functioning correctly

I have attempted to use void and return a JSON object/string, but it does not seem to work

If I remove the contentType and dataType from the ajax method, the success event works. However, I am unable to debug the method properly and it does not perform as expected

My goal is to redirect to SignedIn.aspx at the end of the webmethod. I tried using the following code, but was unsuccessful. This is why I am attempting to handle it client-side through the ajax success method

     HttpContext.Current.Response.Redirect("SignedIn.aspx");

Ajax:

function FormSubmit() {
    $.ajax({
        type: "POST",
        url: "Example.aspx/Login",
        data: "{hiddenSessionTokenField:'" + $('#hiddenSessionTokenField').val() + "'}",
        dataType: "json",
        async:false,
        contentType: "application/json; charset=utf-8",
        success: function (response) {
            alert("Method Called Successfully" + response);
            window.location.href = "http://localhost:8080/SignedIn.aspx";
        },
        error: function (response) {
            alert("error " + response);
        }
    });
}

WebMethod

    [WebMethod(EnableSession = true)]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public static void Login(string hiddenSessionTokenField)
        {

        //var result = new { url = "http://localhost:8080/SignedIn.aspx" };

        if (!HttpContext.Current.User.Identity.IsAuthenticated)
        {
            var properties = new AuthenticationProperties();
            properties.Dictionary.Add("sessionToken", hiddenSessionTokenField);
            properties.RedirectUri = "~/SignedIn.aspx";

            //Okta Authentication
            HttpContext.Current.GetOwinContext().Authentication.Challenge(properties,
                OpenIdConnectAuthenticationDefaults.AuthenticationType);


            //System.Web.Script.Serialization.JavaScriptSerializer s = new System.Web.Script.Serialization.JavaScriptSerializer();

            //return s.Serialize(result));

        }
            //return s.Serialize(result));

    }

Answer №1

$('#click-me').on('click', function () {
    $.ajax({
      type: "POST",
      url: "LOGIN.aspx/Authenticate",
      data: "{hiddenToken:'" + $('#hiddenToken').val() + "'}",
      dataType: "json",
      contentType: "application/json; charset=utf-8",
      success: function (response) {
    //    alert("Login Successful");
      window.location.href = "http://localhost:8080/home.aspx";
   },
    error: function (response) {
      alert("An error occurred: " + response);
       }
      });
     })


    public static void Authenticate(string hiddenToken) {
        int x = 0;

    }

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The Ajax request fails to send the form files

I'm encountering an issue where a form isn't passing one variable. Here is my table structure: Schema::create('projects', function(Blueprint $table) { $table->increments('id'); $table->string(&apos ...

Exporting CSS file from css-loader in Webpack: A step-by-step guide

My application structure is set up like this: /src /app.js /styles.css /images /img.png The content of the app.js file is as follows: const styles = require('./styles.css'); console.log(styles) // => I want a URL to t ...

Error: The function of forEach is not applicable to todoList

_serilizedList(todoList){ let serialized = '*My to-dos:*\n'; todoList.forEach((t, i)=> { serialized += '*${i}* - ${t}\n'; }); return serialized; } Unexpected TypeError: todoList.forEach is not ...

Using Node.js and Less to dynamically select a stylesheet source depending on the subdomain

Currently, my tech stack consists of nodejs, express, jade, and less. I have set up routing to different subdomains (for example: college1.domain.com, college2.domain.com). Each college has its own unique stylesheet. I am looking for a way to selectively ...

Troubleshooting the issue of CSS animations activating twice and causing a flickering effect specifically in the Firefox browser

I am facing an issue with CSS animations in Firefox. When I try to slide in some radio buttons upon clicking a button, the animation seems to be firing twice in Firefox while it works fine in Chrome. I have attempted several solutions but haven't been ...

JavaScript button mouse enter

There seems to be an issue with this code. The button is not functioning properly after hovering over it, even though it was copied from the instructional website where it works fine. <html> <head> <title>Button Magic</t ...

What is the best way to specify a function parameter as the `QUnit` type using TypeScript in conjunction with QUnit?

In my project, which is partially written in TypeScript and licensed under MIT, I am utilizing QUnit. I have some TypeScript functions that require QUnit as a parameter, and I would like to define their types based on its interface from the typings. For e ...

What's causing Angular to not display my CSS properly?

I am encountering an issue with the angular2-seed application. It seems unable to render my css when I place it in the index.html. index.html <!DOCTYPE html> <html lang="en"> <head> <base href="<%= APP_BASE %>"> < ...

Unable to delete item using DELETE method

I recently created a WebApi controller with a method designed to delete clients... [HttpDelete] public void DeleteClient(int id) { // implementation } Now I'm attempting to test this functionality by incorporating the following HTML into a webpage ...

Angular2 fire fails because the namespace 'firebase' does not export the member 'Promise'

I recently set up Angular 2 Fire on my project. "angularfire2": "^5.0.0-rc.0", Now, in my root module (app module), I have the following setup: export const firebaseConfig = { apiKey: "mykey", authDomain: "....", databaseURL: "...", projectId: ...

Convert a list into a hierarchical structure of nested objects

Working with angular, I aim to display a nested tree structure of folders in an HTML format like below: <div id="tree"> <ul> <li ng-repeat='folder in folderList' ng-include="'/templates/tree-renderer.html'" ...

A comprehensive guide on retrieving data from API across several pages

Struggling with pulling data from an API using React and facing the challenge of retrieving more than one page of data. "info": { "count": 493, "pages": 25, "next": "https://rickandmortyapi.com/api/character/?pa ...

Tips for incorporating external libraries into a Grafana data source plugin

What's the best way to integrate an external library into a Grafana datasource plugin? My plugin is functioning properly, but I encounter an error when trying to use the "mqtt" library that I have installed and added to the package.json file: Plugin ...

Tips for halting a MySQL database transaction within a NodeJS environment using expressJS

Recently, I encountered a coding challenge that involved managing a long database transaction initiated by a user. The scenario was such that the user inadvertently updated 20 million entries instead of the intended 2 million, causing a significant impact ...

What is the reason behind ValidatorValidate() validating all RequiredFieldValidator controls on the page?

Can you explain why the function ValidatorValidate(v) validates all the RequiredFieldValidator controls on the page instead of just executing for RequiredFieldValidator1? Here is the code snippet: <html xmlns="http://www.w3.org/1999/xhtml"> ...

Encountering Issues with Accessing Property

Upon trying to run my code, the console is displaying an error that I am unable to resolve. The error specifically states: "TypeError: Cannot read property 'author' of undefined." View the StackBlitz project here The error seems to be coming fr ...

Monitor fetch() API calls and responses in JavaScript

I’m looking to intercept fetch API requests and responses using JavaScript. Specifically, I want to be able to capture the request URL before it is sent and also intercept the response once it has been received. The code below demonstrates how to inter ...

Implement a mouseenter event to all input elements that have specific names stored in an array, utilizing jQuery

I'm struggling to figure out how to apply my function to all input elements with a name that is included in my array. This is what I've attempted so far: var names = ["name1", "name2"]; $(document).ready(function(){ $('input[name=names[ ...

Looking to implement a delay in the model popup using Pure JavaScript

Looking for a method to implement a delay in the popup... I've tried a few solutions without success. What's the secret to adding a delay to the modal below? Any help is greatly appreciated. var modal = document.querySelector(".modal"); var t ...

What are the steps to implement server side routing using react-router 2 and expressjs?

If you're looking to delve into server side rendering with react-router, the documentation linked here might fall short in providing a comprehensive understanding. In particular, it may not offer enough insights on how to leverage react-router 2 for r ...