pass value as empty string to WEb API from typescript

Question

I want to pass an empty string to C# web api from javascript. But when i pass empty string from typescript i get null in the webapi parameter. How to pass empty string?

here is my client web api call:

public ChangePassword(username: string, oldPassword: string, newPassword: string) {
    const oldPwd = (oldPassword === null || oldPassword === undefined) ? '' : oldPassword;
    const newPwd = (newPassword === null || newPassword === undefined) ? '' : newPassword;

    const endPointUrl: string = this.webApi.EndPoint + '/Authentication/ChangePassword';
    const parameters = new HttpParams()
        .set('username', username)
        .set('oldPassword', oldPwd)
        .set('newPassword', newPwd);
    return this.httpClient.post(endPointUrl, '', { params: parameters });
}

And my web api is

[HttpPost]
    public void ChangePassword(string userName, string oldPassword, string newPassword)
    {
        WebServiceFault fault = _securityManager.ChangePassword(userName, oldPassword, newPassword);
        if (fault == null)
        {
            return;
        }

        throw WebApiServiceFaultHelper.CreateFaultException(fault);
    }

When i pass null as parameter for old and new password to the ChangePassword() method i get the string as null in the web api method insted of getting an empty string.

There are a few details that Suren has pointed out below, that I would agree with. I'm going to be the elephant in the room and ask: What *exactly* is your use case for passing an empty string to your controller? Is doing a `string.IsNullOrEmpty` check not enough? or do you need to use both `null` and `""` cases in your code? — Geoff James, Apr 09 '18 at 08:16
null and " " have different meaning. null defines that the user did not call the api properly and " " defines that the user wants to set empty password. — Nomesh Gajare, Apr 10 '18 at 15:11
It's reasonable enough that you have different use cases for them. What I can't make head or tails of, is that you're allowing users to set an empty password..? If you ask me, that's just bad design. Is there any reason *why* you need to let your users set empty passwords? — Geoff James, Apr 10 '18 at 15:15
Either way, in terms of differentiating between `string.Empty` and `null` when deserializing your values, would [this answer](https://stackoverflow.com/a/14610739/6240567) help? — Geoff James, Apr 10 '18 at 15:17

Suren Srapyan · Answer 1 · 2018-04-09T06:15:44.260

0

You are doing a post request, so consider to pass data via body as the second argument, not as query params.

public ChangePassword(username: string, oldPassword: string, newPassword: string) {
    const oldPwd = (oldPassword === null || oldPassword === undefined) ? '' : oldPassword;
    const newPwd = (newPassword === null || newPassword === undefined) ? '' : newPassword;

    const endPointUrl: string = this.webApi.EndPoint + '/Authentication/ChangePassword';

    return this.httpClient.post(endPointUrl, { username, oldPwd, newPwd });
}

And get in the API using [FromBody] attribute.

[HttpPost]
public void ChangePassword([FromBody]string userName, [FromBody]string oldPassword, [FromBody]string newPassword)
{
    WebServiceFault fault = _securityManager.ChangePassword(userName, oldPassword, newPassword);
    if (fault == null)
    {
        return;
    }

    throw WebApiServiceFaultHelper.CreateFaultException(fault);
}

Also it will better to have a model which describes the change password model and get the data as a model, not as separate parameters. Something like

[HttpPost]
public void ChangePassword([FromBody]ChangePasswordModel model)

edited Apr 09 '18 at 06:15

answered Apr 09 '18 at 06:07

Suren Srapyan

66,568
14
114
112

Thanks for the answer. But you know any way to attempt on the core problem. i.e, passing an empty string to web api method? – Nomesh Gajare Apr 09 '18 at 06:29
If you pass an empty string, it will reached as an empty string. – Suren Srapyan Apr 09 '18 at 06:30
Yes thats the main problem. if you observe in the client ChangePassword method if the string is null or undefined i pass empty string. Still the web api received null. – Nomesh Gajare Apr 09 '18 at 06:30
Do you get any data in the API ? – Suren Srapyan Apr 09 '18 at 06:30
I get it as null. – Nomesh Gajare Apr 09 '18 at 06:31
If you pass some string, do you get it? – Suren Srapyan Apr 09 '18 at 06:37
Yes, I do get it. I have only problem with not able to pass empty string. – Nomesh Gajare Apr 09 '18 at 06:40
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/168527/discussion-between-nomesh-gajare-and-suren-srapyan). – Nomesh Gajare Apr 09 '18 at 06:40

score 0 · Answer 2 · answered Aug 03 '18 at 12:19

Instead of passing as separate parameters use a model as below,

public class ChangePasswordModel 
{
     [DisplayFormat(ConvertEmptyStringToNull = false)]
     public string userName { get; set; }
     [DisplayFormat(ConvertEmptyStringToNull = false)]
     public string oldPassword { get; set; }
     [DisplayFormat(ConvertEmptyStringToNull = false)]
     public string newPassword { get; set; }
}

Use it as,

[HttpPost]
public void ChangePassword([FromBody]ChangePasswordModel model)

DisplayFormat attribute on the property of your model class will do the thing what you want.

pass value as empty string to WEb API from typescript

2 Answers2