Jquery in Xpage - HighChart

Everytime we used to go dojo chart for making the chart in Xpage...

But here is an easy way to make graph and Input translation functionality using Jquery.,

I foung this in Xomino site., It is very useful for chart making in Xpage...

HighChart in Xpage

How to generate Dynamic view Column - Xpages

Here is an one more old version of previous post Dynamic View Panel.,

I tried to generate the view column values dynamically., Yes it is very easy to do this.,

Here is code we can change the view column's value dynamically...

Iterate the following code will automatically generate the view column's value.,

c="viewColumn"+@Text(i+1);
getComponent(c).setRendered(true)
getComponent(c).setColumnName(t[i]);

Check box group vs Hash Map in Xpage

In Client side javascript, it is a powerful script language for manipulating our DOM object.

I have a check box group in Xpages. And I added a hashMap value into that check box group.

Ex:

key value
1 X
2 Y
3 Z

But I am not able to get the key's label name [1,2, 3]. I can get the X,Y,Z as values.

The following is the check Box group value in Xpage.,

<xp:checkBoxGroup id="checkBoxGroup1">
<xp:selectItem itemLabel="1" itemValue="X"></xp:selectItem>
<xp:selectItem itemLabel="2" itemValue="Y"></xp:selectItem>
<xp:selectItem itemLabel="3" itemValue="Z"></xp:selectItem>
</xp:checkBoxGroup>

But in backend HTML code is as follows...

<fieldset id="view:_id1:checkBoxGroup1" class="xspCheckBox"><table class="xspCheckBox">
<tr>
<td>
<label><input name="view:_id1:checkBoxGroup1" value="X" type="checkbox"> 1</input></label></td>
<td>
<label><input name="view:_id1:checkBoxGroup1" value="Y" type="checkbox"> 2</input></label></td>
<td>
<label><input name="view:_id1:checkBoxGroup1" value="Z" type="checkbox"> 3</input></label></td>
</tr>
</table></fieldset>

So I am not to get this via its children...

So i used parentNode for finding its label name.,

Try the following is used to get the values of checkBoxGroup's Key value...

var check= document.forms[0].elements["#{id:Column}"]
var label=null;
var value1=null;
alert("Test");
for(var i=0;i {

if(document.forms[0].elements["#{id:Column}"][i].checked)
{

label=label+","+((document.forms[0].elements["#{id:Column}"][i].parentNode.textContent))
value1=value1+","+(document.forms[0].elements["#{id:Column}"][i].value)
}
}

alert(label + "-- " +value1)

Dynamic View Panel in Xpage...

Here is an interesting stuff...

Like how can we generate a dynamic view in Xpages.,

I was tried to make the dynamic view panel since past two weeks...

I have seen and gone through the "http://www.jmackey.net/groupwareinc/johnblog/johnblog.nsf/…"

But the thing is here we can not get the value for null named column. And also this will work only within the scenario as column name and Programmatic Column name are equal.
And also they used composite Data for constructing view Panel.

Here I am getting the column values with the use of its column number.

But it is feasible to iterate a values of view column Entry.,

Here is an Example code., This will take your DB Name corresponding your current server...

Code:-

Code for Panel

getComponent("Panel1").getData()[0].setViewName(getComponent("view").getValue());
getComponent("Panel1").getData()[0].setDatabaseName(sessionScope.db);

How to use Jquery in xpage?

Jquery is very efficient for changing the visiblity and UI things...

It is very fast compare to our SSJS.,

Step 1:- Add the following url into Xpage -> resources -> Javascript Library...

"http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js"

Step 2:- Put the following code into your Xpage you wil find the nice animation and nice funtionality...

Thanks W3Schools

Code:-

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"><p></p>
<script type="text/javascript" src="jquery.js"></script><script type="text/javascript">
$(document).ready(function(){
$("#animate").click(function(){
<!-- $("div").fadeTo("slow",0.25); -->
<!-- $("div").fadeOut(4000); -->
<!-- $("#test").animate({left:"100px"},"slow");
$("#test").animate({fontSize:"3em"},"slow");
$("#test").animate({left:"100px"},"slow");
$("#test").animate({fontSize:"1.3em"},"slow"); -->

$("#hide1").animate({left:300},"slow");
$("#hide1").animate({right:300},"slow");
$("#hide1").animate({left:100},"slow");
$("#hide1").animate({right:100},"slow");
<!-- $(this).hide(); -->
});

$("#hide1").click(function(){
<!-- $("div").fadeTo("slow",0.25); -->
<!-- $("div").fadeOut(4000); -->

$("#test").html("W3Schools");
});

});
</script><xp:this.resources>
<xp:script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js" clientSide="true">



</xp:script>
</xp:this.resources><div id="test" style="background-color:yellow;height:100px;width:150px">
<xp:inputText id="inputText1" readonly="true">
<xp:this.value><![CDATA[#{javascript:"Hello "}]]></xp:this.value>
</xp:inputText>
</div>
<p id="animate">Click me to animate!</p>
<p id="hide1" style="position:absolute">Click me to hide!</p>


</xp:view>

HashMap in Xpages - CheckBox group many times will Issue.,

I got an Issue with checkBoxGroup in Xpage.,

I can add the value in checkBoxGroup and also I can retrive...

But the Label value I can not retrive...

I have used the following code for getting the keyvalue...

getcomponent("id").getAttributes().get("xxx")

getcomponent("id").getAttributes().values()

Each time I got failed...

Finally I got an idea to implement the HashMap with SSJS.,

In client side java script we can get the values very easily.,

But in server side Java script It is difficult.,

I am not teling It is Impossible. We can (Please tell If you can :) )

The following code will make some idea to use HashMap...

try
{
if((sessionScope.db !="" ))
{
var view12=getComponent("view").getValue();
var db=session.getDatabase(sessionScope.server,sessionScope.db)
var vw:NotesView=db.getView(view12);
var colName= vw.getColumnNames().toArray();
var count=0;
var listCount:java.util.HashMap=new java.util.HashMap();
if(listCount.isEmpty() == false)
{
listCount.clear()
}

while(colName.length>count)
{
listCount.put(count,colName[count]);
count++;
}
return listCount.keySet().toArray()
}
else
{
return ""
}
}
catch(e)
{
return "You did not choose any column"
}

View Panel Layout is well format as Notes

Scenario:

Goto Window ---> Controls ---> View

In this way, the view columns are created uniquely but some times the categorized columns will not come as same as Notes view (Only for Multi category view). Sometime we can not get the view as shown in below...

See below screen shot:[Below is well formed view]

Solution1:

Add the following server-side JavaScript to compute the column’s style property,
i.e. All Properties > Styling > Style > Compute value:
if (rowData.isCategory()) {
// This API tells us if a category column is indented
var indent = rowData.getColumnIndentLevel();
// Insert padding for each indent level
if (indent == null || indent == 0) {
return “padding-left:0px”;
} else {
return “padding-left:10px”;
} // continue if deeper category levels exist ...
};


Solution2:

Createing view by following is good for categorized views.
Goto Window ---> Controls ---> Data --> Create view.

How to pass the Document context in Xpages while calling an Agent?

var agent=database.getAgent("javaSwing");
document1.save();
agent.runWithDocumentContext(currentDocument.getDocument())

The above will call the agent and we can get the current document's item value in java agent context. Condition is, we should save the document before we pass the document.

If we use the following code is used to pass the current document, And also we can get the item value of the current document without saving it.

var agent=database.getAgent("javaSwing");
agent.runWithDocumentContext(currentDocument.getDocument(true))

Shortcut keys for Lotus Notes

The following URL should be helpful...

Shortcut keys...

Shortcut Key's List

Download Link for Xpage

Usually all of our document is having a reserve field as "$FILE". It won't be visible untill we add any attachments.

All of our attachments has been saved into this field only. It is Attached Object TYPE Reserve field.

If we want to give any download link to our application, Which is very simple...

Create a document. Attach the files whatever we want to share of our document.

The below url is used to download the files what we have attached...


http://host/dbpath/documentUNID/$FILE/FileNamewithextension

URL cheat for Lotus notes

The following site will be very useful for managing our link in Xpage or Client...

click here - URL CHEAT