open a page / view in apache cordova - apache

I'm using apache cordova to create a application .
I have a little problem , I searched online and I can not understand why if you use the ' I change the page / view on the device .
It seems that not even take the touch input on the link .
Genymotion use of visual studio to perform the tests .
I also tried with the window.open javascript but I open a page in the browser coming out from the app
<a onclick='window.open('product.html', '_system');'>
or
<a href = 'product.html'>
can someone tell me how I can fix ?

For this to work you will need to install the InAppBrowser Plugin for Cordova
http://wiki.apache.org/cordova/InAppBrowser
https://github.com/apache/cordova-plugin-inappbrowser
If you are using Visual Studio Tools for Cordova just double click on the config.xml > Plugins > Add InAppBrowser

Related

React Native project not opening Metro Bundler in Browser

App is working fine. Also working fine on Emulator and my mobile phone. But the problem is that it is not showing this page on my browser. Open Image
I created this project in react native, Using following commands.
expo init DoneWithIt
choses a Manage workflow with blank template
When I type "npm start" in terminal (using VS code terminal)
it shows Open Image
It is not opening in browser like this
Open Image
Have you tried opening your browser manually at localhost and port 19000? Or simply press "w" in the same terminal after it starts so it opens for you the browser as you can see in the second image.
The Web UI is now deprecated in favor of a more advance terminal interface: https://blog.expo.dev/sunsetting-the-web-ui-for-expo-cli-ab12936d2206
To me the "w" option is grey out but I can still run it and it will let me know that some dependencies are missing. I try to install them but it doesn't succeed. I guess just made sure that the Web UI will not work anymore.
You will see the below error if the 'w' option is grayed out or if the 'w' doesn't work,
It looks like you're trying to use web support but don't have the required dependencies installed.
Please install react-native-web#~0.18.9, react-dom#18.1.0, #expo/webpack-config#^0.17.2 by running:
npx expo install react-native-web#~0.18.9 react-dom#18.1.0 #expo/webpack-config#^0.17.2
If you're not using the web, please ensure you remove the "web" string from the platform's array in the project Expo config.
install the mentioned packages and re-start the app(npm start).
Enter w, this should work.
The reason why the application is not giving you the web browser ability is because you're missing some packages. Thus far this is the version that's support out there. Try and run this code below:
npx expo install react-native-web#~0.18.9 react-dom#18.1.0 #expo/webpack-config#^0.17.2

Calling external URL in inAppBrowser

How can we call external URL inside our worklight hybrid application?
We are calling it through window.open but we want to open it in InAppbrowser.
Does it need to install Cordova plugin "cordova-plugin-inappbrowser" ?
We have MFPF 7.1
can someone please advise what steps we need to follow.
Thanks,
IBM MFP 7.1 has cordova and the major cordova plugins embedded. This means when you create an MFP 7.1 hybrid project, certain plugins are already present for your use directly. The complete list of available plugins can be found in this document : https://mobilefirstplatform.ibmcloud.com/tutorials/en/foundation/7.1/hello-world/integrating-mfpf-sdk-in-cordova-applications/ .
You will find that among others, inappbrowser is also automatically added to your hybrid project. This means you can directly use :
var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
or set existing window.open to inappbrowser like this :
window.open = cordova.InAppBrowser.open;
More usage info on inappbrowser can be found on the official cordova browser over here :
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/

VueJs dev tools panel not showing

I started using vue dev-tools in my application but it is not visible when in developer mode in Chrome. I tried various solutions found on the dev-tools github page and in other places on the web, but no luck. Below are the things i have done/tried to get it to display.
Enabled allow access to file URL’s option in the chrome extension
Added Vue.config.debug = true; Vue.config.devtools = true; just before new Vue({})
Added non-minified versions of VueJS file
Also I am using Chrome latest version: 55.0.2883.87.
I do get the following message when I click on the chrome extension
Except the panel is not actually showing.
Does anyone have a solution to this? Thanks.
I could not get the Vue icon to be active on the menu bar, however I was able to get the Vue tab to show in the Chrome developer tools. Try the following:
Close the Chrome developer tools window
Hard refresh the browser
Re-open the developer tools window and look for the Vue tab
The icon in the toolbar might still indicate that it cannot detect Vue, but the tab should be visible in the Chrome developer tools.
I had this same issue, I was using minified vue from cdn "vue.min.js" .Then I removed that and used non-minified vue. Then I reloaded browser and reopened console and the vue tab was there.
For me, I was running a local HTML file. By default, Chrome blocks extensions from working on local files.
3-dot menu -> More Tools -> Extensions
Find the Vue extension, click details and change turn on the setting "Allow access to file URLs:
Screenshot
close & reopen chrome
Also found today that if you have an ad blocker installed that this also stops Vue Devtools from running properly.
Closing the file tab and reopening it worked for me.
Restart many times Google Chrome
Don't use min file
And add before new vue instantiation:
Vue.config.devtools = true;
chrome developer tools should be close before enabling the vue dev tools extention...
(if chrome devtools is open, close chrome development tools and re-open)
Just do a "hard reload" for a few times. On windows: SHIFT + F5.
On Mac: CMD + SHIFT + R.
Use the devtools beta for Vue 3. And always check if your Vue app mounted correctly.
Step 1: add vue.js devtools as an extension from here
step 2: After adding vue.js devtools, close your browser.
Step 3: Open your browser and open your html page.
Step 4: click right side of your mouse and select inspect and try to find Vue.
Note: If you didn't added the CDN of vue.js, then add these line to your html file.
<script src="https://cdn.jsdelivr.net/npm/vue#2"></script>
You should enable Allow access to file URLs from Vue extension and then hard refresh your page with Shift + F5
It worked for me
(For Firefox Browser) If the add-ons 'Vue.js devtools' is added in browser..Just click on Inspect Element (or press F12) and there is a tab of Vue along with Inspector, Console, Network etc. Click on that Vue tab and enjoy debugging.
Just do hard reload and close development console then reopen it.
Hard Reload, help me.
Open devtools -> right click on reload button -> Hard Reload
Please make sure you don't use the production CDN. The only way that make it work for me is to use the VueJS dev version.
Development : vue.js
This happens to me periodically, pretty annoying because there seems to be no cause.
Go to Chrome browser extensions
Remove the Vue DevTools extension
Add it back again
Hard refresh your page
Chrome - Version 71.0.3578.98
MacOS Mojave 10.14
VueJS 2.5.21
close the chrome app
re-run development server
re-open chrome app
open localhost
press F12 (to open development tools)
In case you are using vue3, uninstall Vue devtool extension and install the beta version.
you can install it for chrome from the below link:
https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg
In #Daryn answer he mention that he has problems witch vue icon - here is solution to this part of running vue extension on chrome which in the same time also solve OP problem for me:
During plugin installation for short moment in upper right chrome corner the VUE ICON appears with message (screenshot is not my):
And CRITICAL is to click right button on that icon (without close that message!) and choose "PIN" (it pin to extensions icons bar) - if you not do it - then you will never see that icon again (which is mistake). After that shut down and reopen chrome. And now in you page with vue, this icon should have green colors (you can click on it) and click right button on some page element (or on screen center) and choose "Inspect" to see
maybe you can go to settings then go to preferences then look for persistence then enable local overrides, sorry my english is not good
Don't know if this helps but make sure to refer to app.js in your view file you are rendering in your current path. Laravel example from view file: <script src="{{ asset('js/app.js') }}" defer></script>
This way the vue extension starded working for me.
You should run
npm run watch
or
npm run dev
otherwise you can not see Vue Toolbar
Restarting Chrome worked for me
Maybe obvious but the Vue panel is not available when in incognito mode. In this case, the Vue icon is not visible either.
Enter chrome://extensions in the address bar and click on Details for Vue.js devtools. Scroll down to "Allow in Incognito" and switch to On.
don't forget about
npm run dev
(or something like in your project)
And then try advisions from first answers

YiiChat extension is not working in my yii app

i installed yiichat extention in my yii app, and I followed as per the documentation https://bitbucket.org/christiansalazarh/yiichat. when I finished the documentation and viewed it in a browser the chat textarea’s attribute is disabled ( a disabled icon is showing when mouse hover the field) is there any other configurations i want to add ? I am not able to send message in the chat app !please help me !!
did you review the jQuery version ? please use Yii 13 and clean your assets. after that test it again.

IBM Worklight - Sencha Touch app shows white screen

I am new for sencha touch, so to start with it , I downloaded a (sencha touch + worklight) project from given link and imported in eclipse . it is getting build and running perfectly when I run it in worklight console i.e localhost:8080/console but when I run it in android emulator it shows blank white screen . and gives error, i have attached log file here apart from this even I tried few more project all of them shows blank white screen.
I tried to run it in different AVD i.e Android 2.1, 2.2 , 2.3 but I get same problem.
I don`t know where is the problem whether in Worklight or Sencha Touch.
The Sencha edition of Worklight Starter has been recently re-written for Worklight 6.0.
You can try this new version from this location: http://public.dhe.ibm.com/software/mobile-solutions/worklight/docs/v600/WorklightStarter_Sencha.zip
See if that helps guiding you instead of the very oudated projects you have linked to.
After running into this same issue myself and finally working out how to solve it, I thought I'd share.
You need to Deploy the Worklight Adapter before you build and test your project.
Here is how:
Open WorklightStarter_Sencha project in Eclipse, open the adapters folder and highlight the WorklightStarterAdapter folder.
From the menu bar select Run -> Run As -> Deploy Worklight Adapter.
Now build and deploy your project.