I have a situation where I need to change some CSS on a page based off the URL where the visitor came from. I'm using a form to submit a value to a new page (a checkout page) which is hosted on a different server/site than where the form resides. I have different forms sending this info over to the checkout page on 2 totally different sites. On this checkout page, if the user comes from site A, I need to add a certain class to a div. If the user comes over from site B, I need to add a different class to a div. Something like this:
if incoming URL is equal to www.abc.com, then addClass ('classABC');
if incoming URL is equal to www.xyz.com, then addClass ('classABC');
Am I providing enough information to properly evaluate this? Ideally I'd like to pull this off in jQuery but not sure if there's an existing plugin that can check this. One thing to note, not all the forms being submitted to the checkout page reside on the same pages (i.e. www.xyz.com/index.html). Some may be on different pages through each site, so I need to be able to figure this out based off the primary URL.
Thanks!
It should be possible to read the HTTP Refferer on the serverside. If you can then just put this value into a hidden input field like that <input type="hidden" value="the referer" id="referer-value"/> and read that hidden value for example using jquery like this var referer = $('#referer-value').val();. but as long as you can read the referer on the server you could also directly change the css file serverside.
To do this in JavaScript/jQuery you'll need to either add a URL parameter to the page to indicate which site it's from or use server-side code to embed the css in the page (which would be better). On the server you could do it with http referrer, but it's not 100% reliable so is still better to use a url parameter.
switch(location.hostname) {
case 'www.xyz.com':
case 'xyz.com':
$('div#yourid').addClass('classXYZ'); break;
case 'www.abc.com':
case 'abc.com':
$('div#yourid').addClass('classABC'); break;
}
Hope it helps!
Related
By custom user links, i mean like for example when a user registers to the website, a page is created specifically for that user with a link.
For Example
https:/domain.com/users/customerName
Then after creating the link, the website will automatically customize the website by using a clone of a specific webpage.
*Btw i've already took Care of the Login/Register part. I just need to know how custom user links would work.
Option 1: example.com/user
Use a single PHP file and an .htaccess file. Check out How to create friendly URL in php?
Option 2: user.example.com
Create sub-domains for each user, also uses .htaccess. Check out How to let PHP to create subdomain automatically for each user?
Option 3: example.com?user=name
Create a single php file and use $_GET parameters. This is the most usual and easiest way to customize the website based on the user who registered and logged in. (usually using user ID number: example.com/profile.php?user=71)
Of course there's also Session handling.
I think you searching for URL rewriting concept.
If user login the page no need to clone the page.you could access the same page with this user data and specification(dynamic page).Many the page content with php functions
URL rewriting
you could the function in .htaccess
if user enters the page
http://example.com/someuser
its rewrite the url with
http://example.com?q=someuser
if you see the url bar its like special page for the user.
It's actually fairly simple. You just use GET within PHP and the URL would be something like http://example.com/user?id=4453623 - If you've ever been on facebook you'll notice they use PHP for the profile pages and much other things too. If you go to your profile page, you'll notice a "id=" variable up in the URL and that's how they determine which profile page to display to you.
This is basically what #Granny commented.
I have a website and when a user follows an internal link I would like to pass some extra information to a new page, so JavaScript on the destination page could do some useful highlighting.
There is an option to pass that information via the link parameters (GET), but it will generate lots of virtually duplicate pages and break pretty URLs concept. Another way is to make a webapp using AJAX, but it will also bound content to a single URL.
How can I transparently pass some information to the new page during navigation w/o messing with site's URL structure?
You could store the data in local storage or session storage, and retrieve it again on the destination page.
So you have a few options.
Form Submission
First option post a form with the data. Add a hidden form, on the anchor click capture the click event, set the hidden fields with the values you want to send to the next page, and submit the form. On the next page, read the post parameters in the backend and update the page.
Local Storage
On click of the anchor, set localStorage to the values you want to appear on the next page. When the next page loads, read the localStorage values and update the page. Note: The server will not have access to the values
Ajax with pushState
Use Ajax to submit the form. When the Ajax call returns, use window.history.pushState to update the url with whatever url you want to be displayed to the user.
One of the options not mentioned is to create a dirty URL:
/destination/param1/value1/...
then strip additional parameters at server-side and redirect:
/destination
keeping additional values stored at server-side (e.g. via sessions). I still prefer using sessionStorage in a real application, but it worth mentioning anyway.
What do you mean it will "bind content to a single url"? AJAX request is the first thing that comes to my mind as the solution to this problem. You dont have to use the url of the page to make the ajax request, you can build the url inside your javascript based on whatever conditions exist in your application.
Besides AJAX and passing parameters in the URL, the only other thing I can think of is to use Cookies. That of course runs into problems if the user has cookies disabled. I think an Ajax call to your server is the most robust way of handling the problem.
Here is the thing, I have a form in my web site looks like something like this:
Name: ----
Last name: ----
.
.
.
something like this, I work with a site that I have to send this information and type this requests again in that site with the same fields.
It means I want to copy my forms data to the target website's form with the same fields.
I do not have the access to target website's codes and I'm just a user there.
So I want to know if there is a way using Jquery, javascript or anything help me make a button that When I click that the data copy from my site to the target website.
Is it possible to access another browser's page tab inside another one??!! with jqyery?
Thank you in advance
I haven't tried your problem, and this is just an opinion.
If that website is using a get() method, you are saved. You can form a query string in the same format and execute it, else if you are trying to do something like that automatically if there is some captcha check you may fail, and the server will be blocking you thinking it's a DOS attack.
And this is something which may be helpful to you.
Javascript communication between browser tabs/windows
var w2 = window.open("Website you need to fill the form");
Now use w2 as owner window, in order to access the elements.
Is there a way to hide the url in the address bar with Grails application. Now users of the web application can see and change the request parameter values from the address bar and they see the record id in the show page.
Is there a way in Javascript or Groovy (URL Mapping) or Grails (.gsp) or HTML or Tomcat (server.xml or conf.xml or in web.xml inside application in the webapps)
ex(http://www.example.com/hide/show /) i want to avoid this url and always see (http://www.example.com) or (http://www.example.com/hide/show) without the record id
Is there a way to prevent this?
No, most browsers doesn't let you hide the address field, even if you open a new window using window.open. This is a security feature, so that one site can't easily pretend to be another.
Your application should have security checks so that one user can't access data that only another user should see. Just hiding the URL would not be safe anyway, you can easily get around that using tools built into the browser, or readily available addons.
It's part of the restful URL pattern implemented by grails.
Your best bet to hide the URL would be using an iframe within the page you want the user to see in their address bar.
Not quite sure what you mean, but I would change the default root URL mapping in UrlMappings.groovy so it looks a bit like this:
static mappings = {
"/$controller/$action?/$id?"{
constraints {
// apply constraints here
}
}
//Change it here!!!!
"/"(controller: 'controllerName', action: 'actionName')
Where 'actionName' and 'controllerName' are what you want them to be - 'hide', 'show' in your example?
Than pass all parameters via a post instead of a get, just change the <g:form> method.
You will still obviously need to implement any security checking required in the controller as stated by other posters.
Thanks,
Jim.
You can probably handle this using a variation of Post/Redirect/Get:
http://en.wikipedia.org/wiki/Post/Redirect/Get
At our Grails site we have a lot of search fields. When a user clicked a pagination link all those search fields ended up in the URL which created ugly URL:s with a higher risk that users bookmarked those addresses which could mean future problems.
We solved this by saving not only all POST but also GET with parameters into the session, redirect to GET without parameters and append those again in the controller. This not only creates nice URL:s but also a memory so that if a user goes back to an earlier menu, then selected details within that menu are redisplayed.
For your specific request to hide the id in "show/42" you can probably handle that likewise or possibly configure Grails to use "show?id=42" instead, but we don't have that requirement so I haven't looked further into that issue. Good luck!
Forgot to mention: this won't add much to security since links will still contain ids, it will only clean up the address bar.
Here's some sample code that should work. If show?id=42 is called, it saves id=42 in the session, then redirects to just show and id=42 is added to params before further processing. It does what you want, but as commented it might not always be a wise thing to do.
def show = {
if (request.method == 'GET' && !request.queryString) {
if (session[controllerName]) {
params.putAll(session[controllerName])
// Add the typical code for show here...
}
} else {
session[controllerName] = extractParams(params)
redirect(action: 'show')
return
}
I have three radio buttons and 4 check boxes.
I want to preserve the radio button and check box values after the browser refresh.
I do not want to use cookies (due to some other reason).
Could anyone please help me?
I don't think this is possible because HTTP is stateless, cookies or server side scripting provide 'state'.
You could use sessions instead.
EDIT: My bad, I read PHP and not Javascript. However I did find this link after a quick Google search. Session variables without cookies in JS
You might be able to use the hash url.
something like this (don't remember if you need to specify the name of the page as well, but I don't think so):
document.location.href = '#radio1=1&radio2=0'
The hash means it just directs things on the current page and not going to another page (and the browser updates it in the address field, so if the user reloads the page, it will still be there). Then you can read it from javascript as well and set it.
Not as good as using server side sessions, but it is an option :)
If you're using a form to trigger a new page loading you can make the onsubmit event call a javascript function to change the window location and append URL parameters that store the values of the radio buttons. When the page loads you would then read the parameter values from the URL. Something like this:
<script type="text/javascript">
function changeURL(){
var str = window.location+"?radio1=1";
window.open(str);
return false;
}
</script>
...
<FORM onsubmit="changeURL();">
<INPUT TYPE="submit" value="click me" >
</FORM>
A new facility is being developed to allow web sites to store persistent data on the client machine. Available in some browsers already this allows you to save the the radio and checkbox states and recover and restore them next time the user visits your site. For more info see here https://developer.mozilla.org/en/DOM/Storage and here http://dev.w3.org/html5/webstorage
Have some JS on the page submit all radiobutton/checkbox events to the server, and store their state in your database. When the page (re)loads, send this state as part of the HTML.