Setting the Quick Create button to a name - New UI - Forum - Rollbase - Progress Community

Setting the Quick Create button to a name - New UI

 Forum

Setting the Quick Create button to a name - New UI

This question is answered

Hello,

I have selected the option of having the records View page to enable tabs and I have arranged different sections in their respective tabs. I have a tab that has a section called "History" and I would like to replace the Quick create button name in that section to be: "Add Item". I have used the code below and this runs on load of the tab but doesn't set the button name. Is there a way I can achieve this? Kindly let me know.

Cheers.

  $(document).ready(function(){
  var sectionID = rbf_getSectionIdByTitle("History");
  sectionID = "#rbi_S_" + sectionID;
  var qcSpan = $(sectionID + " > ul > li > div > div > div > div > div.gridToolbarContainer > div.gridToolbar.k-toolbar.k-widget.k-toolbar-resizable > a.k-button.k-button-icontext.rbs-gridToolbar-QCbtn.k-toolbar-first-visible > span");
  qcSpan.text("Add Item");
  qcSpan.removeClass("k-sprite fa fa-plus");
});
Verified Answer
  • Hi Iram,

    Please try the following code.

    <script>

    $( document ).ready(function() {

            $($('section[name="Test Adjustments"]').find('a')[2]).text('Add Item');

    });

    </script>

    It may not resolve first-time user issue.

    Thanks

    Srinivas

All Replies
  • Is there any solution to the onload event of this please?

  • Hi Iram,

    Below is one way you can achive what you are looking for. In the view page's properties, define the following snippet in the onLoad section.

    var onActivate = function(e) {

        var gridToolbar = $('.gridToolbarContainer');

    if(gridToolbar) {

              var qcSpan = gridToolbar.find('.rbs-gridToolbar-QCbtn > span');

              qcSpan.removeClass();

              qcSpan.text('Add Item');

           }

    };

    var tabStrip = $('.rbs-page-tabs').data('kendoTabStrip');

    tabStrip.bind('activate',onActivate);

    Please let usknow if this works for you.

    Regards,

    Harsha.

  • It kind of does work but it messes up all other Quick create buttons on my other tabs. Is there a way I could make this specific to only the tab/section that I am trying to change the quick create button text for?

  • Hi Iram,

    I am able to change the Quick create button text using the following script. Hope it works for you.

    <script>

       $( document ).ready(function() {

           $($('a[title="Quick Create"]')[0]).text('Add Item');

       });

       </script>

    Thanks

    Srinivas

  • Hi Iram,

    Please follow below steps.

    1) Click on Design this page of Tab

    2) Add a script component

    3) Paste the below code and click on save

    <script>

      $( document ).ready(function() {

          $($('a[title="Quick Create"]')[0]).text('Add Item');

      });

      </script>

    Thanks

    Srinivas

  • Hello Srinivas,

    Ok it does work on that particular tab now but again there's an issue. When I am on that tab i.e. History (in my case), it works even when I refresh.

    When I am on some other tab (say Activity), then refresh the screen and then jump to the History tab, it doesn't work on the History tab.

    There is still something wrong with this.

  • Hi,

    I tried the steps that you provided.

    I am unable to reproduce the issue. Means, in all the case, i can see the updated label on quick create button.

    I tried in chrome browser.

    Is there any specific case that you observed this behavior?

    Thanks and Regards,

    Chandu.

  • Hi Iram,

    Could you please share your application? or any sample application which demonstrates your scenario.

    Thanks

    Srinivas

  • Hello Srinivas,

    I have attached an example Application XML for your reference. If you go to the view page of the record in IK Test Object 1, I have added the code on the Test Adjustments tab and I only want the quick create on that tab to be renamed to "Add Item".

    So if you are coming on the view page for the first time, and if you click on the tab - "Test Adjustments", you'll notice that the quick create is still a plus sign, however now if you click on the tab - "IK Test Object 2", you'll notice that the quick create is called "Add Item" which is not where I want to place it. Its as though the onload is running later or something. Kindly let me know if you cannot reproduce it.

    Cheers.

    IK Test_v1.xml

  • Hi Iram,

    In the onActivate() method i have prodived above,  e.item refers to the selected tab's DOM element.

    So, $(e.item).index()  will give you its index and you can use it to do the necessary action or not.

    Does that help ?

    Regards,

    Harsha.

  • Hello @Sri Harsha,

    Unfortunately that did not help much. It is demonstrating the same behaviour again as mentioned above:

    If I am reloading the page when the tab (the one I want) is selected, then it works. If I am reloading the page by selecting another tab and then navigating to the tab I want, it doesn't work.

  • QCRename.jpg

    Hi Iram,

    Unfortunately, I am unable to reproduce the issue. As you said in "IK Test Object 2" tab Quick created is not renamed to "Add Item". See the attached screenshot.

    When you move back to "Test Adjustment", some extra options we are displaying. We have an issue for this. Hope you are not talking about this issue. See the attached screenshot.

     "IK Test Object 2"
     "IK Test Object 2"
  • QCRename2.jpg

    Attached the missed screenshot.

  • Hello Srinivas,

    I am having the issue only on page reload. I don't have any other javascript code running so I know its not my code here. Could you confirm to me the following things please:

    1) Have you tried the page reload scenario as I mentioned above?

    2) Which of the above two code snippets did you use to make sure that it is working? (the activate code or the title Quick Create code).

  • I feel that the onload of the tab doesn't work correctly i.e. doesn't work properly when the tab is clicked.