Ext Js API POST成功函数未执行,即使数据已发布

huangapple go评论86阅读模式
英文:

Ext Js API POST Success function is not executed even when the data is posted

问题

I am using ASP .Net Web Application Web Api and Ext JS as my UI. I dont know what seems to be the problem why my success function is not being executed but the error of failure is even when the data itself is posted and added in the database. The logs also show that only the failure is executed here. This is the grid js where when save is clicked, the api linked is called and the method post.

英文:

I am using ASP .Net Web Application Web Api and Ext JS as my UI
I dont know what seems to be the problem why my success function is not being executed but the error of failure is even when the data itself is posted and added in the database
the logs also shows that its the failure only that is executed here
Ext Js API POST成功函数未执行,即使数据已发布
this is the grid js
where when save is clicked the api linked is called and the method post

tbar: [
{
  text: "Add Movie",
  iconCls: "fa fa-plus",
  handler: function () {
    Ext.create("Ext.window.Window", {
      title: "Add Movie",
      modal: true,
      items: [
        {
          xtype: "form",
          bodyPadding: 10,
          defaultType: "textfield",
          defaults: {
            anchor: "100%",
            labelWidth: 100,
          },
          items: [
            {
              fieldLabel: "Name",
              name: "name",
              allowBlank: false,
            },
            {
              fieldLabel: "Description",
              name: "description",
              xtype: "textarea",
              allowBlank: false,
            },
            {
              fieldLabel: "Available",
              name: "available",
              xtype: "numberfield",
              allowBlank: false,
              regex: /^[0-9]+$/,
              regexText: "Only numeric values are allowed",
            },
          ],
          buttons: [
            {
              text: 'Save',
              formBind: true,
              handler: function () {
                var form = this.up('form').getForm();
                if (form.isValid()) {
                  console.log('Before form submit');
                  form.submit({
                    url: 'https://localhost:44345/api/movies',
                    method: 'POST',
                    success: function (form, action) {
                      console.log('Success: ', action.response.responseText);
                      try {
                        var jsonData = JSON.parse(action.response.responseText);
                        console.log('Valid JSON:', jsonData);
                        // Handle the successful response
                        Ext.Msg.alert('Success', 'Movie saved successfully');
                        form.reset();
                      } catch (error) {
                        console.log('Invalid JSON:', error);
                        // Handle the invalid JSON response
                        Ext.Msg.alert('Error', 'Invalid JSON response');
                      }
                    },
                    failure: function (form, action) {
                      console.log('Failure: ', action.response.responseText);
                      // Handle the failure response
                      Ext.Msg.alert('Error', 'Failed to save the movie');
                    }
                  });
                }
              }
            }
            ,
            {
              text: "Cancel",
              handler: function () {
                this.up("window").close();
              },
            },
          ],
        },
      ],
    }).show();
  },
},

],

and here is my post method in the api

public IHttpActionResult Post([FromBody] Movies movieDto)
    {
        if (!ModelState.IsValid)
            return BadRequest(ModelState);

        var movie = new Movies
        {
            Name = movieDto.Name,
            Description = movieDto.Description,
            Available = movieDto.Available
            // Set other properties as needed
        };

        _dbContext.Movies.Add(movie);
        _dbContext.SaveChanges();

        // Return the created movie with its assigned ID
        movieDto.Id = movie.Id;
        return Created(Request.RequestUri + "/" + movieDto.Id, movieDto);
    }

答案1

得分: 1

Ext.form.Basic.submit 方法要求 API 返回以下响应以指示成功操作:

{
    "success":true, // 请注意,这是布尔值,不是字符串
    "msg":"Consignment updated"
}

因此,HTTP 201 Created 不足够,您还必须发送一个带有 success 属性设置为 true 的 JSON。

请还要检查文档 here。如果您想更改此行为,您可以查看自定义读取器和编写器,但更改 API 可能更容易。

英文:

Ext.form.Basic.submit method requires the API to return the following response to indicate a successful operation:

{
    "success":true, // note this is Boolean, not string
    "msg":"Consignment updated"
}

So the HTTP 201 Created is not enough, you also have to send a JSON with success property set to true.

Please also check the documentation here. You could look into custom reader and writer if you want to change this behaviour but it might be easier to change the API.

huangapple
  • 本文由 发表于 2023年6月29日 19:36:33
  • 转载请务必保留本文链接:https://go.coder-hub.com/76580659.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定