How to pass this data in ReactJS? - html

I am working with ReactJS and in a carousel design of Bootstrap, I found this line:
<div class="tns-carousel-inner" data-carousel-options="{"mode": "gallery", "responsive": {"0":{"nav":true, "controls": false},"992":{"nav":false, "controls": true}}}">
I am passing the value of "data-carousel-options" as it is in the above line but it is not working. However, it works fine in plain HTML. I am not sure how I can use this line in ReactJS.

Looks like the problem was not passing the data. The data can be passed exactly in the same way as it is in the question. The problem was, the javascript file which is responsible to act on the provided data needs to be loaded in each page individually. As I was working with React app, I put all the external javascript files (e.g: bootstrap, custom theme js, etc.) in the index.html file inside the "script" tag. But it turns out that not all javascript files work correctly in that way. Sometimes, some javascript files need to be loaded each time the route is changed. So, I had to include the javascript file inside the componentDidMount() and now it works fine.
Here is the link of another question that I asked on how to include external javascript files in ReactJs:
How to make external javascript file work in ReactJs?

Related

Missing theme after switching to from HTML to Freemarker

I am relatively new to freemarker and I am trying to convert a .html file, that displays correctly, to a .ftl file.
The conversion of the main part of the web page went great (all the elements are there), except for the theme (background) of the web page. It doesn't display, but it was in the html.
My theme is just a link that points to a .min.css file.
<link rel="stylesheet" href="../static/themes-dist-4.0.27-theme-gcwu-fegc/theme-gcwu-fegc/css/theme.min.css">
I am trying to understand if you can pass "html to ftl" straight?
Also, can you display a theme in a ftl file?
EDIT:
The answer to this was to put the file into a public directory (ressources/public/themes/*). The compiler picked it up from there.
You might need to understand that FreeMarker template files are executed on the server, and the browser just sees the output as regular HTLM. Thus, you can simply rename a .html to .ftl (or rather to .ftlh), and since it contains no FreeMarker directives, that template simply prints the original HTML as is.
Check on the developer panel (usually opens with F12) of your browser if the CSS file was successfully loaded. The CSS file is (usually) not a FreeMarker template, just a "static" file, so it's unrelated to FreeMarker (though of course it can also be generated by FreeMarker if you need dynamism there).

How to create a link to a html file using the Meteor local server?

Currently, I have an html file which has a basic layout of a login page which has an option for new users to sign up if they're not a member.
I have the following line inside of my html :
Join Us!
What I want to have happen is load up a new HTML page which will be a modal (using twitter bootstrap) that will ask the user to input the correct data to create a login/pass combination.
But this isn't working. It keeps doing the following (doesn't do anything) :
http://localhost:3000/register.html
I'm a little confused whether my HTML is wrong or MeteorJS requires some sort of specific way to do something like this.
You can use a relative url: Example: register.html only
If your file is into the same project, you don't need to put him an url absolute.
Put your register.html file in your project's /public directory and you will be able to access it via /register.html. However that page will run outside your Meteor app and won't have any Meteor functionality per se.
The /public folder maps to / and is normally used for images and other client-side assets. It's common to map /public/images to /images for example.

return a html file in rest service with all css and js files

I have to create a rest service to return a HTML file along with the CSS and JS . I will be getting the name of the html file as part of the request.
I tried providing the path of the html file as a property and reading the file content and sending as text/html. But this will not send the file with css and js.
Where do I keep all these files(ideally)? Should it be in web app or something ?
How to return the css and js with the html file?
You can host your JS and CSS files in separate website and give the links to CSS and JS in your HTML.. this way you will get a performance bonus also as your JS and CSS are cachable.
It should work fine..
If you have very less CSS and JS then you can append it to html and send to client
I want to give another answer here. Of course you can provide the static files completly via your REST service and store the files on the server where your REST service is running.
If the first request calls the path /example/index and the response contains your html-file, the browser of the client will load all referenced static files by sending a GET request back to the server. Assuming that you referenced the files css/style.css and js/script.js in your html-file, there will be two more GET requests /example/css/style.css and /example/js/script.js. Your REST service must provide the files under this path now and your clients will have all static files.
you make a mistake when you try to load a full view with REST.
REST is usefull to load data. Not displaying.
If you want load the full html content, you should use iframe or load your data with REST and make your own page.

android HTML template as resource

is there any way to have an html file (i.e. an html template) be a resource in android? I'd like to reference it in a similar way that i store strings in the res/values/strings.xml. However, when i do this, it appears the HTML is not getting rendered correctly when i use myTextView.setText(Html.fromHtml(MessageFormat
.format(getResources().getString(R.string.myHtmlFile), ...)
You can place raw HTML or other format files in /res/raw or /assets directory of your project. You can access the first with this method, and the second with this.

iphone uiwebview download complete page with CSS and Images

In my app there's a uiwebview that loads a URL.
I am using the following line to save the HTML of the page loaded locally to be able to view it offline:
NSString* html=[webView stringByEvaluatingJavaScriptFromString:#"document.getElementsByTagName('html')[0].innerHTML"]
The problem is that only the HTML of the document gets saved. I want to save also the images and the CSS along with the HTML so that the user see the page as if they are online.
Just like "save web page complete" or something like that, that we're used to in the browsers.
There is no easy way. Regex the HTML using RegexKitLite (http://regexkit.sourceforge.net/RegexKitLite/index.html) and snag all the urls to .jpg,.gif,.png, and .css and .js and whatever all else you need.
alternately, call:
NSString* imgUrls=[webView stringByEvaluatingJavaScriptFromString:#"document.getElementsByTagName('img')"]
or something like that, I'm no javascript whizz... and then deal with whatever all that returns ;)
Sorry. It's a pain in the rearheinie.
edit:
Save all the img's on the iphone, also save the html file. When you want to reload the page, load the html from a file into a string, and then use
- (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL
to load the HTML string. baseURL is used to specify the directory or site the webview will imagine the html string you hand it is located. All URLS will be relative to that.
Note, of course that this will not work very well for absolute URLs, only for relative ones. So this, in your html file, will monkey things up:
<img src="http://google.com/f/r/i/g/img.gif">
while this would be ok:
<img src="f/r/i/g/img.gif">
Again, this whole solution is mucky.
You might look into a pre-existing open source recursive html spider. I think wget does what you want, but I doubt it can be compiled for iPhone without a -lot- of hassle.
I didn't have time to check, but ASIWebPageRequest seams very promising. It states it can "Store a complete web page in a single string, or with each external resource in a separate file referenced from the page"
ASIWebPageRequest1
I will be using it on one of my projects, and then update thread.
Gonso