my JavaScript is firing two times, what ia m doing...
# javascript
g
my JavaScript is firing two times, what ia m doing wrong here https://jsfiddle.net/w0sou8ex/
r
Looks like you have an
onsubmit
on the form tag, which is calling your funciton, and then you're also attaching an event handler
r
You have attached the event handler twice
once inline and once using addEventListener
g
ah Thanks Guys, do u know why i am not getting the alert
console.log(JSON.parse(r['msg'])); return;
it shows me undefined
Copy code
{
  "msg": "Your request for  has been rejected.",
  "status": "success",
  "type": 2
}
m
if
r.msg
is a string, why does it need to be parsed?
g
I tried with r.msg but same output Undefined
In console full object is coming from backend
If I use it directly with json parse still it throws undefined
m
what data type is the full object? Has it been parsed?
g
I do a serializejson from backend and sent it
m
did you parse the full response? If not, there is no
r.msg
g
Yes I did parse full Jason
So what and from where msg is coming and I am literally lost why it is behaving in such a way
m
Show the response and your code.
Is
r
the raw response or parsed?
g
It’s taw
I posted the fiddle link in this chat
m
There's no reference to
r
or
parse()
in that fiddle
if r is raw, then it's a string and r.msg is just part of a string, which can't be referenced with bracket or dot notation. If you have parsed the response, what variable is assigned to the parsed response?
g
this is the code looks like
CF
Copy code
{
  "msg": "Your request for  has been rejected.",
  "status": "success",
  "type": 2
}
JS
m
that's the response? it's a string?
have you parsed that?
g
Copy code
const submitAppRejForm = (e) => {
    e.preventDefault(); // stop form submission
    const clickedButton = e.submitter; // which submit?
    if (clickedButton && clickedButton.name) {
      const action = clickedButton.name;
      let oFormData = new FormData(e.target);
      $.ajax({
        type: 'POST',
        url: `TimeOff_Request_proc.cfm?action=${action}`,
        data: oFormData,
        contentType: false,
        processData: false,
        beforeSend: function(){
            showLoadingScreen();
        },
        complete: function(){
            $.unblockUI();
        },
        success: function (r) {
            console.log(JSON.parse(r['msg']));
            Swal.fire({
                icon: 'success',
                title: 'Cool',
                text: r.msg
            }).then((result) => {
                window.location.reload();
            });
        },
        error: function (xhr, status, error) {
            clearInterval(processing);
            $.unblockUI();
            Swal.fire({
                icon: 'error',
                title: 'Oops...',
                text: "AJAX request failed:" + error
            });
            // Add error handling logic here (e.g., display an error message)
        }
      });
    }
  }
m
how are you receving this response?
g
check the front end code
if i parse and call r.msg or r[;msg'], i get undefined
m
because
r['msg']
doesn't exist if
r
hasn't been parsed
parse r first
because at this point r is likely a string
r
Copy code
success: function (r) {
    var data = JSON.parse(r);
    Swal.fire({
        icon: 'success',
        title: 'Cool',
        text: data.msg
    }).then((result) => {
        window.location.reload();
    });
},
☝️ 1
thats what @Myka Forrest is refering to
g
i did same and i get same "undefined "
m
what if you just log r to the console?
before doing anything else?
g
let me show you
image.png
the above screenshor after i use JSON.parse
m
Then it's not undefined.
r
Copy code
success: function (r) {
    Swal.fire({
        icon: 'success',
        title: 'Cool',
        text: r.msg
    }).then((result) => {
        window.location.reload();
    });
},
g
its not but i am getting undefined and that is why i am lost why it is doing it
r
r (the result object) is implicitly being parsed to json.
🤔 1
😑 1
g
ok this worked
let results = JSON.parse(r); let realMessage = results.msg; Swal.fire({ icon: 'success', title: 'Cool', text: realMessage
if i use directly results.msg,it fails
not sure why, but it should be simple to indentify itself