I have a webpage on a raspberry pi. This page supports only HTML since I am using webIOpi. I can make use of python scripts and javascript.
When I link to this page hosted on the raspberry from outside I would need to pass some variables. but i do not want to put them in the URL as I would like to keep the URL clean.
Is there any other method i can use to pass values to this page using any of the above resources?
I don't know your markup, I got the same problem in a one-page-markup where content come and go (slide in and out) via javascript commands.
In my case I save some values in html attributes via javascript. This is a valid feature in HTML5, when you use a "data-" prefix for your value names (good explanation here) :
// Save it
element.setAttribute("data-foo", "bar");
// Get it
var foo = element.getAttribute("data-foo");
Note : reloading the page will unset the attributes ! ...but worked for me...
Related
I currently have a Java Spring project where the bulk of the front is in AngularJS, HTML, etc. I currently have an application.properties file that holds:
name:myName
idNum:8888888888
password:squirrels
contextPath:/ilovesquirrels-ui
server:0000
ui.firstLink: www.google.com
ui.secondLink: www.yahoo.com
ui.thirdLink: www.w3schools.com
myBool: False
The first five seem to read in automatically to a place I cannot seem to find. The last four, I'd like to access in Javascript to store the urls and the boolean. I'd like to write something in JS like:
var myLink1 = "something that accesses ui.firstLink in application.properties";
var myLink2 = "something that accesses ui.secondLink in application.properties";
var myLink3 = "something that accesses ui.thirdLink in application.properties";
Right now, I am reading information from a Javascript file that holds a JSON object that I'd eventually like to get rid of. It was all the same information as application.properties, except it is more visible to the end user. How do I get the links from my application.properties file into Javascript variables?
I don't like to mix JavaScript with the server-side language as it:
makes life harder for editors
is harder to read
couples JS with the server-side technology
Therefore, I would put the desired variable expressions as meta tags or data-attributes and then access them using JS.
<body data-uifirstlink='<%=properties.getProperty("uifirstLink")%>';
accessed with jQuery by: $('body').data('uifirstlink');
note: ideally, these data attributes should be as contextual as possible (instead of body choose a more specific place).
<meta name='uifirstlink' content='<%=properties.getProperty("uifirstLink")%>' />
accessed with jQuery by: $('meta[name="uifirstlink"]').prop('content')
A service for retrieving properties is not good because:
You need to wait for the page to load to run the call and use the variables
You have unnecessary Ajax calls
You create more coupling between client and server
Finally, you could consider cookies or headers, but I don't think is so straightforward.
You could create a jsp file with this:
<script>
var myLink1 = '<%=properties.getProperty("ui.firstLink")%>';
</script>
If you want to use spring, create a PopertiesPlaceHolderConfigurer and use spring tags in jsp. See here
What is the javascript equivalent to PHP's include(file.html) specifically without needing to place it in a div like $("#div").load("file.html");? I'd like to get away from using PHP and find out how to do this in Javascript without using a div placeholder and just loading it into webcode to use with things like bootstrap modals or buttons.
in this case, php acts as a preprocessor - it sees that include line, fetches the html and then drops the contents of the file in-place. Javascript can't really do that in the same way because it only lives on the browser.
You have some options
Do you an http request to a resource that will return the html, and then render that html string to a location (html id tag of some sort)
Use a different preprocessor. There's loads and it depends on what runtime you're on. NodeJS? Ruby? Go? Java? Python? All of them use something different - but they'll give you a one-to-one alternative for the directives you want to use inside your html files. Here's a great article that gives an overview of a number of different options: https://css-tricks.com/the-simplest-ways-to-handle-html-includes/
naturally, when you want to load a resource from js (when it is possible and do not try to access a resource that triggers a cross domain origin problem) you use AJAX
a simple implementation using jQuery:
$.get('file.html', function(file) {
console.dir(file);
});
I am having the next scenario (I can't change it). I have an classic asp page. In it, I have the asp code, the javascript code, and the VBscript code. When the user clicks the button confirm, the javascript function "confirm" is executed. In it, the page submits a form to itself.
What I want to accomplish is the next thing. Inside that javascript function confirm, I can easily get the web page html as a string. But what I want is to get that string in the VBScript part when the page processes the self-submit done. I have tried the next things:
Inserting in an asp input hidden control in the page, and load from JavaScript the needed string in that input. Afterwards I expected to get it in VBScript by Request("controlId/controlName"). But it fails me because the input hidden control can't have strings that large.
In the JavaScript confirm function, to load in a session variable in the string. But it looks like I can't write a client-side variable in a session variable.
To store through the JavaScript function a temporary file and passing it through a input file control. This I only have thought about it. Because i don't think that it is a good solution to store a temporary file in the client-side, and I still have the believe to find a better solution than this. Also I don't know exactly how to write files with JavaScript in the client-side.
I remember that I have tried all this, if I remember another thing that I tried, I will post it here.
I have slammed my face repeatedly against the desktop, but I can't find a solution to this. Any idea would be really helpful.
But it fails me because the input hidden control can't have strings
that large.
Use method="post" instead of method="get" in the form, and the data size is practically limitless. I.e. the limit changes from a few kilobyte to several megabyte.
But it looks like I can't write a client-side variable in a session
variable.
That is correct. The session variables only exist on the server side.
To store through the javascript function a temporary file and passing
it through a input file control.
That is a process in two steps, where each step in itself is generally impossible. You can't access the local file system using Javascript, and you can't set the file name of an input file control using Javascript.
So you want to get html page in your ASP using javascript?
Why do you want to do that. You can use your a form with a post method to send big string.
How can I keep javascript objects alive in a multi-page app (browser independently)?
I know I can for example write a Chrome extension with a background page that would solve it, but is there a browser independent way for this?
One approach is to have your javascript code load the pages (via 'ajax' calls) and then replace the body of the html, or parts of it. This way, as far as the browser is concerned you're still on the same "page". You'll have to make sure all the links within your website are void and instead of causing a browser page load, they actually trigger a javascript function. This is the way Facebook, for example, manages clicks on its website. See https://stackoverflow.com/a/7425870/562906
As you are using html5 you could use local storage to store JSON representations of your objects:
var json_text = JSON.stringify(your_object, null, 2);
localStorage.setItem("someKey", json_text);
and then to retrieve your item when on the other page:
var your_object = JSON.parse(localStorage.getItem("someKey"));
To use JSON.stringify you may need JSON-js - if the browser does html5 it appears likely that you won't need the third party script.
You can use cookies to pass data between page requests. Apart from that, you always have to reconstruct your objects from the beginning.
I'm currently working on a Safari Extension to create a printable form based upon information provided within a website. A custom CSS stylesheet wouldn't be ideal, instead I was hoping that it would be possible to do the following...
If I were to have the following DIV on page called name.html
<div id="name">John</div>
Is there a way of getting the contents of #name and passing it into a text field in another page called form.html? Ideally, avoiding server side scripts?
To retrieve the element's text (as in ALL the text, subnodes included):
var value = document.getElementById('name').textContent;
Then to assigned the text to the input field in another page:
document.getElementById('myField').value = value;
Of course that doesn't work across pages. If you don't want to use server-side code for this, one simple way of doing it would be to pass the code in a query string, redirect to your form page, and retrieve the variable from the query parameters. Which sounds simpler than it actually is, as you'd need a function to add a query parameter, another one to read a query parameter, and to be sure that everything is encoded and decoded properly.
Another - bad - alternative could be to use cookies via JavaScript.
Another - better but not yet widespread - alternative could to use the WebStorage API. (see localStorage and/or sessionStorage). This will require a modern browser supporting these APIs (for instance, Google Chrome, IE9, Firefox 4, etc...)
The embedded links will provide the missing parts.