Hover in Siebel Open UI
On hover make the characters bold:

Requirement was to make bold on hover.We achieved the same by writing code in Applet PR file.

(a)

(b)

(a)var interactionusageappid = appletMap["<Applet Name>"].GetFullId();

$("#" + interactionusageappid).find('.leftRightArrow').hover(function() {

                        $(this).addClass("borderForCarousalHighlight").removeClass("leftRightArrow");

                    }, function() {

                        $(this).addClass("leftRightArrow").removeClass("borderForCarousalHighlight");

                    });

(b)var interactionusageappid = appletMap["<Applet Name>"].GetFullId();

$("#" + interactionusageappid).find('.carousel-indicators').find('.radioToggle').hover(function() {

$(this).addClass("borderForCarousalHighlight1").removeClass("carousel-     indicators li");

}, function() {

$(this).addClass("carousel-indicators li").removeClass("borderForCarousalHighlight1");

     });

I hope this might help someone with the similar requirements.

Your comments are most welcome!!

Hi Friends,

We got 2 requirement to restrict the text limit visible  in a box in Siebel Open UI .

First: Text visible in a single line and extra text to be hidden as below:

The second line is a text field which can have text length that cannot fit in the text box.So instead of getting it visible outside the text box we had to restrict the text in the box.This can easily be achieved by applying ellipsis css class.

ellipsis{width: 200px !important;
 text-overflow: ellipsis;
 white-space: nowrap;
 overflow: hidden;}

Second: Text visible in 2 lines and extra text to be hidden as below:

The second line is a text field which can have text length that cannot fit in the text box.So instead of getting it visible outside the text box we had to restrict the text in 2 lines within the box .This  I could not  achieve by applying ellipsis css class as it resricts the text in single line ad so it doesnot fulfill our requirement.So I decided to write a functiuon in our Siebel PR file.

                      var myTag = $('#des2Para1div1').text();
if (myTag.length > 80)
                            {
                                var truncated = myTag.trim().substring(0, 80) + "…";
                             $('#des2Para1div1').text(truncated);
                          }

Note: $('#des2Para1div1').text() will get the text value of the field.

By using the above function I was able to restrict the extra text within 2 lines within the box.

Your comments are most welcome on this.

Event Flow in Siebel on click of a button

Event handling in Siebel on click of a button:

Below is the flow of event in Siebel that takes place when a user clicks on a button.