Error when using form.submit()

Question

We are using extjs and webapi(C#) for our application. My form has a fileupload control. When we use form.sumbit() in extjs, it is not going to the success function.

WebApi code:

bool SaveData(Employee obj)
{
     return true;
}

Extjs code:

form.submit( {
               url: '../api/Empcontroller/SaveData',
               method: 'POST',
               headers: {
               'Content-Type': 'application/json'
                         },
               success: function ( fp, o )
               {


               },
               failure: function ( fp, o )
               {

               }
            } );

I'm getting the response as true in all browsers. In Chrome its coming into success, But in Firefox its not.

If the form is multipart, I'm surprised the success message is working at all considering it's probably submitting through an iframe, if extjs 4 has a similar implementation to 3 for handling file data. — Reimius, Apr 23 '13 at 13:56

score 2 · Answer 1 · answered Apr 19 '13 at 23:33

Try adding in the dataType param like so:

form.submit({
   url: '../api/Empcontroller/SaveData',
   method: 'POST',
   headers: {
       'Content-Type': 'application/json'
   },
   dataType: 'json',
   success: function (fp, o) {

   },
   failure: function (fp, o) {

   }
});

I have also seen it done this way: (replace json_data_here with any data you need to send)

form.submit(Ext.Ajax.request({    
    url: '/../api/Empcontroller/SaveData',
    method: 'GET',
    jsonData: json_data_here,
    headers: {'Content-Type' : 'application/json' , 'Accept' : 'application/json'}
}));

score 1 · Answer 2 · edited May 23 '17 at 12:22

1

Seems like there's a FireFox bug that jacks the content-type...

JQuery - $.ajax ContentType Problem in Firefox

edited May 23 '17 at 12:22

Community

1
1

answered Apr 19 '13 at 18:33

Jasmine

4,003
2
29
39

score 1 · Answer 3 · answered Apr 23 '13 at 13:05

try adding anonymous function inside submit instead of a json:

form.submit( function(){
               url: '../api/Empcontroller/SaveData',
               method: 'POST',
               headers: {
               'Content-Type': 'application/json'
                         },
               success: function ( fp, o )
               {


               },
               failure: function ( fp, o )
               {

               }
            } );

score 1 · Answer 4 · edited Mar 14 '15 at 00:23

1

Try this out:

form.submit( function(){
    url: '../api/Empcontroller/SaveData',method: 'POST',
    headers: {'Content-Type': 'application/json'},
    success: function (fp, o ){},
    failure: function (fp, o ){}
});

edited Mar 14 '15 at 00:23

A.L

10,259
10
67
98

answered Apr 23 '13 at 21:03

Md Nasimul Haq

49
5

score 1 · Answer 5 · answered Apr 25 '13 at 06:03

hhhmmm. strange. I think i found the bug. FireFox doesn't like it when I set the 'asyncron' state on 'false' to tell the script to wait for the reply of the serverrequest.

so instead of http.open("GET", destURL, true); I am using http.open("GET", destURL, false);

Firefox dont accept asynchron Option on "false"

score 1 · Answer 6 · answered Jul 22 '13 at 11:45

1

I am not sure if this is the problem. But doesn't file upload require an enctype Try using

enctype = multipart/form-data

This might help

answered Jul 22 '13 at 11:45

Infant Dev

1,659
8
24
48

score 0 · Answer 7 · answered Aug 08 '13 at 13:54

Use the below code.

form.submit( {
               url: '../api/Empcontroller/SaveData',
               method: 'POST',
               headers: {
               'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
                         },
               success: function ( fp, o )
               {


               },
               failure: function ( fp, o )
               {

               }
            } );

I just changed the content type.

Error when using form.submit()

7 Answers7