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
– Geoff James, Commented Apr 9, 2018 at 8: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
– Nomesh Gajare, Commented Apr 10, 2018 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
– Geoff James, Commented Apr 10, 2018 at 15:15
Either way, in terms of differentiating between string.Empty and null when deserializing your values, would this answer help? — Geoff James
– Geoff James, Commented Apr 10, 2018 at 15:17

Suren Srapyan · Accepted Answer · 2018-04-09 06:15:44Z

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 9, 2018 at 6:15

answered Apr 9, 2018 at 6:07

Suren Srapyan

68.9k14 gold badges128 silver badges119 bronze badges

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

8 Comments

Nomesh Gajare Over a year ago

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?

Suren Srapyan Over a year ago

If you pass an empty string, it will reached as an empty string.

Nomesh Gajare Over a year ago

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.

Suren Srapyan Over a year ago

Do you get any data in the API ?

Nomesh Gajare Over a year ago

I get it as null.

|

tech-gayan · Accepted Answer · 2018-08-03 12:19:20Z

0

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.

answered Aug 3, 2018 at 12:19

tech-gayan

1,4431 gold badge11 silver badges25 bronze badges

Collectives™ on Stack Overflow

pass value as empty string to WEb API from typescript

2 Answers 2

8 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related