3 Replies Latest reply on Jul 11, 2019 3:30 PM by user1139894

    Add another button to IG toolbar with the same functionality as Save button

    user1139894

      I have an editable Interactive grid built on a collection. I am using the save button on the IG toolbar to save the changes to the collection. I have another button (Save to Database) which would apply the changes made to collection to the final table. I am looking to either add another button to IG tool bar that would save the changes to collection and also to database table or  When 'Save to Database' button (which is a page item) is clicked save the IG changes to the collection and also to database table.

       

      Some information on my application.

       

      APEX version: 18.1.0.00.45

       

      Change the sequence number of first row (that had the seq
      num 550) to 561 and click on re sequence, which will re order the records based
      on the new sequence numbers and change the Start and End Times accordingly.

       

       

      After re sequencing      

       

       

        • 1. Re: Add another button to IG toolbar with the same functionality as Save button
          John Snyders-Oracle

          Hi,

          It looks like you already have customized toolbar with extra buttons Resequence so I assume you know how to work with the toolbar and actions.

          Not sure if Save Up button is the Save action relabeled or a new custom button.

           

          Does save to the database mean submit the whole page and IG Save just saves the IG to the collection?

          If you want to submit the page just have the button's action function call apex.page.submit.

          If you want a single ajax request to do either save to collection or save to collection and to database you can easily parameterize the behavior by adding a hidden page item to submit to the IG. Add the page item to IG attribute Page Items to Submit.

          For example P1_SAVE_TO_DB. Source static ='N' always.

          The standard save action you can extend to first $s("P1_SAVE_TO_DB", "N") then call the original save action function.

          Add a new button, and action save-to-db that first $s("P1_SAVE_TO_DB", "Y") then call the original save action function.

           

          See Interactive grid, javascript before and after "delete-row" option for extending the save action to first set an item.

           

          Regards,
          -John

          • 2. Re: Add another button to IG toolbar with the same functionality as Save button
            user1139894

            Thank you for your prompt response. Sorry, I haven't checked your response earlier. I was able to apply your solution and it is working as intended.

             

            P1_SAVE_TO_DB was not resetting to 'N' when I use original save action button as resequence (I am sure I did something wrong there), so I ended up creating two new save action buttons and its working fine that way.

             

            Thanks,

            P.

            • 3. Re: Add another button to IG toolbar with the same functionality as Save button
              user1139894

              Follow up question:

               

              We have 2 custom buttons in the interactive grid, ‘Resequence’  and ‘Save to Database’ both execute the interactive grids save function. Based on the page item P1_SAVE_TO_DB, if N (Resequence) should save grid data to the collection and if P1_SAVE_TO_DB is Y (Save to Database) then saves the grid data to the collection and database table too.

              Sometimes we will click Resequence to make sure we have the data in the order we need and click ‘Save to Database’.  In this case P1_SAVE_TO_DB variable is not being set because we haven’t made any changes to the grid after we clicked Resequence and ‘Save to Database’ functionality is not working.

              Wondering how to get around this. Thanks much for your help!

               

               

              function( config ) {

                    

                  var $ = apex.jQuery,

                  toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(),

                  toolbarGroup = toolbarData.toolbarFind("actions3"); // this is the group with the action=add row

               

              toolbarGroup.controls.push({type: "BUTTON",

                                              action: "save-to-db",

                                              hot: true

                                             });

              toolbarGroup.controls.push({type: "BUTTON",

                                              action: "resequence"

                                             });

               

                  config.toolbarData = toolbarData;

                      config.initActions = function( actions ) {

              /*$s("P1_SAVE_TO_DB", "N");

              actions.lookup( "save" ).label = "Reseqence";*/      

                      actions.add([

                      {

                          name: "resequence",

                          label: "Resequence",

                          action: function()

                          {

                            $s("P1_SAVE_TO_DB", "N");

                            var save = actions.lookup("save"),

                            saveFn = save.action;

              saveFn();

                          }

                        }]);      

                      actions.add([

                      {

                          name: "save-to-db",

                          label: "Save To Database",

                          action: function()

                          { //var wp = apex.widget.waitPopup();

              $s("P1_SAVE_TO_DB", "Y");

                            var save = actions.lookup("save"),

                            saveFn = save.action;

                            saveFn();

                          }        }]);     

                  };  

              return config;

              }

               

              Thanks,

              P.