Update list and detail views after mass actions and button clicks

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • bandtank
    Active Community Member
    • Mar 2017
    • 379

    Update list and detail views after mass actions and button clicks

    I added a custom button in the detail view of an entity, which works as expected. I would like to refresh the page after the button finishes processing, but I can't figure out how to do that. I'm using this documentation.

    Here is my code:
    HTML Code:
    define('custom:send-message', ['action-handler'], function (Dep) {
      return Dep.extend({
        actionSendMessage: function (data, e) {
            this.view.notify("Sending...");
            Espo.Ajax.postRequest('MessageC/action/Send', {
              ids: [this.view.model.id],
            }).then(() => {
              Espo.Ui.success('Done');
              this.view.reRender(true);
            });
        },
    
        initSendMessage: function () {
          if(this.view.model.get('status') !== "Waiting") {
            this.view.hideHeaderActionItem('sendMessage');  
          }
        },
      });
    });​


    I added "this.view.reRender(true)" to refresh the page, but it doesn't work in list of detail view. Any ideas?
  • esforim
    Active Community Member
    • Jan 2020
    • 2204

    #2
    You probably know this already but in case you don't!

    With version 7+, after an upgrade/update of EspoCRM all the logged in page will pop up saying there is an update so you need to refresh.

    Same thing happen when you install Extension.

    Perhaps if you look at these two code you can see how it is done... however it have a Popup requesting permission though so you might want to remove that code (if that even possible!).

    Comment

    • rabii
      Active Community Member
      • Jun 2016
      • 1250

      #3
      Originally posted by bandtank
      I added a custom button in the detail view of an entity, which works as expected. I would like to refresh the page after the button finishes processing, but I can't figure out how to do that. I'm using this documentation.

      Here is my code:
      HTML Code:
      define('custom:send-message', ['action-handler'], function (Dep) {
      return Dep.extend({
      actionSendMessage: function (data, e) {
      this.view.notify("Sending...");
      Espo.Ajax.postRequest('MessageC/action/Send', {
      ids: [this.view.model.id],
      }).then(() => {
      Espo.Ui.success('Done');
      this.view.reRender(true);
      });
      },
      
      initSendMessage: function () {
      if(this.view.model.get('status') !== "Waiting") {
      this.view.hideHeaderActionItem('sendMessage');
      }
      },
      });
      });​


      I added "this.view.reRender(true)" to refresh the page, but it doesn't work in list of detail view. Any ideas?
      Have tried this
      Code:
      this.listenTo(this.model, 'sync', this.render);​
      Rabii
      Web Dev

      Comment

      • telecastg
        Active Community Member
        • Jun 2018
        • 907

        #4
        Make sure that you are refreshing the correct view.

        Remember that Backbone uses nested views and a "list" inside a "detail" view is probably a nested view.

        Perhaps this post explains it better: https://forum.espocrm.com/forum/deve...-s-detail-view

        Comment

        • bandtank
          Active Community Member
          • Mar 2017
          • 379

          #5
          Thanks everyone for the help. Here is what I did to fix my issues for a "Send Message" button in the detail view of an entity called MessageC:

          In custom/Espo/Custom/Resources/metadata/clientDefs/MessageC.json:
          Code:
          {
              ...
              "massActionList": [
                  "__APPEND__",
                  "sendMessages"
              ],
              "checkAllResultMassActionList": [
                  "__APPEND__",
                  "sendMessages"
              ],
              "massActionDefs": {
                  "sendMessages": {
                      "handler": "custom:send-messages",
                      "initFunction": "initSendMessages"
                  }
              },
              ...
              "menu": {
                  "detail": {
                      "buttons": [
                          "__APPEND__",
                          {
                              "label": "Send Message",
                              "name": "sendMessage",
                              "action": "sendMessage",
                              "style": "default",
                              "acl": "edit",
                              "aclScope": "MessageC",
                              "data": {
                                  "handler": "custom:send-message"
                              },
                              "initFunction": "initSendMessage"
                          }
                      ]
                  }
              },
              "views": {
                  "detail": "custom:views/MessageC/detail"
              }
          }​​
          In client/custom/src/views/MessageC/detail.js:
          Code:
          define('custom:views/MessageC/detail', ['views/detail'], function (Dep) {
            return Dep.extend({
                setup: function() {
                    Dep.prototype.setup.call(this);
                    this.listenTo(this.model, 'sync', (model) => {
                      if(model.get('status') !== "Waiting") {
                        this.hideHeaderActionItem('sendMessage');
                      } else {
                        this.showHeaderActionItem('sendMessage');
                      }
                    });
                },
            });
          });​
          In client/custom/src/send-message.js:
          Code:
          define('custom:send-message', ['action-handler'], function (Dep) {
            return Dep.extend({
              actionSendMessage: function (data, e) {
                  this.view.notify("Sending...");
                  Espo.Ajax.postRequest('MessageC/action/Send', {
                    ids: [this.view.model.id],
                  }).then(() => {
                    this.view.model.fetch().then(() => {
                      Espo.Ui.success('Done');
                    });
                  });
              },
          
              initSendMessage: function () {
              if(this.view.model.get('status') !== "Waiting") {
                  this.view.hideHeaderActionItem('sendMessage');
                }
              },
            });
          });  ​
          The button appears when the status is set to "Waiting" and it disappears when the status is set to anything else. Maybe there is a better solution, but the code I posted works well so far.

          Comment

        • esforim
          Active Community Member
          • Jan 2020
          • 2204

          #6
          @badtank not sure if you still need this or if it relevant to you:

          Hello, I wrote a small extension to replace the datetime-short with just datetime in the stream as I always hated not seeing the full datetime and editing the original note.js is not upgrade safe. It works by replacing the text with the text shown by hovering the mouse, so it's upgrade safe. I tested it on various instances

          Comment

          Working...