Page 1 of 2 12 LastLast
Results 1 to 10 of 20

Thread: Submitting a form seems to be mis-interpreting the response type

  1. #1
    Sencha User
    Join Date
    Nov 2010
    Posts
    85

    Default Submitting a form seems to be mis-interpreting the response type

    I have a FormPanel which is used to upload a file along with several other fields. In my FormPanel I have fileUpload set to true, and I have the following submit handler:
    Code:
    submitHandler: function () {
            if (this.getForm().isValid()) {
                this.getForm().submit({
                    url: baseUrl + '/TestRequests/AddRequest',
                    //waitMsg: 'Adding Request',
                    success: function (form, o) {
                        this.fireEvent(EventStrings.EditRequestSaved);
                    },
    
                    failure: function (form, o) {
                        Ext.Msg.show({
                            title: 'Add Request Failed',
                            msg: o.result.error,
                            buttons: Ext.Msg.OK,
                            icon: Ext.Msg.ERROR
                        });
                    }
                });
            }
        }
    When I click on the save button, chrome's js console shows "Uncaught SyntaxError: Unexpected token <" in ext-all-debug.js on line 4233.

    The Json the AddRequest URL returns is:
    Code:
    {"success":false,"msg":"Failed to add request"}
    There is no other content being transferred from the server to the web browser. No matter what json gets returned though (even if a 404 occurs) the syntax error still happens.

    When I step into the code, into the doDecode function and look at what is being passed into the json parameter, Chrome's console shows the parameter as being equal to:
    Code:
    <pre style="word-wrap: break-word; white-space: pre-wrap;">{"success":false,"msg":"Failed to add request"}</pre>
    Since doDecode is trying to eval() this string I can see why the syntax error is occurring, but I don't understand why that is happening in the first place.

    One thing I noticed is that the chrome console also shows this warning message:
    Code:
    Resource interpreted as document but transferred with MIME type application/json.
    The only thing I can think of is that submitting this form is triggering something that is making the browser thing a document is being returned when it is really json that is being returned. There are 2 other AJAX calls that run before this (loading of data into 2 ext grids) and those are being correctly recognized by Ext as json, and the headers for the AddRequest response are correct, and correctly declaring the response as json as far as I can tell. The response headers are:
    Code:
    Cache-Control:private
    Content-Length:47
    Content-Type:application/json; charset=utf-8
    Date:Tue, 04 Jan 2011 18:26:40 GMT
    Server:Microsoft-IIS/7.5
    X-AspNet-Version:4.0.30319
    X-AspNetMvc-Version:2.0
    X-Powered-By:ASP.NET
    Does anyone have any idea why this is happening?

  2. #2
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364

    Default

    that's not an extjs issue, but something about the way the browser and server are communicating. Does this only happen in chrome?

  3. #3
    Sencha User
    Join Date
    Nov 2010
    Posts
    85

    Default

    Firefox is having a similar issue with this too. Although I don't see any explicit errors (however it's error console filled with a lot of useless junk, mostly css warning messages) it does not process the json, instead Firefox gives the download prompt that says "You have chosen to open AddRequest, which is a: application/json" and gives me the "Open With" and "Save File" options, so it's obviously mis-interpreting it.

    *Edit* Also even in firefox neither the Success or failure handlers are being called

  4. #4
    Sencha User
    Join Date
    Nov 2010
    Posts
    85

    Default

    Further playing around shows that this seems to be an issue with the fileUpload: true parameter. When I comment out fileUpload: true in my FormPanel the browser is successfully sending off the request and expecting json being returned, and Chrome is correctly categorizing the returned result as XHR.

  5. #5
    Sencha User
    Join Date
    Nov 2010
    Posts
    85

    Default

    Sorry for bumping this, but I really need to upload files via ExtJS for this project to work. For some reason Ext seems to be telling the browser to to expect a document as the form's submitted response even though json is being returned. This only happens when the formPanel's fileUpload parameter is set to true. When it is set to false, the browser correctly interprets the response as JSON and everything goes on correctly, but I do need the ability to upload a file with the rest of the form data.

  6. #6
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364

    Default

    try not setting the response to application/json. All "AJAX" file uploads must use iframes, thus a traditional form submit is required. The exception to this rule is use of the XHR2 object, which most browsers don't implement.

  7. #7
    Sencha User
    Join Date
    Nov 2010
    Posts
    85

    Default

    Quote Originally Posted by [email protected] View Post
    try not setting the response to application/json. All "AJAX" file uploads must use iframes, thus a traditional form submit is required. The exception to this rule is use of the XHR2 object, which most browsers don't implement.
    Excellent thank you very much! Forcing the response type to text/html seems to fix it!

  8. #8
    Sencha User
    Join Date
    Jul 2010
    Posts
    2

    Default

    sorry for the maybe dumb question, but how does one do that? (setting the response to smth different than application/json)

  9. #9
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,791

    Default

    This is something you need to do on the server, not in Ext. How you do it depends on what server you are using.

  10. #10
    Sencha User
    Join Date
    Apr 2011
    Location
    Barcelona, Spain
    Posts
    8

    Default ThanksQ

    Thanks, that worked out for me!

    Bests,
    Frank

Page 1 of 2 12 LastLast

Similar Threads

  1. Replies: 6
    Last Post: 8 Feb 2011, 3:45 PM
  2. Textfield interpreting text as HTML
    By richardm in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 9 Apr 2010, 10:26 AM
  3. Problem with response after submitting the Form
    By magnum99 in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 28 May 2009, 5:12 PM
  4. How to get response JSON after form submitting?
    By karantir in forum Ext 1.x: Help & Discussion
    Replies: 5
    Last Post: 25 Jul 2007, 5:37 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •