Skip to main content

Replacing xpage tabbed panel with jQuery tabs:

Replace xpage tabbed panel with jQuery tabs. So that every time when the tabs are changing the refreshing won't occur. And it is fancy as you like.

Step1:
Paste the following code in the editor side of your xpage to get the tabs:

  <script>
    $(function() {
        $( "#tabs" ).tabs();
    });
  </script>

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Nunc tincidunt</a></li>
        <li><a href="#tabs-2">Proin dolor</a></li>
        <li><a href="#tabs-3">Aenean lacinia</a></li>
    </ul>
 <div id="tabs-1">
       tab1 content
    </div>
    <div id="tabs-2">
        tab2 content
    </div>
    <div id="tabs-3">
    tab3 content
    </div>
</div>

Step2:

Add the following files in the Resources--->File section of your domino designer

a)jquery-1.8.2.js
b)jquery-ui.js

download the above files from the http://jqueryui.com

Step3:

Add the following files in the Resources--->Style sheet section of your domino designer

a)jquery-ui.css
b)style.css

Step4:

Add the following files to your xpage where the tabs have been set.

add in the resources section of the xpage properties.

There you get your fancy xpage tabs

Comments

Post a Comment

Popular posts from this blog

Lotusscript to establish ODBC connection:

The script, when executed from a button, will create a new record in a specified ODBC data source, attempt to save the new record and display a message indicating whether the operation was completed successfully. If the operation is not completed sucessfully, it is likely that either your data source is read-only or your ODBC driver does not permit updates to the data source. Important: Complete each of the four steps below before running the script. 1. Create a new agent and add the following UseLSX command to the Options event: UseLSX "*LSXODBC" 2. Add the following script to the Initialize event of the agent. NOTE: Do not add the 'Sub' and 'End Sub' lines. Dim ui As New NotesUIWorkspace     Dim uidoc As NotesUIDocument     Dim doc As NotesDocument     Dim connection As ODBCConnection     Dim query As ODBCQuery     Dim result As ODBCResultSet         Set uidoc=ui.CurrentDocument ...
1 comment
Read more

Dynamically changing the combo box values in Javascript:(Lotus Notes)

I need to change the 2nd combobox value depend on the value of the first combobox value. Steps: 1) Create a combo box name it as "cmbValue" . And have some values. 2) Give  default value to that combobox. 3) In the Onchange of that combo box place the code below. 4) Create another combobox value and name it as "cmbValue1" . 5) Give default value to that combobox also. Sample Code(Modify according to your values):   var doc = document.forms[0].cmbValue; var doc1 = document.forms[0].cmbValue1; if(doc.options[doc.selectedIndex].text=="--Select--") { doc1.remove(0) doc1.options[0] = new Option("--Select--","cmbValue1") return false; } else { if(doc.options[doc.selectedIndex].text=="One") {     doc1.options[0] = new Option("four","cmbValue1")     doc1.options[1] = new Option("five","cmbValue1")     return false; } else if(doc.options[doc.selectedIndex].text=="Two") {     doc1.opt...
1 comment
Read more

Data Sources

Data sources define what data should be imported. Only admin users can create data sources. In this module, the data source is a Microsoft Excel spreadsheet. Other possible data sources are: CSV JDBC FTP HTTP XML Data is not imported directly from a Data Source into the target table. The steps are: Load Data into a staging table Create Transform Map Run Transform to move data from the staging table to the target table Check data integrity While transforming, 1)  Do not use the string NULL in source data or in a script. NULL is a reserved word. Null and null can be used but not NULL. 2)  Field Maps take precedence over Transform Map scripts. 3)  Use the coalesce option in a Transform Map Field Map to determine if a row in the source data matches a record in the target table. The coalesce option makes a field a record's unique key. Set the coalesce value to true to use a field to check for collisions. Transformation Script: Transform...
Post a Comment
Read more