I need to have a "button" as in a clickable element that performs an action. On the web I would normally use an actual button element: <button>Click me</button>
However in React Native the Button component isn't very stylable, so most people use another element eg TouchableOpacity.
If I use TouchableOpacity then React Native Web does set data-focusable="true" and tabindex="0", however it doesn't set the role to be button. Is it therefore not ideal in terms of accessibility? If so, then is there a more accessable way to have buttons in React Native Web?
Related
I have a requirement to display a custom react component inside react web chat component as part of the suggested action section. It will be hidden when the suggested action is selected.
I´m at that point on my app, where the user Logged in, receive the data from the server and now i need to make same changes. One of the changes is change the button that appears on my Sidedrawer saying Log In to Log Out and vice-versa when the user Logs Out...I could talk about other changes but i think the main thing is...
How do I access the Sidedrawer content in order to change/add buttons. I already entered the app-root.xml and made same testing adding the navigatingTo="onNavigatingTo" function and also in the .js file just to see if it responds, but it doesn´t...
How do i perform this?
You can show/hide your button via visibility, text binding or via a structural directive like *ngIf (if using Angular). For example, take a look here - I am showing/hiding a button based on whether the user is logged in or not (here is the related code-behind code).
The above example is using an Angular directive and can be applied only in Angular based applications, but with the same logic, you can substitute ****ngIf*** with visibility and achieve the same in TypeScript or plain JavaScript app.
The easiest way to do it is put the frame inside drawer content area, then navigate frame to another page.
I am trying to merge surveyjs along with my NativeScript application. I have referred URL for merging the same with Angular application
From the Angular demo code given on website, we have to add event handler for Complete button where we can get the response from surveyjs. Is it possible to integrate similarly for Nativescript Mobile application? Here is the approach which i feel can be taken.
Display
Create a HTML as provided by SurveyJS with required CSS and JS
referenced and add them as a file in project.
Modify HTML once i get the survey question json back from server.
Show the HTML as part of WebView. This will take care of displaying
the survey on my Application.
Here are my challenges during Submission
As per the process given on SurveyJS, i need to add handler for
oncomplete which will get the result json for me. How can i add
handlers for Complete button click in my code? Also please note that
there is a possibility that there may be multiple surveys on a single
page.
Apart from Survey, there are other fields also on the page and user
will submit them all in one go by clicking submit button of the page.
Hence i am planning to hide Complete button provided by SurveyJS
page. This needs to be triggered via code. Can this be done?
If someone can give directions on whether this scenario can be handled in nativescript application with Angular,it would help immensely.
yes it can be done using nativescript-webview-interface plugin.
add jS code inside WebView to handle oncomplete event from surveyJS. and on that function call emit some event to native app. after that add nativescript code to listen for that event and get the JSON back.
inside webView JS function
var oWebViewInterface = window.nsWebViewInterface;
// emit event to native app
oWebViewInterface.emit('anyEvent', jsonData);
inside native App
oWebViewInterface.on('anyEvent', function(jsonData){
// perform action on event
});
for more details on this you can check plugin readme file https://github.com/shripalsoni04/nativescript-webview-interface
I need to have 3 different Fancyboxes with different content.
Have no trouble "triggering" the Fancybox on click but my issue is how can I associate a web form or usercontrol to the Fancybox if that makes sense?
Example: Say a user clicks on an anchor named "add to basket". I need the corresponding Fancybox with the appropriate content to render on click. What I don't know is:
Do I need to use another web form for the content?
Do I need to use a usercontrol for the content?
How to get fancybox to recognize which web form or usercontrol to
render according to which ever anchor the user clicks on as there
will be multiple instances of different fancyboxes... again, if that
makes sense.
Is there a way to simulate the data-rel="dialog" attribute to show a page as a dialog page?
I can't use this one because I use the button for the LogIn/LogOut model, and this one doesn't work if I don't insert the data-ajax="false" attribute.
But using this I cannot use the ajax-based data-rel attribute.
So I need a trick to create a dialog page without using the dialog attribute on the anchor link.
Thanks
Hopefully in the next iteration of jQM ( 1.2 ) you could use the Popup, You can currently test this out in the pre-release builds:
http://jquerymobile.com/test/docs/pages/popup/index.html
or a form login