Add Button to Catalog Item Page

[markmmiller09]

I'm looking to add a simple button to a service catalog item. I currently have a checkbox that triggers an event where I do extra processes. However I'd like a button instead of a checkbox. I don't see any 'buttons' as a variable type so I was thinking of using jQuery to inject a button at run time using a 'onload' client script. Then within my jQuery code, I would add an event listener to trigger my processes.

Does anyone have experience with this? I've tried using jQuery with ServiceNow a few times but have always found it incredibly difficult to traverse the DOM and select what elements I'd like to manipulate (I think this may be because of the iFrames ServiceNow uses).

Does jQuery code work through a 'onload' client script?

Would something like this work?

var newButton = $('#buttonIdOfElement');

newButton.html(<button...></button>);

newButton.onclick(function() {

  // do processes here

}

[adiddigi]

Mark, $ in your code is referring to Prototype.js not jQuery. For jQuery you should be using $j if you are on Eureka.

DOM injection is possible using onLoad client script. You could even attach events to different HTML elements.

[markmmiller09]

Thanks Abhiram,

I'll have to research how to include jQuery in Berlin, because, after looking through the HTML source, I don't believe it's pulling any jQuery in.

Also, when you select elements with jQuery do you have any problems? Do you have to specify the iFrame first and then traverse?

I've found that the following JavaScript doesn't seem to work...

var a = document.getElementById('someId');console.log(a);

Is this because of the iFrames?

[adiddigi]

Mark, there are only two iFrames... one is the Navigation and the second one is the Main frame.

Let's say you want to access the Order Now button, you do this in OnLoad Client Script :

function onLoad() {

      //Type appropriate comment here, and begin script below

      $('order_now').hide();

      alert(document.getElementById('order_now'));

}