PrimeFaces Schedule not showing all times with some SlotDuration configuration - primefaces

When using the default slotDuration of PrimeFaces Schedule, or "00:15:00" for an example, the component don't show all times. If I change it to some values like "00:45:00" or even "00:15:01", the schedule show all times correctly.
Inspecting the HTML/CSS, in the cases of not showing the time, the <td> tag don't have a <span> tag inside with the time, and has the CSS class "fc-minor"
I couldn't find in documentation about this problem. I already tested with the deprecated slotMinutes, but it has the same behaviour.
Schedule with blank spaces between times:
https://imgur.com/a/TOCey4R
Schedule code:
<p:schedule id="agendaOcupacional" allDaySlot="false" timeFormat="HH:mm" axisFormat="HH:mm"
draggable="false" resizable="false" slotDuration="00:15:00" timeZone="GMT-3"
displayEventEnd="true" value="#{agendamentoBean.lazyEventModel}" locale="br"/>
I'm using Primefaces 6.1.
Thanks.

It appears PF is missing the value for slotLabelInterval which fixes this issue.
I created this GitHub issue: https://github.com/primefaces/primefaces/issues/4896
Submitted this PR: https://github.com/primefaces/primefaces/pull/4897
Hopefully it will be fixed in PrimeFaces 7.1.
For now you can use the Extender to configure it: https://primefaces.github.io/primefaces/7_0/#/components/schedule?id=extender-method

Related

Dynamically adding/removing TabViewItem in NativeScript tabs project

I have a NativeScript 8.1 JavaScript project that uses the tabs template, so that the app-root.xml file looks like this:
<TabView tabTextFontSize="16" androidOffscreenTabLimit="0" androidTabsPosition="bottom"
id="tabview" class="ns-light" loaded="onLoaded" >
<TabViewItem title="Riders" iconSource="res://biking_solid" >
<Frame id="main" defaultPage="views/main-page" />
</TabViewItem>
<TabViewItem title="Volunteers" iconSource="res://hands_helping_solid" >
<Frame id="vol" defaultPage="views/volunteers-page" />
</TabViewItem>
<TabViewItem title="Director" iconSource="res://user_ninja_solid" >
<Frame id="director" defaultPage="views/director-page" />
</TabViewItem>
</TabView>
The catch here is that the third tab needs to be conditional and only visible if the user is authorized. I've tried pop'ing the TabView's item's array. I've tried creating a new TabViewItem and pushing it onto the items array. I've tried using the visibility property, and none of these work.
I'll know at startup time whether the third tab should be displayed, so handling this in app-root.js is fine. I'm OK with creating all of the tabs dynamically but I can't get that to work either. I could live with disabling the third tab but the enabled property on TabViewItem is ignored.
In short, I've tried everything I can think of and I'm unable to change the TabViewItem's in any way. I realize the underlying implementations are likely imposing some restrictions, but still, is there any way I can control whether the third tab is visible?
This doesn't really answer the question, but it does solve my problem. I can have two separate app-root files, say app-root2 and app-root3, then in app.js I can apply logic and start the appropriate one:
if (<condition>)
application.run({ moduleName: "app-root2" });
else
application.run({ moduleName: "app-root3" });
Edit 4/10/2022: I ended up switching to the BottomNavigation component and dealt with the same issue. That, and the accompanying solution, is described in this post.

PrimeFaces 7.0 <p:textEditor HTML-sanitizer discards text formatting, such as centering

In PrimeFaces 8, it seems to be possible to enable / disable HMTML -sanitizer when using the <p:textEditor component by just specifying secure='false' for disabling it and secure='true' for enabling it. I tried to disable it in PrimeFaces 7.0 like this:
<p:textEditor id="quillToolbarId" secure='false' widgetVar="editor2" height="300" value="#{editTemplatesBean.kaufAnbotTemplate}" placeholder="Enter your content">
but the sanitizer still seems to be working.
My problem is that whenever I format a text in the primeFaces p:textEditor to be center-aligned, the HTML sanitizer just removes my formatting, so the text ends up without formatting.
One way to work this around is to use directly Quill and not Sanitize the input.This works, but then I face other problems, such as this one:
https://github.com/quilljs/quill/issues/1379
which also need to be worked-around.
Please help!
There is no secure property in TextEditor for PrimeFaces 7. If you look at the code of TextEditorRenderer.decode you will see that the sanitzier is called
if (PrimeApplicationContext.getCurrentInstance(context).getEnvironment().isHtmlSanitizerAvailable()) {
value = HtmlSanitizer.sanitizeHtml(value,
editor.isAllowBlocks(), editor.isAllowFormatting(),
editor.isAllowLinks(), editor.isAllowStyles(), editor.isAllowImages());
}
And if you look into PrimeEnvironment you'll see that the property will be set if the class org.owasp.html.PolicyFactory is available on classpath:
htmlSanitizerAvailable = LangUtils.tryToLoadClassForName("org.owasp.html.PolicyFactory") != null
So you either:
update to PF 8
make sure that you don't have this class on the classpath
override the renderer and change/remove the code for the check

angular 5 select IE no value

I am currently having an issue with Angular.X (Tested with A5 & A6). It appears when using a "Select" within the html, Internet Explorer doesn't bind appropriately with ngModel. I've tested with Chrome and Edge and they work fine, When trying to use this combination in edge- the select never gets set as its default value (The value that is assigned within the model/property its bound to). So the page will load with empty values in the select. I've tried searching but have not had any luck finding an answer how to fix this. 9/10 of the posts I find when searching for this are related to AngularJS. Which always makes troubleshooting fun!
Here is a bit of the code as to how I am doing this:
HTML:
// The repeater is up top somewhere and looks like this:
// <tr *ngFor="let i of this.imgArr">
<td class="ImageCell">
<select [disabled]="this.ApplyingChanges" [(ngModel)]="i.ImageType" class="form-control" (change)="this.ChangeInput(i)">
<option>Part</option>
<option>Model</option>
</select>
</td>
TS Class:
export class PartImage{
public ImageType = 'Part';
The above code is broken up to show what matters.
Thanks for the help in advance!
Sorry I actually resolved this.
After tinkering around, I discovered: With Edge and Chrome, an "option" is not required to have the attribute "value" and uses the label by default. With Internet Explorer this is not true and requires that attribute (Or ngValue) to work correctly.

Primefaces - Dialog Framework - p:confirm not opening

Primefaces (5.2, Mojarra 2.2.13) inside Dialog Framework is not opening a <p:confirm>-MessageBox.
I have delete icons in a datatable as a <p:commandLink> per row inside a Dialog.
I want to have a user confirmation to delete every row.
Following code works as expected in a <p:dialog> but not using Dialog Framework. Dialog Framework blocks the click on the delete icon or in other words: shows the confirm box invisible and answers NO.
<p:dataTable id="idTblMfc" value="#{bnMfcs.rows}" var="ORow" editable="true" ...>
... Columns ...
<p:column>
<p:commandLink styleClass="ui-icon ui-icon-trash" title="#{msg.TXT_DELETE}" actionListener="#{bnMfcs.doDelete(ORow)}" update="idTblMfc">
<p:confirm header="#{msg.TXT_DELETE}" message="#{msg.PRM_DEL_CONT_MARKED}" icon="ui-icon-alert" />
</p:commandLink>
</p:column>
I tried the same with <p:confirmDialog> instead of <p:confirm> with the same result. OK, I found the tiny difference that <p:confirmDialog> doesn't block the delete icon click but also does not appear.
The rest of the dialog and the datatable works as expected even with message boxen shown with showMessageInDialog(...).
Any ideas?
As you can see in the showcase (http://www.primefaces.org/showcase/ui/overlay/confirmDialog.xhtml), you need both p:confirm (where you need confirmation) and p:confirmDialog (which defines how the dialog looks like).
Also make sure that you are in a h:form tag.
Solution found!
The documentation makes not clear that <p:confirmDialog> is mandatory. I had one on my main page and the page using Dialog Framework had not.

primefaces selectManycheck box columns attribute is not working

I am using Primefaces 3.5, as shown in showcase, i am trying to use p:selectManyCheckBox.
<p:selectManyCheckbox layout="grid"
columns="2"
value="#{bean.selectedList}">
<f:selectItems itemLabel="#{bean.value}"
itemValue="#{overrides}"
value="#{bean.overrideValues}"
var="overrides>
</p:selectManyCheckbox>
But columns attribute is not working, is there any way to get column wise disply ?
I had the same problem and I fixed by changing the version of the prime face.
I had 3.2 and changed to 4.0.
For this particular component it seams that it whose added in the last 2 moth.
Requested here and a specific task here.
Is the second time when I also had this kind of problem. I am looking on the prime face showcase website for a specific component and and when I tried that component it didn't work with my version.