Post not working?

[mtxxx]

I have just a very simple form:
` <form id="paymentform" @submit.prevent="processForm3">

Account number

  <div class="field">
    <label class="label">Summ</label>
    <input type="number" class="input" name="ammount" v-model="ammount" v-validate="'required|decimal:2'">
    <i v-show="errors.has('ammount')" class="fa fa-warning"></i>
    <span v-show="errors.has('ammount')" class="help is-danger">{{ errors.first('ammount') }}</span>
  </div>

  <div class="field has-text-right">
    <button type="submit" class="button is-danger">Submit</button>
  </div>
</form>`

My send method looks like:
processForm2() {
var x = this.accnbr;
var y = this.ammount;
axios({
method: 'post', url: '/api/Payment/CreatePayment2',
data: { accnbr: x, ammount: y }
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
}
OR
processForm2() {
this.$validator.validateAll().then((result) => {
if (result) {
this.$http.post('/api/Payment/CreatePayment2', {
accnbr: this.accnbr, ammount: this.ammount
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
return;
}
});

And finally Controller
[HttpPost("[action]")]
public IActionResult CreatePayment2([FromForm] string accnbr, [FromForm] decimal ammount)
{
//create payment ...
var request = this.Request;
string refNumber = "2245689";

        return Ok(refNumber);
    }

Post hit the controller action, I can debug it. Problem is that params accnbr and ammount are empty.

I tried
public IActionResult CreatePayment2([FromQuery(Name = "accnbr")] string accnbr, [FromQuery(Name = "ammount")] decimal ammount)
and
public IActionResult CreatePayment2([FromBody] string accnbr, [FromBody] decimal ammount)
Non of this options works.

What am I doing wrong?

If I change javascript to
let response = await this.$http.post(/api/Payment/CreatePayment2?accnbr=${this.accnbr}&ammount=${this.ammount})
parameters value are fine.

But why
this.$http.post('/api/Payment/CreatePayment2', {
accnbr: this.accnbr, ammount: this.ammount
})
not pass parameters value?

[Nordes]

Hi, I haven't tried your code. But have you looked with Fiddler (or similar) in order to see what kind of request was being sent?

Note that using the syntax highlighting for code block makes it easier to read ;).

Also: https://www.red-gate.com/simple-talk/dotnet/asp-net/improved-model-binding-asp-net-core/

You are using [FromForm] and it might be one of the reason. Usually a post send using the body not the QueryString or FromBody.

Ref: https://github.com/axios/axios

  // `data` is the data to be sent as the request body
  // Only applicable for request methods 'PUT', 'POST', and 'PATCH'
  // When no `transformRequest` is set, must be of one of the following types:
  // - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
  // - Browser only: FormData, File, Blob
  // - Node only: Stream, Buffer

Also, don't forget about the context in javascript:

this.$validator.validateAll().then((result) => {
  if (result) {
    let that = this // <== see here we keep the context available
    this.$http.post('/api/Payment/CreatePayment2', {
      accnbr: that.accnbr, ammount: that.ammount // we can still use 'that' which point to this original context.
    }) // Usually with promises, you can pass the context with a "this" parameter at the end ( `}, this)` ) so that the this context is still available.
  }