i need a script to count link clicks on my website and count report to a flatfile/excel.
The use of a Javascript framework like jQuery would be wise in this case.
Note that you cannot save data into a file on the client's computer. Instead, you can do an AJAX to the server, and save it via your SSI on the server into database/excel/file whatever data storage there is.
My demo will be using jQuery, jQuery Cookie Plugin and PHP:
countdetect.js
jQuery(function(){
$("a").click(function{
var cookiename = 'linkcounter';
if($.cookie(cookiename) == null){
$.cookie(cookiename, 0);
}
$.cookie(cookiename, $.cookie(cookiename)+1);
});
});
index.php
<?php
session_start();
$counter_file = 'counter';
if(!file_exists($counter_file)){
file_put_contents($counter_file, 0);
}
$counts = (int)file_get_contents($counter_file);
file_put_contents($counter_file, $counts++);
// you can use $counts if you want to display it on the page.
?><!DOCTYPE html>
<html>
<head>
<title>Link Click Counter Test</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>
<script type="text/javascript" src="countdetect.js"></script>
</head>
<body>
<br />
<br />
Link clicks: <?php echo $counts; ?>
</body>
</html>
Related
I am using JQuery to test the size of an input after submitting a form:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page 1</title>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<form method="post" action="essai.php">
<input type="text" name="mail" id="email" placeholder="mail"/><br />
<input type="submit" name="submit" value="Validate" />
</form>
<?php
if (isset($_POST['submit'])){
echo($_POST['mail']);
if(isset($_POST['mail'])){
$data=789;
}
}
?>
<script>
$(function(){
var data = <?php echo json_encode($data); ?>;
$("form").on("submit", function() {
if(data.toString().length < 4) {
alert(data);
return false;
}
});
});
</script>
</body>
</html>
The problem is that the alert (if I enter only 1 caracter for instance) does not pop up after the 1st submitting but only after the others.
Thank you
First, it's terribly insecure to embed PHP code within JavaScript. I can't think of one reason why you will want to use server-side code on the client-side. As an alternative, echo the javascript code from PHP, not the other way round.
Now your problem comes up because the first time the page is loaded, nothing is posted. You have some chunk of code which executes only after something gets posted. If your PHP script can display errors, you will see an undefined variable notice thrown the first time you load the code. You can work around that by declaring the variable before using it in the condition:
$data = 0; // Initialize variable here
if (isset($_POST['submit'])){
echo($_POST['mail']);
if(isset($_POST['mail'])){
$data=789;
}
}
i need a little info on google recaptcha. I want to grab the value of "g-recaptcha-response" that compares in the captcha.php file i inserted below in my jquery file and then send it to the captcha.php file using jquery $.post() method. I apologize if this is duplicate but i really cannot find someone with my same problem ;)
THE HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="AlterVista - Editor HTML"/>
<script src='https://www.google.com/recaptcha/api.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="handle_spam.js" type="text/javascript"></script>
<title></title>
</head>
<body>
<div class="g-recaptcha" data-sitekey="6Lf8LxIUAAAAALg93pw24l53KTeqrIwl7kUY-opk"></div>
<button id="go">Register</button>
</body>
</html>
THE PHP
<?php
$captcha=$_POST['g-recaptcha-response'];
echo $captcha;
if(!$captcha){
echo 'You must verify yourself';
exit;
}
$response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=6Lf8LxIUAAAAACB9iqeOermR-rPOW0zcWRfoetBO&response=".$captcha."&remoteip=".$_SERVER['REMOTE_ADDR']);
if($response.success==false)
{
echo 'abort_all';
}else
{
echo 'success';
}
?>
THE JS
$(document).ready(function(){
$('#go').click(function(){
send=$('')
$.post('captcha.php',function(data){
alert(data);
});
});
});
Use this
<div class="g-recaptcha" data-callback="captchaCallback" data-sitekey="...">
and provide the function:
function captchaCallback(response) {
alert(response);
}
I have index.php in which I would like when the user clicks the button "Click" it to redirect to "newpage.php" but also for another page "Click.php" to be loaded into the div "content" within the newly loaded "newpage.php".
Similarly I would like for when "Click Also" is clicked for the user to be redirected to the same page "newpage.php" but a different page "ClickAlso.php" to be loaded into the same div "content".
index.php
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(document).on('click', '.clickme', function() {
window.location.replace("newpage.php");
});
$(document).on('click', '.clickmealso', function() {
window.location.replace("newpage.php");
});
});
</script>
</head>
<body>
<div>
<button class="clickme">Click</button>
<button class="clickmealso">Click Also</button>
</div>
</body>
</html>
newpage.php
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
$(document).ready(function() {});
</script>
</head>
<body>
<div id="content">
</div>
</body>
</html>
Try this solution:
index.php
change your document ready event to redirect to newpage.php using url params. For this example I used a parameter named 'page'.
$(document).ready(function() {
$(document).on('click', '.clickme', function() {
window.location = ("newpage.php?page=click");
});
$(document).on('click', '.clickmealso', function() {
window.location = ("newpage.php?page=clickAlso");
});
});
newpage.php
Define what happens once the page is accessed. This is where things get a bit more interesting. Each time this page (newpage.php) loads, it looks for the parameter 'page' in the URL and extracts its value. The parameter's value is then assigned to a variable I called $pageToGet.
After that we check whether the value is equal to 'click' or 'clickAlso' and we display the content accordingly using require.
<?php
$pageToGet = $_GET['page'];
?>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
</head>
<body>
<div id="content">
<?php
if ($pageToGet == 'click') {
require('Click.php');
} elseif($pageToGet == 'clickAlso') {
require('ClickAlso.php');
}
?>
</div>
</body>
</html>
Be sure to have your files: Click.php and ClickAlso.php in the same directory for this to work.
Good Luck
I'm making a site for some peaple of my class and I want them to be able to login. I don't want to make an extra loginpage, so I created this bit of code for my login system, but it doesn't work. I looked al over the internet to find other soloutions, but with no success... I want the person to type in their username and password and I want to store that information in a javascript function, so that I can do a function like tis:
function passCheck () {
if (pass="johndohpassword1234") // userbname johndoe and passsword password1234
{
document.getElementById('h').innerHTML= "welcome, John!";
}
this is my code:
<?php
$id = $_POST[username] . $_POST[password];
?>
<html>
<head>
<title>Login</title>
<script type="text/javascript" src="script.js">
var pass=" <?php echo "$id"; ?>";
window.alert( "welkom, " + pass );
</script>
</head>
<body>
<h1 id="h">Login</h1> <br>
<form action="http://timkast.tk" method="post">
<b>Username:</b><input type="text" name="username"> <br>
<b>Password:</b><input type="password" name="password"><br>
<input type="submit"></input>
</form>
</body>
</html>
everything works fine, but the code for window.alert does nothing and I dont know why, please can someone explain/fix this?
When you specify a src for the script tag, it ignores the contents of the script tag.
As specified in the documentation:
If a script element has a src attribute specified, it should not have a script embedded inside its tags.
You can't write code into a <script> tag with reference to external file <script src="...">.
You have:
<script type="text/javascript" src="script.js">
var pass=" <?php echo "$id"; ?>";
window.alert( "welkom, " + pass );
</script>
And you need:
<script type="text/javascript" src="script.js"></script>
<script>
var pass=" <?php echo "$id"; ?>";
window.alert( "welkom, " + pass );
</script>
I have this script below and its working good. It works when I load the .php file directly even with external javascript tags.
index.html
<div id="content"></div>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="test.js"></script>
test.js
$(document).ready(function() {
$('#content').load('content/index.php')
});
/content/index.php
<?php
require_once("geoip.inc");
$gi = geoip_open("GeoIP.dat", GEOIP_STANDARD);
$country_code = geoip_country_code_by_addr($gi, $_SERVER['REMOTE_ADDR']);
geoip_close($gi);
if ($country_code == 'RO' ||
$country_code == 'DO' ||
$country_code == 'PK' ||
$country_code == 'MA' ||
$country_code == 'PE' ||
$country_code == 'IR' ||
$country_code == 'DZ' ||
$country_code == 'RU' ||
$country_code == 'EG') {
echo 'country not supported';
} else {
echo 'supported';
}
?>
My Question is:
When I am trying to
echo 'supported';
It is working good.
But when I tried to echo
<SCRIPT SRC="http://externalsite.com/ads/sample.js" TYPE="text/javascript"></SCRIPT>
the script tag wasn't show.
I need to load the .php file inside my .js file
try this..
echo "<SCRIPT SRC='http://externalsite.com/ads/sample.js' TYPE='text/javascript'></SCRIPT>";
Echo tags will not be displayed on page but contains in HTML. see if script tag present in HTML using browser inspector.
If you want to display tags on page then use htmlspecialchars()
echo htmlspecialchars("<SCRIPT SRC='http://externalsite.com/ads/sample.js' TYPE='text/javascript'></SCRIPT>");
Refer: http://php.net/manual/en/function.htmlspecialchars.php
When you try like below:
<?php
echo 'test';
echo '<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>';
die;
?>
Output will be:
test
Source code will be look like
test<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
UPDATE
You are loading an entire HTML page into your div, including the html, head and body tags. What happens if you do the load and just have the opening script, closing script, and JavaScript code in the HTML that you load?
Here is the driver page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Load of Script</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.3.2");
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#myButton").click(function() {
$("#myDiv").load("trackingCode.html");
});
});
</script>
</head>
<body>
<button id="myButton">Click Me</button>
<div id="myDiv"></div>
</body>
</html>
Here is the contents of trackingCode.html:
<script type="text/javascript">
alert("Outside the jQuery ready");
$(function() {
alert("Inside the jQuery ready");
});
</script>
This works for me in Safari 4.
Update: Added DOCTYPE and html namespace to match the code on my test environment. Tested with Firefox 3.6.13 and example code works.
For more refer this link