Sorry if the question in the title is a bit vague, here's what I'm trying to accomplish:
Is there a script out there that can search a page (or page source) for a particular determined value (for example, a product ID "1234") and insert it dynamically or on-the-fly into a variable which can be used anywhere on the page if called?
For example:
I'm working on a site that uses a shopping cart/feed platform that is closed source, so I can't grab variables I need (such as the product ID, product price, and order ID), as they are "locked down" (so to speak). And I need to be able to grab them and dynamically insert them into click trackers/pixel URL strings.
I'm not sure if this is possible or if this is a much larger task at hand.
A webpage might have many ways of showing a value, and it takes some human interpretation to determine what values are important. Example:
<div id="couponDisplay" class="inset hidden">Enter your coupon code: <input name="coupon"/></div>
<div id="cartRegion">
<div class="cart">
<div class="lolbx_quantityControl" data-initialValue="1" onKey="lolbx_notify()">
</div>
</div>
</div>
It may be that you're looking at a shopping cart page, and though the whole HTML is hundreds of lines long, the most important part of that page for you is the data-initialValue="1" part. That's less obvious to a computer. The first step for you might be the path the computer uses to reach the value you want, then see if you can replicate that.
I'm not sure if I understand what sort of system you're connecting to, though; I will say that using outside web services through "hacks" like this without their permission may be violating their terms of use (ie, grabbing Google Maps data to make your own map control with no Google branding)
Related
I've been looking everywhere and I can't seem to find exactly what I'm looking for, I'm starting to think I should be looking at some kind of Javascript?
Basically, I have an amount £1,000,000 displayed over an image button and I need this repeated on a different page (The page the button leads to).
As I've never done this before I'm not sure where to look or what I need to be looking at as I'm a novice in this area.
Any help would be appreciated.
If the value is static so you can use content css property :
https://developer.mozilla.org/fr/docs/Web/CSS/content
If the amount is dynamic you should pass variable through Url or via form.
As I don't have a clue as to what you're setup is, i'll make some assumptions:
a static HTML site
no javascript frameworks (so no jQuery or jqLite etc)
with these assumptions you should start by looking up url attributes as a way to communicate basic information between pages.
As an example, the button href should look something like this:
/link-to-page?amount=1000000
then you grab the amount on the new page - with javascript - looking in the window.location object
This is a good resource
I have a simple file based with html that looks like this:
<html>
<body>
<b>Faculty</b><br><br>
Dr Mcgee
<br>
Dr Else
<br><br>
<b>Values</b><br><br>
1
<br>
2
<br>
</body>
</html>
I'm new to the web end of things, and was wondering how I could go about doing this: When the user hovers over a piece of text that's under the Faculty column of my school (I'm not gonna link my schools page because if I do someone from my school will likely create this extension). I want it to show a ratemyproff rating.
I have no idea on how to do this, because well I don't really know what to search on google to do such a thing?
I know there are CSS overlays over images like such:
https://www.w3schools.com/howto/howto_css_image_overlay.asp
But in my case, I'm not guaranteed what professors will be listed (I just want to understand the basic process of doing such things).
I don't think I can use PHP as that would require users who I want to share this eventually with to also have a php/server side thing installed. I guess I just don't know how to go about doing such a thing, and don't know what to search on the internet for it?
If the sites you are requesting data from aren't under your control you are very likely not going to be able to do this without a backend because of CORS, which basically prohibits site A from loading in data from site B. Site B would have to give you special permission. You can read about that here: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
However, if you are able to access the pages, or you decide to use a backend for this, the term you are looking for is ajax.
A rough outline of what your script might look like is:
Give these school elements a classname.
Also add data attribute to these elements to store data needed to get the information you are looking for (e.g. a url or a school name or id).
In the JS, set up a trigger so that when something with that classname is hovered over, an ajax request is made to a url to get the data you are looking for.
If the ajax request is successful, show the data you want to show in a container set up on the page.
As far as setting up the container to show, it would probably be simplest to add an empty container for each listing which will then be populated with data.
If you are new to all of this, I would suggest using jQuery. You can find the ajax documentation here: http://api.jquery.com/jquery.ajax/
First Step:
Use something to get the text and store in a javascript variable when hovered over the text that is searchable,
To do this put the text in a single node like <span class="searchable">This text is searchable</span>.
You can do something like this to get node value http://jsfiddle.net/5gyRx/
Second step:
Add an empty node <div class="data"></div> aboslutely positioned inside the container div which will be used to show fetched details about that text.
Third step:
Use JavaScript/jQuery to fire an Ajax call with the text you got from the first step and populate the empty node created earlier with this data.
This is probably a simple lookup, but since I don't know how to word my question in the form of a google search, I brought it here. I have a number of divs with an image associated inside each div. With each image, I gave it an alt for word association. I might need to use title instead, but for now I am just going to use alt for the purpose of my question. I want the user to click each image and link them all to the same html page (kind of like an under construction page). For obvious refactoring, I only want one of these html 'under construction sites'. However, I want them slightly personalized to show that the image they clicked is being noted as under construction. iE:
<div class="view view-first">
<img src = "img/storage.jpg" alt="Storage Corp">
<div class="mask">
<h2>Storage Rental Space</h2>
<p>Develepment, Server</p>
Read More"
</div>
</div>
So I would want them to click on read more, have them go to server.hml where it says something like 'Sorry Storage Corp is under constriction'.
Easy enough for one image, but let's say I have 20, and I want one server.html that spits out a different 'Sorry xxxx is under construction'. Do I created an empty div in server.html and call the text from the image alt text for the image they clicked into the html page for each image? If so, what is the proper syntax? Maybe I have been too knee deep in JS for the last few weeks that I just can't think of a proper way to do with without declaring a universal scope to hold the string and call it on an image click?
Thanks for any tips!
You’re likely to need either a server-side language or JavaScript to make the result page dynamic. The simplest way to do this would be to include the text you want in the href as part of the URI. For example "server.html?text=Sorry+wrong+page". In server.html, you could then grab this variable from the GET string and put it into the page.
All server-side languages give you access to GET variables. In JavaScript, it’s a little more complicated. See this question for ways to do it.
For example, say you have an information box that will be repeated in every single page. if i have this in the HTML, then every time i change it, ill have to change it in every single HTML file.
But if i load it in the javascript (as in the whole thing), then I'll only need to change the javascript. For example,
$("body").append('<div id="infobox">*whatever i need*</div>')
is this a better way or does it create more complications?
or are there more efficient ways to do this?
In short, no. You're on a slippery path there…
It might be more efficient for the person maintaining the page but you should really be doing this on the server-side as mohkhan suggested e.g. through a CMS or pre-processing if you're site is completely static. I assume that on your site, there isn't just an info box that's repeated — what about the navigational elements, the banner etc.?
There's nothing wrong with loading elements through JavaScript (e.g. to show counters, data, etc.) but you shouldn't be doing it for core content. Remember too that you shouldn't assume that everyone will have JavaScript enabled.
On my site, I collect information on items in a game I play. I would like to implement some sort of custom search for the items that is both easier to use, and displays the result in a more aesthetic manner.
Currently, I use a wikidot site which allows tags to be assigned to pages and they can be searched, but searching multiple tags doesn't work as I would like. It will start the list with pages with all the tags, then pages that have one of the tags, and finally pages that just happen to have the tags in the body. Also, the results are presented as the page title, the first few lines of text from each page (without any line breaks making it hard to read), and finish with a link to the page. [See example: http://imgur.com/a/gyTtD#0 ] What I would like for the results are something like the following: http://imgur.com/a/gyTtD#1, which is an actual page from my site, but it's not dynamic, I must edit that page if I want to keep it up to date; and for any permutations of tags I want to create a page like that for, I need to first find all of the relevant items, organize them how I want, then make the page containing the includes for each of their individual pages (each item has its own page, I just put an [[include item-name]] wherever I want that item to show up on other pages, which just puts the body of the page in.
What I'm looking for is the best plan of action to make this happen. I'm familiar with HTML/CSS/JS, but not much other webdev related stuff. Is there a way I could have a page with a comma separated list that I could parse with JavaScript to search pages? Or if should I look elsewhere, what are some good tutorials or quality sources to read up on how to do this?
Thank you in advanced for any answers you can provide.
If you still require help with this, I'd suggest asking on the Wikidot community wiki instead, as there are more people able to help you with your question there (as you have a Wikidot site).
URL: http://community.wikidot.com/forum