SBSPEXT_HTMLB

[dieterzenger]

Hello,

can somebody give me a hint, how to create an pusbotton to hide and show a navigation bar on the left side of a screen.

I already checked the example SBSPEXT_HTMLB, and i can reuse the structure of the screens, but i need an arrow to close and open this navigation bar.

(similar as sap is doing this in the oss note search).

Thanks for your help

Dieter

[dieterzenger]

Thanks to you both.

Dieter

[dieterzenger]

Hello Raja,

i do not wan't to have a pushbutton to hide and show the left frame, i would like to have an arrow icon on the right side of the left frame. Is this also possible to add an icon on the top right side of the left frame?. When pressing the button the left frame (navigation pane) should be hidden, but not the icon > that the user is able to show the navigation pane again .> where do i have to add such an icon ?

Thank you

Dieter

[raja_thangamani]

Yes you can display the icons on top of the frameset. You can display the Icon as you wanted instead of button using image tag..

      <htmlb:image        id            = "myImage3"
                          tooltip       = "source = ICON_ARROW_LEFT"
                          src           = "ICON_ARROW_LEFT" />

You can change any icons..

<b>* Reward each useful answer</b>

Raja T

[dieterzenger]

Hello Raja,

thanks for your help.

I tried it with frame sets as you described.

The following problem occurs: While recreating the default page, the previous selection

(from the tree control and the BPS application in the PLAN frame)is gone and set to the initial state.

How can I store the status of the tree control (expand/collapsed)and the selected entry, shown in the wright frame ?

What I need, is only a small functions, which sets the column width of the menu frame to 15 or 0 without raising an event

on the server.

Is there a function (java script) available to do this ?

Thank you

Dieter

[raja_thangamani]

<i>How can I store the status of the tree control (expand/collapsed)and the selected entry, shown in the wright frame ?</i>

You can populate the toggle attribute dynamically to re-store the status of tree(expan/collapsed)

<htmlb:tree id          = "myTree1"
              height      = "75%"
              toggle      = "<%= tree_status %>" 
              title       = "Tree"
              width       = "90%"
              onTreeClick = "myTreeClick"
              table       = "<%= itview  %>" >
  </htmlb:tree>

<b>Oninputprocessing:</b>

• When the ICON is triggered to get the Hide your left side menu, get the Tree status whether is collased or not.

• When YOu make the tree visible, set the toggle variable tree_status as what it was earlier.

<b>OnLayout:</b>

YOu can Hide the Tree status for re-trieve the status as follows:

<input type = "hidden" name="tree_status"  value="<%= tree_staus%>">

[athavanraja]

Just for show/hide left frame dont go for server event and it will get complicated to maintain state.

check out this example. which uses javascript to show/hide left frame

<b>default.htm</b>

<%@page language="abap" %>
<%@extension name="htmlb" prefix="htmlb" %>
<htmlb:content design="design2003" controlRendering="sap">
  <htmlb:document>
  <htmlb:documentHead title="FC">

        <frameset id="TopFrame" rows="55" frameborder="0" border="0" >
           <frameset  id="MiddleFrame" cols="230,*" frameborder="0">
            <frame style="border-right-style:solid;border-color:#A5B1BF;border-width:4px;cursor:e-resize" src="left.htm" name="left">
            <frame src="right.htm" name="right">
          </frameset>
        </frameset>

    </htmlb:documentHead></htmlb:document>
</htmlb:content>

<b>right.htm</b>

<%@page language="abap" %>
<%@extension name="htmlb" prefix="htmlb" %>
<script language="JavaScript">
function hideFrame(){
parent.document.all("TopFrame").all("MiddleFrame").cols="10,*";
}
function showFrame(){
parent.document.all("TopFrame").all("MiddleFrame").cols="230,*";
}
</script>
<htmlb:content design="design2003" >
  <htmlb:page title=" " >
    <htmlb:form>
      <htmlb:textView text   = "RIGHT"
                      design = "EMPHASIZED" />
      <htmlb:button id            = "HF"
                    text          = "Hide Frame"
                    onClientClick = "javascript:hideFrame();" />
      <htmlb:button id            = "SF"
                    text          = "Show Frame"
                    onClientClick = "javascript:showFrame();" />
    </htmlb:form>
  </htmlb:page>
</htmlb:content>

<b>left.htm</b>

<%@page language="abap" %>
<%@extension name="htmlb" prefix="htmlb" %>
<htmlb:content design="design2003" >
  <htmlb:page title=" " >
    <htmlb:form>
      <htmlb:textView text   = "LEFT"
                      design = "EMPHASIZED" />
    </htmlb:form>
  </htmlb:page>
</htmlb:content>

Regards

Raja

[raja_thangamani]

Hi,

If you want to develope the screen strucutre just like SBPEXT_HTMLB, then in that application Leftside & right side screen coming from Different Framesets.

YOu can do something like below in the Layout:

If push_button_event EQ 'Close'. " Then Display only one Framset, ie Right handside Frameset
          <frameset  framespacing="0" frameborder="0">
             <frame name="test" src="BreadCrumb.bsp?sap-htmlb-design=<%=sap_htmlb_design%>" scrolling="auto">
          </frameset>

elseif. " Display left & right side framesets
      <frameset cols="16,*" frameborder="0" border="0">
            <frame style="border-right-style:solid;border-color:#A5B1BF;border-width:1px" name="menu" src="default_menu.htm?sap-htmlb-design=<%=sap_htmlb_design%>&themeRoot=<%=theme%>" scrolling="auto">
            <frame name="test" src="BreadCrumb.bsp?sap-htmlb-design=<%=sap_htmlb_design%>" scrolling="auto">
          </frameset>

Hope this will help you..

Raja T

Message was edited by:

Raja T

[raja_thangamani]

So do you want to remove the left side menu bar?

Raja T

Message was edited by:

Raja T