Bigcommerce Custom js Module not working on Localhost - javascript

I was developing an add-on for bigcommerce and i'm using cornerstone theme. Created custom template and mapped custom JavaScript module for it. However the case is, it's working fine on live store(Loading Data) when pushed. While it's not working on localhost. I searched and found only one thing related to it here. But it's not answered yet. So i was thinking if anyone has any work around for it. I'm using windows 10.

Related

jquery datatables from datatables builder into react component

I've been trying to get jQuery datatables to work in a react component. My app doesn't use bootstrap but I want to use it for my tables so I've scoped bootstrap to a class so i can use it in a div without affecting the rest of the application.
I read the following article Integrating React and Datatables — not as hard as advertised, but the article presents a use case that is more basic than I think many jQuery datatables users use. npm datatables doesn't give you access to extensions (search, scroller, button functions, etc), and everything that comes without the extensions is easy enough that you might as well use an existing react table like primereact, react-table, griddle, react-data-grid, reactabular, fixed-data-table, or react-virtualized.
These offer many options but when tested, had at least 1 or more problems that prevented it from being easily adopted and use all the features needed. Some have issues i think I could help fix after I'm more seasoned with react, but I'm not there yet. I've used jQuery datatables in many production environments without any problems. It's a major sticking point moving to react.
So after weeks of searching and testing and trying to work through bugs, I'm back to trying to bring jQuery datatables into my react app. I realize it's not the "react way" but based on the react docs it's possible and there's a proper way to approach it. I don't need it to react with anything outside of its container or div i place it in.
Using the builder is the recommended way to download datatables so you can get your customized components. I'm also downloading rather than using the CDN because this is a local app and needs to work when there is LAN but no WAN access. I'm using create-react-app and I tried to download datatables from here to a folder in my project and had the following problems:
hot-reload started taking forever (>1min)
the page itself was moving at a crawl
extensions didn't seem to be working (could have been locked up?)
How do you use jQuery datatables in a react app while still being able to use the datatables extensions and without killing the hot-reload for create-react-app? Can anyone provide a working example?
Update
Apparently jQuery datatables has made some major updates since the last time I tried to use their builder and now it includes a way to npm install the extensions too. I'll post a github of a working solution if i find one before someone else can update.
Update
Here is a github i made of a react version that is partially working and a basic html/js/css version that is fully working. The readme tells what is working and not working. Can anyone show me why this not working properly?

How to use server-side rendering in Angular 2?

I have a web app developed with Angular 2 which communicates with Java APIs on the server to fetch data. Everything is working fine except the pages are not indexed by search engine (except Google which supports script generated tags).
I've googled a lot and found that this can be achieved by "server side rendering" and there are libraries available to achieve this but all of these are commercial products that require payment.
I have come across Angular Universal which is not a commercial product, can we use it to solve our issue? If it can then how can we hook it up to our existing app?
You are on the right path there are two ways to achieve your objective
If you are using #angular/cli for developing angular app then you can only follow this link
If you developing with your own webpack.config file then there are lot of options available, best of them is universal-starter , which is featued in official documentation of angular/universal
While continuing with #angular/cli, there is a little caveat that it doesn't support lazy loading yet but they are working on it and future is bright with #angular/cli. If you want to implement lazy loading now only then i will suggest you go ahead with second option.

Cordova Windows Phone 8.1: error with bootstrap modal

I'm trying to port a cordova application on WindowsPhone 8.1, and everything has worked (more or less) fine.
Now I'm stucked in this problem: I'm using angular and bootstrap-ui, but when I try to open a popup (that works everywhere, also in ie) I get this error:
Error: Unable to add dynamic content. A script attempted to inject dynamic content, or elements previously modified dynamically, that might be unsafe. For example, using the innerHTML property to add script or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content, or explicitly create elements and attributes with a method such as createElement. For more information, see http://go.microsoft.com/fwlink/?LinkID=247104.
I have already tryed out this: Using AppendTo/jquery-win8 in Win8 apps and this http://blog.jonathanchannon.com/2013/01/24/using-angularjsbackbonejs-in-windows-8-javascript-app/ but that have not worked.
Any suggestion on how to fix this?
I've had the same issue on a few of the projects I started - this seems to happen especially if you running the application from Visual Studio.
The one trick that i found that works is in your main page (where you would include all you JavaScript references) is to reference the platformOverrides.js file before the reference to the angular.js file.
The platformOverrides.js should be generated at compile-time from the various merges you have included in your project

IOAuth.IO Integration with Ionic/Angular Hybrid App

I am having a really difficult time getting the cordova plugin authored by OAuth.io (https://github.com/oauth-io/oauth-phonegap) to work within the an ionic phone build. Everything is setup based off of the desktop version of the JS file they provide, wrapped in an Angular service for ease of unit testing, with another factory handling the actual flow of login/logout etc...
The issue I am running into is that now after switching to the plugin version and removing the referenced JS version, nothing works any longer. I can no longer pull up the facebook login page, nor have the global object 'OAuth' recognized outside of the injected service. The furthest I got in troubleshooting the issue is that the OAuth object is created, at least initially as I can log out the object, but anything after that does not appear to be recognized.
My web (working) version of code example is on plunker here: http://plnkr.co/edit/B4HdkkBKDP3Xv2riQGui?p=preview
Any thoughts on further troubleshooting or if there is another way of accomplishing this goal would be greatly appreciated!
We just published the version 0.2.0 of the OAuth.io Cordova/Phonegap SDK, which fixes the issue with Ionic.
Now you should be able to use the cordova plugin in a ionic app without any trouble, like this:
$ cordova plugin add https://github.com/oauth-io/oauth-phonegap
This version also contains features that were missing from the sdk, like the cache and the unified user info method.
You can get more information about all this on our github page:
https://github.com/oauth-io/oauth-phonegap
Hope this helps :)

Using FileUploadField extension with extjs3.4

Trying to handle with the FileUploadField extension for ExtJS 3.4 provided on Examples web page (http://dev.sencha.com/deploy/ext-3.4.0/examples/form/file-upload.html), I can't get any of the tree examples to be as it is shown on web page. And of course, can't get them work as they might.
When I specify a "FileUpLoadField" on my application, there appear two "browse.." buttons: It seems that one belongs to the ExtJS extension and another belongs to the browser.
On the other hand appear what it seems to be two textfields and there's no Icon.
I've got the FileUpLoadField" extension copying code that's provided on: http://dev.sencha.com/deploy/ext-3.4.0/examples/ux/fileuploadfield/FileUploadField.js
I've put this code on a .js file and added it as a library on my app.
I suppose this issue is related with browser/ExtJS extension I'm using.
Could anyone try to explain what I'm doing wrong?
You probably didn't add link to FileUploadField.css in your code.

Categories