Ajax sending null string to controller?

Question

I'm using an ajax call to try to send a string to my controller but it is returning null

My controller

[HttpPost]
public async Task<string> CreateCarouselItem(string itemText){
    var newItem = new CarouselItem(itemText);
    await CarouselHelper.AddAndSaveAsync(newItem, _context);

    return itemText;
}

And My javascript

function FinishUp()
{
editor.disable();
var boxText = editor.getText();

$.ajax({
    type: "POST",
    url: '/Home/CreateCarouselItem',
    dataType: "text",
    data: { boxText },
    traditional: true,
    success: function (data) {
        console.log(data);
    },
    error: console.log("it did not work"),
});

}

Sending up boxText and looking for itemText?

epascarello
– epascarello

2019-08-22 19:39:25 +00:00
Commented Aug 22, 2019 at 19:39 — epascarello
– epascarello, Commented Aug 22, 2019 at 19:39

Chris Pratt · Accepted Answer · 2019-08-22 19:46:07Z

1

The dataType option defines the expected response type, not the type of the data you're sending. For that, you need contentType, which needs an actual mime type, i.e. text/plain rather than just "text".

Then, you're sending an object instead of a string. If you just want the string then you should have just:

data: boxText

(without curly braces)

Finally, in your action, the default binding type is x-www-form-urlencoded, which expects a key value pair. You can change data again to:

data: 'itemText=' + boxText

Or you can bind from the body instead:

public async Task<string> CreateCarouselItem([FromBody]string itemText)

However, for that, I believe you also need to enable the text serializer in startup:

services.AddMvc(o =>
{
    o.InputFormatters.Add(new TextInputFormatter());
});

answered Aug 22, 2019 at 19:46

Chris Pratt

240k37 gold badges414 silver badges469 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jake Mettler Over a year ago

So I changed dataType to contentType and swapped "text" for "text/plain" as well as fixing data like you mentioned and its still coming back null. If i add the [FromBody] it becomes a 415 status code. And I'm not able to instantiate the TextInputFormatter because it's an abstract class

Chris Pratt Over a year ago

Sorry about that. I never actually had a need to accept plain text. You can simply create a concrete class that inherits from that, and then new up the concrete class. However, your best bet is to simply let it come as x-www-form-urlencoded and send data: "itemText=" + boxText.

Ryan · Accepted Answer · 2019-08-23 02:19:40Z

0

The name of the parameter which you would receive on action parameter is itemText, then you need to configure you data as data: {itemText: boxText }in ajax to bind the itemText:

$.ajax({
        type: "POST",
        url: '/Home/CreateCarouselItem',
        dataType: "text",
        data: {itemText: boxText },
        traditional: true,
        success: function (data) {
            console.log(data);
        },
        error: console.log("it did not work"),
    });

answered Aug 23, 2019 at 2:19

Ryan

20.3k10 gold badges44 silver badges68 bronze badges

Collectives™ on Stack Overflow

Ajax sending null string to controller?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related