I'm using the latest ionic and have a simple select tag.
<select class="assertive bold" ng-change="changeQuantity({cartItem: part})" ng-model="part.quantity" ng-options="n for n in [] | range:1:101"></select>
When I run the code with ionic emulate ios
Why is there no done button for the select? Shouldn't that be default? How do I fix this to display a done button?
Although this is a late answer, I'm sure more people will end up here while searching for a solution to this issue.
By default in your app.js in .run() the hideKeyboardAccessoryBar is set to true, so just find
if (window.cordova && window.cordova.plugins.Keyboard) {
window.cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
and change it to
if (window.cordova && window.cordova.plugins.Keyboard) {
window.cordova.plugins.Keyboard.hideKeyboardAccessoryBar(false);
}
What worked for me is doing:
if (Keyboard) {
Keyboard.hideFormAccessoryBar(false);
Keyboard.hideKeyboardAccessoryBar(false);
}
The new plugin was exposed as global Keyboard, rather than cordova.plugins.Keyboard, and then the hideFormAccessoryBar is for form elements, rather than just for keyboard typing.
I have fought this issue for over four hours. The recommended answer, hideKeyboardAccessoryBar(false) failed repeatedly, with every possible combination of cordova.Keyboard, windows.Keyboard, $window.cordova.Keyboard, yes, inside deviceready, etc. etc. Resolved all conflicts between this and the older plugin.
No joy.
Solution: REMOVE THIS PLUGIN. Guess what. You get your Done button back. Run the following command:
ionic cordova plugin remove cordova-plugin-ionic-keyboard
Solution: Remove this plugin!
sudo cordova plugin remove ionic-plugin-keyboard.
This is what worked for me since I needed the accessory bar only in one instance, the accepted answer is old, and I am using cordova-plugin-keyboard instead. I used it with an onOpen handler.
if (window.Keyboard) {
window.Keyboard.hideFormAccessoryBar(false);
}
I solved when put this line on config.xml:
<preference name="HideKeyboardFormAccessoryBar" value="false" />
Related
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.
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
I'm using JavaEE with Maven and Primefaces and i want to hide (HTML hidden) a menuitem in Primfaces tabMenu.
Something like the answer in this (prior) question would be good:
.ui-tabmenuitem: {
visibility: hidden !important;
}
Just another small hint:
Adding a style class doesn't work, adding a containerStyle is not supported: See primefaces github page
Your code works for hiding them if I remove the invalid ":"
.ui-tabmenuitem {
visibility: hidden !important;
}
Tested on PF 6.0 and 5.3.
If you want to do it dynamically you can conditionally add a styleClass to the relevant menuitem's;
<p:menuitem styleClass="#{bean.something ? 'ui-tabmenuitem-hidden' : ''}" value="Social">
and hide it with some script:
<script>
$('.ui-tabmenuitem-hidden').parent().css('visibility', 'hidden'); // or toggle()
</script>
Getting the parent is not possible with pure css, that's why the script is needed (as far as I can see..). Use the inspector i Firebug or similar to figure out what's needed.
Either just put the script in the page for running at load time, or put it in an onclick-listener on a button (or somewhere else).
Hi I am trying to access the DIV element using watir but I am unable to do that,I have tried in different ways but couldn't access it,may be I think it need to be access through some parent element can anyone help me out?
My system Configurations
IE-8
Windows 7
I tried with the below command
#ie.div(:text,'COMPOSE').click
the command gets execute with no errors but no action is performed on the UI
The best solution appears to be switching to Watir-Webdriver. With Watir-Webdriver, #ie.div(:text,'COMPOSE').click will work as expected.
Assuming that is not an option, there are a couple of reasons why that same command does not work with Watir(-Classic) v1.6.7:
The first problem is that #ie.div(:text,'COMPOSE').click will find the first div that contains this text. This would be one of the ancestors of the div you want. As a result, Watir will send the click event against the wrong element.
The second problem is that the div is not responding to the onclick event fired by Watir. I am not sure why this problem exists.
To solve the first problem, you will need to be more specific when locating the div. In this case, the "role" attribute can be used since none of the ancestor elements have this attribute. Watir-Classic does not support using the role attribute as a locator. As a result, you will need to create a custom locator using an element collection and the find method:
#ie.divs.find{ |div| div.attribute_value('role') == 'button' && div.text == 'COMPOSE' }
To solve the second problem, it turns out that double clicking does work. While newer versions of Watir-Classic have a double_click method implemented, it does not exist in 1.6.7. You can replicate the method by calling the fire_event method:
.fire_event('ondblclick')
Putting it all together, the following will click the compose button:
#ie.divs.find{ |div| div.attribute_value('role') == 'button' && div.text == 'COMPOSE' }.fire_event('ondblclick')
There may be more than one element on the page with the text 'COMPOSE', some may be hidden. Try:
#ie.divs(:text,'COMPOSE').size
That is divs with an s.
Then you can try something like the following and see if you get a change in the UI:
#ie.divs(:text,'COMPOSE').each { |b| b.fire_event('click') }
I remember that fire_event works better, but would recommend consulting the docs for the difference between .click and fire_event.
I have a custom directive that I use to manage user access through my website. I use this to add a 'disabled="disabled"' attribute to html tags.
However, when I try to use this with tag-input, it doesn't work. I'm guess this is down to that fact that ngTagsInput uses it's own directive for tags-input.
I have read the documentation and cannot find a solution to what I am looking for.
Here is my code:
Html:
<div access-level="Admin">
<tags-input ng-model="tags" on-tag-added="addNewTag($tag)" on-tag-removed="removeTag($tag)">
<auto-complete source="loadTags($query)" min-length="0"></auto-complete>
</tags-input>
</div>
Is there any work around for this?
Thanks.
It's currently unsupported, but looks like will be in the next major version (2.3.0):
https://github.com/mbenford/ngTagsInput/issues/102
Edit:
2.3.0 is out; see following link for details https://github.com/mbenford/ngTagsInput/blob/master/CHANGELOG.md#features
I could not find this option in the release 2.3.0, but at least they have enabled the regular disabled attribute.
What I have done to hide the remove button and the "Add a tag" input box, was to add a couple of rules in the CSS.
tags-input[disabled] .remove-button {
display: none;
}
tags-input[disabled] input.input {
display: none;
}
Probably there is a better way to do it, this was the fastest I could find.