Open document in new tab

[R.J]

We have a lotus web application, In which we have form which has hotspot button. Now we want to create and open a child form of this parent form in a new tab. If we use @command([compose];"formname");, from action tab, it works fine, but using hotspot button it opens the child form on the same tab replacing the existing form.

Can anyone help us with the code and suggestion to open the new from in new tab through hotspot ?.

[Zakaroonikov]

We have a lotus web application, In which we have form which has hotspot button. Now we want to create and open a child form of this parent form in a new tab. If we use @command([compose];"formname");, from action tab, it works fine, but using hotspot button it opens the child form on the same tab replacing the existing form.

Can anyone help us with the code and suggestion to open the new from in new tab through hotspot ?.

Try

@SetTargetFrame( "_blank" );

before your call to the compose statement

[R.J]

Dear Zakaroonikov,

Thanks for your help. I tried @Do(@SetTargetFrame( "_blank" );@Command([Compose];"formname")) and it does open the document in new window but not in a new tab. How to open the document in new tab using hotspot button.

Any Hints ?

Thanks In Advance.

[Zakaroonikov]

Dear Zakaroonikov,

Thanks for your help. I tried @Do(@SetTargetFrame( "_blank" );@Command([Compose];"formname")) and it does open the document in new window but not in a new tab. How to open the document in new tab using hotspot button.

Any Hints ?

Thanks In Advance.

Ah I was thinking browser tabs. Have a look at the demo database. The form "CategoryTest1" has some actions that do exactly what you are after.

[R.J]

Unfortunately we have used hotspot instead of Action bar because of which the documents are not opening in new tab. Could you guide us how to open the document in new tab from an action bar.

Please find the screenshot for more reference.

Thanks In Advance. :)

[Zakaroonikov]

Unfortunately we have used hotspot instead of Action bar because of which the documents are not opening in new tab. Could you guide us how to open the document in new tab from an action bar.

Please find the screenshot for more reference.

Thanks In Advance. :)

Perhaps you need to get the hot spot by giving it an HTML ID lets say we give it 'myHotspot' then you could do something like this in the JSHeader:



uidoc.on('open', function(uidoc) {
// other code goes here
var hotSpot = Ext.get('myHotspot');
hotSpot.on('click', function () {
this.openForm("myFormHere");
}, uidoc, {stopEvent : true});
}, this);


So all we are doing in overriding the hotspot with an event handler.

[R.J]

Dear Zakaroonikov,

Thanks for the help,=D>

Following is the code which I have written on "onclick" event of Hotspot.


Ext.onReady(function() {
uidoc.on('open', function(uidoc) {

// other code goes here

var hotSpot = Ext.get('createnewversion');

hotSpot.on('click', function () {

this.openForm("formname");

}, uidoc, {stopEvent : true});

}, this);

});


and I am getting error uidoc is undefined. please guide me where am I getting wrong and provide the necessary code if possible.

Thanks In Advance.:)

[Zakaroonikov]

Did you keep the original definition of the uidoc in the code? That is what I meant by // other code goes here. Try this:





Ext.onReady(function() {
var uidoc = new Ext.nd.UIDocument({
bodyStyle : 'padding:10px',
layout : 'fit',
autoScroll : true
});
uidoc.render();

uidoc.on('open', function(uidoc) {
// other code goes here
var hotSpot = Ext.get('createnewversion');
hotSpot.on('click', function () {
this.openForm("formname");
}, this, {stopEvent : true});
}, this);
});

[R.J]

Dear Zakaroonikov,

Sorry but I am new to this uidoc and definitions related to it. Could you please guide what am I supposed to write in // other code goes here.

Also I tried the code provided by you and found that I received Object Expected error, I guess it is due to the missing code in the area // other code goes here.

Please help.

Thanks In Advance.:)

[Zakaroonikov]

My mistake looks like openForm is a method of the ext.nd.actionbar class not the ext.nd.uidocument class. Instead you could try the following:




Ext.onReady(function() {

var uidoc = new Ext.nd.UIDocument({
autoScroll : true,
standardSubmit : true // default is false
});
uidoc.render();

/*
* If you want to access and do things with the form fields you must write your code
* after the 'open' event has fired. The 'open' event is equivalent to the
* NotesUIDocument PostOpen/OnLoad events
*
* TODO: Ext.Msg.alert does not work due to our own 'loading' message. Need to fix.
*/
uidoc.on('open', function(uidoc) {
var hotSpot = Ext.get('createnewversion');
hotSpot.on('click', function () {
var link = this.dbPath + 'MYFORMNAMEGOESHERE' + '?OpenForm';
var target = this.getTarget();
if (!target) {
location.href = link;
}
else {
Ext.nd.util.addIFrame({
target: target,
uiView: this.getUIView(),
uiDocument: this.getUIDocument(),
url: link,
id: Ext.id()
});
}
}, uidoc, {stopEvent : true});
}, this);

});


The code above is ugly I agree but I have tested it on a form I created with a single html tag in pass-through HMTL:



<input type="button" href="#" id="createnewversion" value="Create Another form"/>


The 'other code here' business was there to place any other code that already existed in the 'open' event handler.

[R.J]

Dear Zakaroonikov,

Unfortunately I am still getting the error "Object expected" :( could you please attach the ntf file if possible so that I can check how you have performed the task ?.

Thanks In Advance.:(

[jratcliff]

Zakaroonikov just about had it right. In a later version of Ext.nd we plan on implementing a 'composeDocument' method of UIWorkSpace but in the meantime, use Zakaroonikov's code with the only change of getting a handle to the uidoc's toolbar first and then calling the 'openForm' method from the toolbar.




Ext.onReady(function() {
var uidoc = new Ext.nd.UIDocument({
bodyStyle : 'padding:10px',
layout : 'fit',
autoScroll : true
});
uidoc.render();

uidoc.on('open', function(uidoc) {
// other code goes here
var hotSpot = Ext.get('createnewversion');
hotSpot.on('click', function () {

// if the uidoc is using a toolbar you can just get a reference to that one
var tb = uidoc.getTopToolbar();

// otherwise, you can create a new instance of a toolbar
//var tb = new Ext.nd.Actionbar({noteType : 'form', noteName: 'yourForm'});

// now call the 'openForm' method of tb
tb.openForm("formname");

}, this, {stopEvent : true});
}, this);
});


Also, if the form you need to compose is set as a response doc or a form that inherits from the selected/active doc you can pass in a config object to 'openForm' instead of just the string of the form name and set the isResponse property to true. This will then compose a form and automatically adds the parentUNID=UNID url arg to the ?OpenForm call.



tb.openForm({formName : 'formname', isResponse : true})

[R.J]

Am i supposed to write the code provided by you in the onclick event of the hotspot button ?I have written the code in onClick event,because of which the form gets refreshed and as I have not used to Ext.nd form layout it spoils my entire CSS applied on the form. How can I override this refresh activity, because I get error on Js header and Onload event of form, I cannot use the provided code in those areas.

Can you help me with the ntf in which this code is implemented. I am using extnd 3x.

Thanks In Advance.

[jratcliff]

Am i supposed to write the code provided by you in the onclick event of the hotspot button ?I have written the code in onClick event,because of which the form gets refreshed and as I have not used to Ext.nd form layout it spoils my entire CSS applied on the form. How can I override this refresh activity, because I get error on Js header and Onload event of form, I cannot use the provided code in those areas.

Can you help me with the ntf in which this code is implemented. I am using extnd 3x.

Thanks In Advance.

Ahh, well if you are not using Ext.nd.UIDocument then you can write the code in the onClick event of the hotpot. The code would look something like this:



var tb = new Ext.nd.Actionbar({
noteType : 'form',
noteName: 'CategoryTest1'
});
tb.openForm({
formName : 'Response',
isResponse : true
});


You need the Ext.nd.Actionbar so you can use the 'openForm' method. In a later release we plan on adding a 'composeDocument' to Ext.nd.UIWorkspace so for now, you can just do this.

[R.J]

Dear jratcliff,

That code does work to open a new tab with the form name, but what is the attribute to open a url in the new tab ?. As my database inherits the code generated in the database with title Ext.nd Beta 3 also all the .js files are inherited in x.nsf database from extnd_b2.nsf database, when i use :

var tb = new Ext.nd.Actionbar({
noteType : 'form',
noteName: this.formName
});
tb.openForm({
formName : 'formname',
isResponse : true
});
The above code appends the formname and a new tab is created with path http://servername/extnd_b3.nsf/formname?OpenForm whereas it should be http://servername/x.nsf/formname?OpenForm.

Can you help me with the workaround of this functionality so that it accesses the path of current database and not the path of database from where the .js are inherited from ?

Thanks In Advance. :-?

[jratcliff]

the config object for the 'openForm' method also accepts a property called 'dbPath'. If not set it just defaults to the one set in the Ext.nd.Actionbar (which, if not set, determines the path from the url to the current form/view).

So, you can do this:



tb.openForm({
formName : 'formname',
isResponse : true,
dbPath : '/x.nsf/'
});


~Jack

[R.J]

Dear jratcliff,

Thanks for the help....I tried your code but it appends the dbpath and formname with the existing path somewhat similar to this ... http://servername/X.nsf/X.nsfformname?openform and shows error that X.nsfformname doesnt exists.

I modified your code and the following code has helped me to open the document in new tab

Ext.onReady(function() {
var tb = new Ext.nd.Actionbar({
noteType : 'form',
noteName: 'CategoryTest1'
});
tb.openForm({
formName : '',
isResponse : true,
dbPath : 'formname'
});
});
but how do I make the new document child of the current document in which this hotspot is clicked. I tried to detect whether the document is child using,


if(window.opener != null )
{
alert(window.opener.document.forms[0].Title.value )
}

but it shows js error of window.opener.

Also how to pass field values from the current form to the new form opened in the tab ?. I tried doing it through URL but was not successful.

Could you please guide me how to relate the new document as child of the existing document.:-/

Thanks In Advance.

[jratcliff]

Sorry, dbPath needs to be a "absolute path" and therefore you need the forward slashes. Ext.nd does this for you automatically by setting dbPath to Ext.nd.Session.currentDatabase.webFilePath. But if you need to set it yourself then make sure to include the full path with the beginning forward slash and the ending forward slash.

So if you database is named x.nsf and is in the data directory, your dbPath would be:

dbPath : '/x.nsf/'

And if your database was in some sub-directory, your dbPath would be:

dbPath : '/someSubDirectory/x.nsf/'

Jack

[R.J]

Thanks Jack.

I will try the solution provided by you...and c if it works. Could you please tell me how to pass values from the current form to the new form opened in the new tab ?.

Thanks In Advance.
R.J

[jratcliff]

Could you please tell me how to pass values from the current form to the new form opened in the new tab ?

Well, by using the 'openForm' method and setting the 'isResponse' property to true, Ext.nd will send a url command to the server in this format:



http://server/db/form?OpenForm&parentUNID=someunid


All computed values and default values on the form will then get their data from the parent document that has a unid = someunid as long as the form has the property "Formulas inherit values from selected document" turned on.

[R.J]

Hey Jack,

That logic of keeping the default value of the child document field as parent document field name could have solved my problem if it would have been a action bar button.. but it is not working on hotspot. :(

[jratcliff]

Hey Jack,

That logic of keeping the default value of the child document field as parent document field name could have solved my problem if it would have been a action bar button.. but it is not working on hotspot. :(

Not sure I understand what you mean by this. In my tests, an action bar button AND a hotspot using the code I posted both create a new document AND inherit values from the current document. Is that not what you want?

[R.J]

Hi Jack,

Yes that is exactly what I want, it works for me when the action button is on view but doesn't inherit field values from parent doc. through action button/hotspot of form. Could you please forward me the ntf so that I can look into your code and understand how to use it?. Am I missing any js file to be included in html head content of the form to make it work ??.

Also I would like to add that the same form is opened as a child document, and we need to pass the value. The relation here is not of parent child and the child document is not of form type "Response".

Please help!!!

Thanks & Regards,
RJ:-?