I got a form, that includes outputPanel that I need to update, excluding one of its component (it containts calendar, that resets after I call update, I want to prevent that)
<p:ajax update=":form1:outputPanel1 :not(form1:outputPanel1:nestedOutputPanel)"/>
But I have no idea how can I achieve something like this (above example is not working)?
The PrimeFaces update attribute takes one or more expressions separated by a space (or comma). Normally (in plain JSF) those expressions are client IDs, but in PrimeFaces you can also use selectors. A selector is executed and results in a list of client IDs to update. You could use a selector to select all the components that need to be updated and exclude the component you don't want to update.
You could add a style class to the component you want to exclude and use something like:
update="#(.parent :not(.exclude))"
As you can read in the top answer on the linked question, the #(...) selector will be used as a jQuery selector. So you can easily test selectors in your browser's JavaScript console as $("...").
See also:
How do PrimeFaces Selectors as in update="#(.myClass)" work?
Related
I'm newest in web.
I want customize default scroll-bar in ag-grid. I try use ngx-scrollbar for this. In sources ngx-scrollbar I found that ngx-scrollbar using ng-content for wrapping elements(link to github source file). If wrap ag-grid-angular element then scrolling even doesn't shows because content doesn't overflow ag-grid-angular content because oveflow happen in div with class .ag-body-viewport where using stock srolls. In order to achieve needed effect I wish pass DOM element with class .ag-body-viewport to ng-content of ngx-scrollbar. Is it possible?
More info here github issue but I don't use Nice Scroll or Perfect Scrollbar
I want use ngx-scrollbar because it has capability of customization.
UPDATE
I can pass DOM element to ng-content using next sintax(agGridViewport is native element):
<ng-scrollbar>
{{ agGridViewport }}
<ng-scrollbar>
but it pass element like a copy of real DOM object but I want pass this like a refence.
Now I got UI like a stack style:
[rendered real ag-grid-angular]
[rendered ng-scrollbar with his content]
But it isn't that I need. Also I got bad rendering with artifacts and even some components doesn't appear. Now I want to try use Renderer2 for putting ng-scrollbar element between two DOM elements in tree(.ag-body-viewport-wrapper and .ag-body-viewport). But I think it's very bad idea because Renderer2 doesn't have methods for putting elements between DOM elements in tree and my code will be very unlify and complicated :( It's must be like injection.
No, I can not do injection in DOM with Angular tools. It's bad idea do it and it is not possible now. AgGrid doesn't support customization with tools like ngx-scrollbar which using ng-content for wrapping components and other elements. May be better way using other tools which working by another way or using webkit customization which supports not all web browsers.
UPDATE
Also I try to use smooth-scrollbar. I managed to get better result. I bind him to element .ag-body-viewport. It works fine but it scrolling only content of grid without header be careful. smooth-scroll bar doesn't have options for horizontal and vertical scrollbar as a different units. I know how issue can be solve. Vertical scrollbar must be bind to .ag-body-viewport and horizaontal scrollbar must be bind to .ag-root. If your can find scrollbar which let you do it that you can solve this problem. May be I write special component for Angular in near future and then add link to this answer. If you do it faster you can add yourself link or you can add link to already existing packages.
I'm using JSF2.1 with PrimeFaces 4.0 and surprisingly I'm unable to find a simple solution, how to disable a field if another field is already filled instead. E.g. if I enter a number in the "plus quantity" field and I leave the field by clicking or using tab, the "minus quantity" field should be disabled.
All I found is to do something like this
<p:inputText id="minusQty" disabled="#{not empty order.plusQty}"/>
<p:inputText id="plusQty" value="#{order.plusQty}">
<f:ajax update="minusQty" />
</p:inputText>
but I find it a bit heavy to call the server for such a simple task. I also don't want to add custom JS code. I guess there's a built-in way in JSF/PF but I cannot find it...
but I find it a bit heavy to call the server for such a simple task
Measure it instead of making assumptions.
I also don't want to add custom JS code
It boils down to just using the right tool for the job. The code which you've so far looks okay, apart from the <p:ajax> and <f:ajax> mixup (the <f:ajax> doesn't support update attribute). I'd only use <p:ajax partialSubmit="true"> to reduce request payload, especially if this is part of a relatively large form.
Might you eventually go in the JS direction, keep in mind that enabling/disabling a HTML DOM element in client side doesn't enable/disable the JSF component in server side. In other words, when you do so with pure JS, then hackers will still be able to submit the value anyway. Always keep this in mind when considering either client or server side for some tasks.
I have my website setup to use the KendoUI framework and I have pulled in some external internet code with forms. To make it look like Kendo i have set the following to make all my select's into a kendoDropDownList:
$("select").kendoDropDownList();
This works fine. However there is one particular select that I like to convert into a kendoComboBox.
Is there a way to replace or remove the kendoDropDownList from my element and put the kendoComboBox instead.
Thanks in advance
Karel
If you need to single out one select, then you'll need to use a more specific jQuery selector (an id, text, CSS class, containing div, etc.).
For example, if your select elements have id's, you could do something like:
$("select:not([id='myComboBox'])").kendoDropDownList();
$("select[id='myComboBox']").kendoComboBox();
Really, you just need to do something to separate that select from the rest of them.
If you are unfamiliar with jQuery selectors (or just need a refresher), you can find the full documentation here: http://api.jquery.com/category/selectors/
Here's an example fiddle of this working: http://jsfiddle.net/ATNkC/1/
A project was passed onto me a short while ago which uses JSP for the view and spring 3.1 for the controller - both of which I have little experience in and as per usual, there are about 4 comments in the whole thing. Anyway, my issue is this, in replacing a
<form:checkboxes path="class.list" items="${items}" delimiter="<br />" />
With
<c:forEach var="item" varStatus="vs" items="${items}">
<form:checkbox path="class.list" item="${item}" />
// check if nesting is required, if so create div and nested list point to class.list.children
</c:forEach>
Seems to create additional elements in my class.list which are not selected leading to a break further on.
Any guidance would be greatly appreciated.
I would suggest leaving the form:checkboxes intact as it is a compact way to generate checkboxes. I do not know of a compelling reason not to use the spring form tags if it is already in place and working. As to why you are seeing hidden fields. See here:
http://static.springsource.org/spring/docs/2.5.x/reference/view.html
Here is the relevant portion:
What you might not expect to see is the additional hidden field after each checkbox. When a checkbox in an HTML page is not checked, its value will not be sent to the server as part of the HTTP request parameters once the form is submitted, so we need a workaround for this quirk in HTML in order for Spring form data binding to work. The checkbox tag follows the existing Spring convention of including a hidden parameter prefixed by an underscore ("_") for each checkbox. By doing this, you are effectively telling Spring that “ the checkbox was visible in the form and I want my object to which the form data will be bound to reflect the state of the checkbox no matter what ”.
Hope this helps.
I'm looking into the fielderror tag for struts and was wondering if it was possible to conditionally show certain elements on the page based on whether or not there are any validation errors. I want to do something like this (which currently does not do what i want it to):
<s:fielderror>
This is a test link
<s:param>field1</s:param>
<s:param>field2</s:param>
<s:param>field2</s:param>
</s:fielderror>
I would like the anchor tag to show up ONLY if one of the fields referenced by the param tags is invalid. In other words, if something is invalid in this fielderror block, I would like to display some HTML. The way it is coded above, the anchor tag is always displayed.
I think I can certainly do this with jQuery, but i was wondering if there was a way to do this natively in Struts that perhaps I'm overlooking. I've tried looking at things like the label and title attribute, but nothing seems to be working.
thanks in advance!
~j
There's nothing out-of-the-box, at least not like the way you want it.
Personally, I find your construct quite counter-intuitive: it doesn't execute/render like it reads.
A few options: do it "manually", create a tag to do it, or do it outside of the view. All rely on using ValidationAware.getFieldErrors() to grab the map and do some minimal logic.
The manual approach would use <s:if> to check for the presence of fieldErrors['fieldName'] for each field. Wrapped up in a simplistic JSP-based custom tag would produce something like:
<if:fieldErrors for='field1, field2, field3'>
<a ...>
</if:fieldErrors>
IMO doing most of the work in Java is cleaner, and easier to test. This could mean doing all the work in the action (or utility) and exposing only a single flag to the view, or using a thin JSP-based tag to call the utility. Either way, it's easier to test outside of a container, and removes inappropriate view logic.