FORUM PLAN UPDATE
Date revision: This forum will remain open to new posts and responses until December 1, 2018. (After that date, you will still be able to view and search the forum.) Also, we're taking a second look at the best place to host future conversation. For now, keep using this forum, and stay tuned for more news.



May 5, 2016, 5:43 AM
93 Posts
topic has been resolvedResolved

Modal Buttons

  • Category: Other
  • Platform: All
  • Release: 9.0.1
  • Role: Developer
  • Tags: modal,bootstrap,sessionscope
  • Replies: 12

Hi guys,

I have a repeat controller, and clicking on a button opens up a dialog, and should show the correct document (combination of bootstrap).

Im setting a session scope variable on the click to set the doc ID, then the custom control within the modal has the documentID set to the session scope variable, however it doesnt seem to be working.

I think its because the modal is opening before the session scope variable is set.... Any ideas? Code below, thanks

 

                                <xp:button value="Open File" id="button6"
                            styleClass="btn btn-info btn-block btn-tall">
                            <xp:this.attrs>
                                
                                <xp:attr name="data-toggle"
                                    value="modal">
                                </xp:attr>
                                <xp:attr name="data-target"
                                    value="#Modal2">
                                </xp:attr>
                            </xp:this.attrs>
                            <xp:eventHandler event="onclick"
                                submit="true" refreshMode="partial"
                                refreshId="ccModalFileDetails">
                                <xp:this.action><![CDATA[#{javascript:sessionScope.uploadedFileID = rowData.getUniversalID();
print ("HELLO: " + sessionScope.uploadedFileID)}]]></xp:this.action>
                            </xp:eventHandler></xp:button>

May 5, 2016, 8:57 AM
589 Posts
hmmm

I would expect it to work..  I would use viewScope rather then session here since this is specific to the page.

Often in cases like this you need to set ignoreRequestParams to false for the data source that's feeding the model.  Anytime you have more then one dataSource on a page you likely need to set that.  That's a common issue so suggest you try that first.

 

Dave

 

May 5, 2016, 9:39 AM
93 Posts
Parmas

Hi David,

 

I've set ignorerequestparams to false, for either 1, or both dataSources as per a suggestion by Paul W, however it makes no difference.

 

I have however just noticed that the document it brings up in the modal, is actually the parent doc.

 

I have the parent doc displayed on the left of the screen, then a repeat control of children on the right of the screen. Instead of showing the child, its picking up the parent somehow.....

 

Good shout on the viewScope, I've updated where required

 

I have the same question on stack overflow if you would prefer to follow from there, thanks:

 

http://stackoverflow.com/questions/37050189/xpage-modal-dialog-and-sessionscopes?noredirect=1#comment61648027_37050189

May 5, 2016, 9:48 AM
589 Posts
hmmm

I love StackOverFlow but unless you know the exact answer it get's a little dicey over there.  they really don't encourage "troubleshooting".

Suggestions.

- instead of doing the partial refresh do a full refresh.   What is "ccModalFileDetails"? Does that custom control even contain the dataSource?  or is this second dataSource on the XPage itself.  If it's on the XPage then you might not actually be refreshing it.  Try a full refresh for sure for grins...

- i would eliminate the modal and also the custom control for now.  Get it working inside a panel they way you want and then start to add in 1 at a time the custom control and modal.  Get a simple version working first and then fancy it up.

Try that and let me know.  If it doesn't work then we'll move to defcon 1.  :)

 

Dave

 

 

May 5, 2016, 10:09 AM
93 Posts
Defcon 1 time!

No luck David,

 

I know have 2 datasources on the form, parent and child. The child still shows a value from the parent (They share a field name)

Datasource code:

<xp:this.data>
        <xp:dominoDocument var="document1" action="openDocument"
            formName="frmApplicantDetails" />
        <xp:dominoDocument var="document2" formName="frmUploadedFile"
            action="openDocument" ignoreRequestParams="false">
            
            <xp:this.documentId><![CDATA[#{javascript:print ("HERE:" + viewScope.uploadedFileID);
viewScope.uploadedFileID}]]></xp:this.documentId>
        </xp:dominoDocument>

    </xp:this.data>

 

Code dumped into a panel on the main page:

 

<xp:panel id="pnlModalRefresh">
                        
                                        
                                        <div class="row">
        <div class="col-lg-12">


            <!-- MODAL DETAILS -->
            <div class="row">
                <div class="col-lg-12">

                    <div class="form-group">
                        <label for="edtParentID">Parent ID:</label>
                        <xp:inputText id="edtParentID"
                            value="#{document2.DocParentID}">
                            <xp:this.attrs>
                                <xp:attr name="placeholder"
                                    value="ParentID" />

                            </xp:this.attrs>
                        </xp:inputText>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">

                    <div class="form-group">
                        <label for="edtFileType">File Type:</label>
                        <xp:inputText id="edtFileType" value="#{document2.FileType}">
                            <xp:this.attrs>
                                <xp:attr name="placeholder"
                                    value="File Type" />

                            </xp:this.attrs>
                        </xp:inputText>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="form-group">
                        <label for="edtRef">Reference:</label>
                        <xp:inputText id="edtRef" value="#{document2.Ref}">
                            <xp:this.attrs>
                                <xp:attr name="placeholder"
                                    value="Reference" />

                            </xp:this.attrs>
                        </xp:inputText>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="form-group">
                        <label for="edtStatus">Status:</label>
                        <xp:inputText id="edtStatus" value="#{document2.Status}">
                            <xp:this.attrs>
                                <xp:attr name="placeholder"
                                    value="Status" />

                            </xp:this.attrs>
                        </xp:inputText>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="form-group">
                        <label for="edtComments">Comments:</label>
                        <xp:inputText id="edtComments" value="#{document2.Comments}">
                            <xp:this.attrs>
                                <xp:attr name="placeholder"
                                    value="Comments" />

                            </xp:this.attrs>
                        </xp:inputText>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="form-group">
                        <label for="dtExpDate">Exp Date:</label>
                        <xp:inputText id="dtExpDate" value="#{document2.ExpDate}">
                            <xp:this.attrs>
                                <xp:attr name="placeholder"
                                    value="Exp Date" />

                            </xp:this.attrs>

                            
                        <xp:this.converter><xp:convertDateTime type="date" dateStyle="short"></xp:convertDateTime></xp:this.converter></xp:inputText>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">


                    <xp:fileUpload id="fileUpload3" />


                </div>
            </div>

        </div>

    </div>
 

</xp:panel>

 

Button Code:

 

<xp:button value="View" id="button6"
                                    styleClass="btn btn-default btn-block btn-xs">
                                    
                                    <xp:eventHandler event="onclick"
                                        submit="true" refreshMode="complete">
                                        <xp:this.action><![CDATA[#{javascript:viewScope.uploadedFileID = rowData.getUniversalID();
print ("HELLO: " + viewScope.uploadedFileID)}]]></xp:this.action>
                                    </xp:eventHandler>
                                </xp:button>

May 5, 2016, 10:21 AM
589 Posts
doh!

Well first - I'm an idiot...  but anyone whose ever seen the podcast knows that.  haha

ignoreRequestParams should be true and NOT false.

What that does is it tells your dataSource to NOT look at the URL for information on the binding.  So you definately do want that second dataSource to ignore the url parameters.

Give that a try.

Sorry about that.

May 5, 2016, 10:40 AM
93 Posts
Grrrrr

Hi David,

 

I was sure I had set that to true previously and it still didnt work!

 

I've just tried again and voila, its all good!

 

It may not have worked originally as I was doing something weird with the modal datasource - Where as for this test everything is on one page as you suggested.

 

Next step is to get it all back into a modal and see if I get the same result.

 

Thanks again for your help, I'll confirm soon how I get on with calling things via the modal

May 5, 2016, 10:46 AM
589 Posts
hmmm

This is a different problem then..  

 

Try doing a modal without a dataSource..  just text.. see if the modal works at all.

How are you doing the modal anyway?  Ext. Library dialog?  something else?

 

 

May 5, 2016, 10:49 AM
93 Posts
No Modal

I remember why I thought it was not working now David...

 

Using both a full refresh and a partial refresh on the panel containing the custom control with the datasource on it doesnt work...

 

The screen darkens, just as it does whenever a modal pops up, however the modal never displays.....

May 5, 2016, 10:50 AM
589 Posts
cool

Yeah - you have a bunch of moving parts here....

2 data sources...  partial refresh...  custo control, modal etc...  

 

I find it's always best , especially when you get into trouble, is to just get something working on an XPage as bare bones as possible and then built out from there.

I think I have done a video or two on this kind of technique (without a modal) at NotesIn9.com / XPages.TV - sorry but I don't know which one.  

Dave

May 5, 2016, 10:52 AM
589 Posts
also

Chris, 

You might want to consider joining the XPages Slack chat.

It's not a replacement for StackOverFlow or even this forum but a bunch of like minded XPages developers hang out there.  :)

 

xpages-slack.herokuapp.com

May 5, 2016, 10:54 AM
93 Posts
Idiot

Im an idiot!

 

I had the modal contents all within the panel I was doing a partial refresh on, so it was loading the modal for a split second, the refreshing it, causing it to disappear!

 

All sorted!

May 5, 2016, 11:27 AM
93 Posts
Slack

Interesting, cheers David, I'll sign up


FORUM PLAN UPDATE
Date revision: This forum will remain open to new posts and responses until December 1, 2018. (After that date, you will still be able to view and search the forum.) Also, we're taking a second look at the best place to host future conversation. For now, keep using this forum, and stay tuned for more news.