|
PHP - Jquery History With ?id=
Hi! Having a lot of fun dusting off the coding and putting together a site with PHP, CSS, and jQuery. I've run into one problem that I can't get past though. I implemented jQuery History to use hashtags to maintain browser back/forward buttons and linkability of the site (and not reload header and footer when updating content). The main purpose of the site is to showcase photography that's hosted on Flickr. I've got this working well using Slickr.
I have the Slickr code to load my galleries sets in a file called 'pictures.php' which is loaded fine into #page_content using a link to #pictures. The problem arises when I click on a gallery/set: I get taken back to the default view of the site without any hashtage because Slickr requires a link using parameters, so: www.myexamplesite.com/#pictures becomes www.myexamplesite.com/index.php?id=72157626067797650&p=1 As you can see, since it loses the hashtag, I am no longer looking at the right page. Does anybody have any ideas on how I can specify both the hashtag and the parameter? Cheers! Similar TutorialsI have the below code to open contents in a div or modal window and at the same time showing the url that matches the specified page which works as expected, no problems rising:
$(document).ready(function(){
///////LINK in a Div////////
$('#all').delegate('a.img-lnk, a.txt-lnk', 'click', function(){
$('#main').empty();
var page = $(this).attr('id');
var pageurl = $(this).attr('data-seo');
$('#main').load("../"+ page + ".php");
window.history.pushState('','',pageurl);
});
///////LINK in a Modal Window////////
$('#all').delegate('a.pop-lnk', 'click', function(){
var poppage = $(this).attr('id');
var popurl = $(this).attr('data-seo');
$('#popup').load("../char-inf/"+ poppage + ".php");
window.history.pushState('','',"/char-inf/"+ popurl);
});
$('body').delegate('.hide-it', 'click', function(){
$('.hide-it').hide();
$('#popup').empty();
window.history.back();
});
});
Problem:
If I give you a url of a link in my page e.g. www.example.com/test1 and paste it in your browser the test1 page will open normally,
BUT after that if you navigate to page test2 then the new url becomes www.example.com/test1/test2.
Is there a way to turn the url at its normal state which would be www.example.com/test2?A friend of mine is looking at relaunching a site he used to run and I am going to try to persuade him to move over to a dynamic site. The site is a Football Clubs history site and contains around 2,000 games and several hundred players. The obvious advantage of a dynamic site is that even the bits I just mentioned run to around 2,500 static pages, which could be reduced to just 2 pages if dynamically driven. I am fairly confident that I can do the conversion, but there is one thing that I already know I may struggle with and that is the page which shows game, births and deaths on this day in history. A rough example (using a very heavy Javascript code) can be found at http://follyball.co.uk/jeff/. In a simplified form (ignoring for now the foreign keys to relationships that these tables actually have) there will be two tables GAMES game_id | date | competition | opponent | score | attendance PLAYERS player_id | surname | firstname | date of birth | date of death What I would be looking for is a way to take todays date, and find any corresponding records in games.date, players.date of birth, players.date of death on the same date in previous years. This would be simple to do as three different queries but as I would like to actually mix the three and show them in date order, I would like to do it in one query, presumably using UNIONS. On top of this, I would also like a slightly different output for each different set, for example, if it was a game I would like year, competition, opponent, score, attendance, Whereas if it is a players birth or death, I would like it to show something like firstname surname was born in year Before I go delving too deep into how it may be done, I would like to know if it can be done! I cannot see why it would not be able to generate this but if it is going to be way out of my ability, then I will look for another option! Thanks in advance Steve Customers can view transaction history for approved and declined transactions (the reason for the decline should be included). Transactions are logged with their transaction reference numbers and status. hello guys, this is my first post on this forum and I really need your help on this. What I have is: I created a login page a home page and a index page. The index page checks if the session is set. If it's not the login page will be shown. If it is the homepage will be shown. Whenever the user logs in, the session gets set. The problem is is that whenever I login and the user presses the back button on his browser my session will always be returned false which means that whenever a user has logged in, the index page doesn't show home but shows the login page again even though the user has already logged in. Here is my code to make you understand a little bit better: session.php: Code: [Select] <?php class Session { function __construct() { } function set($name, $value) { $_SESSION[$name] = $value; } function get($name) { return $_SESSION[$name]; } function stopSession() { unset($_SESSION); session_destroy(); } function startSession() { if(!isset($_SESSION)) { session_start(); } } function check_session() { if(isset($_SESSION['username']) && !empty($_SESSION['username'])) { return true; } else { return false; } } } ?> login.php: Code: [Select] <?php class Handler_Login extends Action_Handler { function __construct($action_handle) { parent::construct($action_handle); $this->action = $action_handle; } function secured_handler() { $password = $_POST['password']; $username = $_POST['username']; $login = $this->dbh->Login($username, $password); if ($login == true) { $this->session->startSession(); $this->session->set('username', $username); $this->view->displayHome(); $this->view->display(); } else { //This is going to get more advanced later on, I'm currently working on resolving my session issue before I continue on this. echo "you are not logged in"; } } } ?> index.php: Code: [Select] <?php class Handler_home extends Action_Handler { public function __construct($action_handle) { parent::construct($action_handle); $this->action = $action_handle; } function secured_handler() { // for some reason this always returns false when the user goes back in history :( if ($this->session->check_session() == false) { $this->view->displayLogin(); $this->view->display(); } else { $this->view->displayHome(); $this->view->display(); } } } ?> anyone has an idea why the login page is always shown ? Is there a way to change the url in the code below using window.history.pushState dynamically to match the "page" variable?
$(document).ready(function(){
$('#all').delegate('a.pop-lnk', 'click', function(){
var page = $(this).attr('id');
$('#popup').load("../folder/"+ page + ".php");
window.history.pushState('','','/page');
});
});
Edited by Pavlos1316, 18 November 2014 - 03:58 PM. Dear fourm, i am wondering if anyone can shed some light on this form submission problem with back/forward buttons. long story short: i used to make a form, then submit to a form process php file. errors were difficult to deal with. Thus, many people tell me to submit to the same page. I now submit to the same page. my homepage has a login button. i use a csrf token in a hidden input matched with a session variable. i decided to submit to same page and handle the submit like so: if server request-method = post and isset input name and isset session token then check the token with hash_equals if everything matches then show the login page. i don't have a problem with the form and the form submission processing. everything i fine. now when i use the browser refresh button on the login page, i am sent back to the homepage. all is good. when i press the back button, i go back to the homepage again. super. then i press the forward button in the browser and i get a not connected error. the back button now also shows this error. i tinkered around a bit and added crazy ideas and it worked one time with unset($_POST) as an else to the if mentioned above. the idea is that if server request-method is post without an else. the page is listed below for any get request to process. i assume that the browser is trying to repost data is empty but my if statement should kick it out to the get code, right? what i want is to unset the csrf token and the matching session token for security purposes. i suppose that this breaks the back/forward buttons? how can i get the browser to show the homepage regardless of the post situation? there must be a logical answer. something in my code is breaking this an preventing the browser from simply loading the home page any help is greatly appreciated! Thank you. I am trying to create a order history page. I want it to look something like this: Ordernumber: 12 Products: Product 1 Product 2 Product 3 Product 4 Total: xx Ordernumber: 13 Products: Product 5 Product 6 Total: xx and so on. I have a recordset which get the ordernumbers from my database and i have another recordset which get the products (this recordset has a WHERE clause which is used to get the products associated with its ordernumber. Code: [Select] mysql_select_db($database_lol, $lol); $query_ono = "SELECT DISTINCT ordre.ono FROM ordre WHERE ordre.bruker='{$_SESSION['MM_Username']}'"; $ono = mysql_query($query_ono, $lol) or die(mysql_error()); $row_ono = mysql_fetch_assoc($ono); $totalRows_ono = mysql_num_rows($ono); mysql_select_db($database_lol, $lol); $query_history = "SELECT ordre.vare FROM ordre WHERE ordre.ono='{$row_ono['ono']}'"; $history = mysql_query($query_history, $lol) or die(mysql_error()); $row_history = mysql_fetch_assoc($history); $totalRows_history = mysql_num_rows($history); This is the recordsets. this is my table: +-------+---------------------+------+ | ID | vare | ono | +-------+---------------------+------+ | 1 | Product 1 | 12 | | 2 | Product 2 | 12 | | 3 | Product 3 | 12 | | 4 | Product 4 | 12 | | 5 | Product 5 | 13 | | 6 | Product 6 | 13 | +-------+---------------------+------+ So my question is: How do i do this? list all the records i mean. Thanks Hello everyone, I am having a problem since some time now and need some help. I have created a login page where the user has to input a username and password to login. The username will be put in a session and when the user logs out the session data and session itself gets destroyed. However when I go back in the browser history to the page where I logged in I get the "famous" resend information dialog that asks you to resend the information from the login form. Which means that all the post data gets resend and the user logs in again without having to put in a username and password. Here is my code: Login.tpl: Code: [Select] <!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>Snitch</title> <link rel="stylesheet" type="text/css" href="templates/css/snitch1440x900.css" /> </head> <body> <div id="login-achtergrond"> <div id="login"> <form action="." id="loginform" name="login" method="post"> <input type="hidden" name="actie" value="Login"></input> <input type="text" id="username" name="username" value="" style="opacity:0.7;filter:alpha(opacity=70)"></input> <input type="password" id="password" name="password" value="" style="opacity:0.7;filter:alpha(opacity=70)"></input> <input id="aanmelden" type="submit" name="submit" value="" style="opacity:0;filter:alpha(opacity=0)"> </form> </div> <div id="registreer"> </div> </div> </body> </html> Here is the code of my login page (I created this in a OOP way): Code: [Select] <?php class Handler_Login extends Actie_Handler { function __construct($actie_handle) { parent::construct($actie_handle); $this->actie = $actie_handle; } function secured_handler() { if ($this->session->check_session() == false) { $password = $_POST['password']; $username = $_POST['username']; $login = $this->dbh->Login($username, $password); if ($login == true) { $this->session->set('username', $username); $this->view->displayHome(); $this->view->display(); } else { echo "You are not logged in!"; } unset($_POST['password']); unset($_POST['username']); } if ($this->session->check_session() == true) { $this->view->displayHome(); $this->view->display(); } } } ?> Here is the code of my logout: Code: [Select] <?php class Handler_Loguit extends Actie_Handler { function __construct($actie_handle) { parent::construct($actie_handle); $this->actie = $actie_handle; } function secured_handler() { $this->session->stopSession(); $this->view->displayLogin(); $this->view->display(); } } ?> Here is the code of my session: Code: [Select] <?php class Session { function __construct() { if(!isset($_SESSION)) { session_start(); } } function set($name, $value) { $_SESSION[$name] = $value; } function get($name) { return $_SESSION[$name]; } function stopSession() { $_SESSION = array(); //even though I don't use any cookies someone told me that I had to remove the cookie of the session to completely destroy it? //please tell me if this is correct if (isset($_COOKIE[session_name()])) { setcookie(session_name(), '', time()-42000, '/'); } session_destroy(); } function session_message($naam) { return print_r($_SESSION[$naam]); } function check_session() { if(isset($_SESSION['username']) && !empty($_SESSION['username'])) { return true; } else { return false; } } } ?> this is the code of my view for those who might be interested: Code: [Select] <?php class view_manager { private $tpl; function __construct() { } function displayStatus() { $status = file_get_contents("templates/status.tpl"); $this->tpl = str_replace("%content%", $status, $this->tpl); } function displayLogin() { $this->tpl = file_get_contents("templates/login.tpl"); } function displayHome() { $this->tpl = file_get_contents("templates/home.tpl"); } function display() { echo $this->tpl; } } ?> using a header to redirect to the login page is not going to work since I use my view_manager to display the pages. Does anyone know of any solution to get rid of that stupid resend information dialog without using a header? I tryed unsetting the values of POST in my login code but that did not seem to work. Please help me out I've been looking for an answer for over 1 and a half week so far Is there anyone who knows how to remove the POST data from a form when the user goes back in browser history? If it's not possible, is there any solution except using a header? Like many parents, I'm challenged with keeping my kids from browsing the evil parts of the internet. My son is 11 and my wife caught him deleting IE history the other day. The computer he uses is a Windows 8.1 laptop, and it is not Pro. How can i let him use internet explorer on his own user but keep him from tampering with any of the history ( or settings for that matter)? Is there a better solution? I found some internet history logging software online, but I didn't feel comfortable with the source, and fear it may contain viruses or other malware. I've been looking for one all over the internet and have yet to find one to my exact specifications. I don't even know how I would attempt to make said script since I don't have a database of my own with that type of information stored on it. I basically want to use History.com's This Day In History feed on my website, but I don't like their RSS feed considering it's a giant paragraph of a single article. I'm just looking to post a few random dates and some information like this for example: 1986 > blah blah blah 1990 > blah blah blah 2010 > blah blah blah Any help would be greatly appreciated brethren. Im wondering if i should use jQuery or Php. and how about i would go about doing this. Code: [Select] <?php print "<table border=\"0\" cellpadding=\"0\" width=\"100%\" height=\"100\"cellspacing=\"0\" style=\"border-collapse:collapse\"bordercolor=\"grey\" bgcolor=\"white\" valign=\"top\"> <td align=\"left\" width=\"100%\" onclick=\"I3.location.href='getuserdetail.php?prop=$ownerid'\"><b>Property Name</b></td><td><b>Tenant</b></td><td><b>Property Status</b></td><td>Rent Amount</td>"; $connect = mysql_connect("localhost","root",""); mysql_select_db("magic"); $query = "SELECT * FROM props WHERE ownerid = '$ownerid' ORDER BY name ASC "; $result = mysql_query($query); while($row = mysql_fetch_assoc($result)) { $propertyid = $row['propid']; $propertyname = $row['name']; $propertydesc = $row['description']; $propertycity = $row['city']; $propertystate = $row['state']; $propertyzip = $row['zip']; $active = $row['active']; $lease = $row['lease']; $leaseamt = $row['leaseamt']; if($active == "1"){ $propertystatus = "Active"; } else { $propertystatys = "Unknown"; } print"<tr onMouseOver=\"this.bgColor = '#CEE3F6'\" onMouseOut =\"this.bgColor = '#FFFFFF'\"> <td align=\"left\" width=\"25%\" onclick=\"window.open('viewpropdetail.php?prop=$propertyid','mywindow','width=1200,height=600,scrollbars=1')\">$propertyname</td><td>$ownerfirstname $ownerlastname</td><td>$propertystatus</td><td>$$leaseamt</td> "; } print"</td></table>"; ?> Basically i have a link under that is add property. it pops up a box. with a form you fill it out, and it inserts the record into database. What I'm trying to do. is get it to "Refresh" the property list ( ex. code above). so it shows the new property in the table. i have never used jQuery. but was wondering if i could do that with php. Is there a way to say if records are changed.. update? Hi All (Again) I am looking to pick up variables in jquery from a string created: function search_by() { var search_term = $('#search_for', $(this).attr('value')); alert(search_term); } I cant seem to get the value i am trying to into a "var". This is the code on the page i am using a onClick="search_by();" i.e: <a class="show_cats" search_cat="PDAs & Accessories" search_for="fire" onclick="search_by();" href="#"> I am trying to get the value inside the "search_for" field. Any ideas???? Hey, I have a foreach loop displaying some data from my table, what i need to do is run a Jquery each function on the repeated element so it fadesIn each element one at a time. I am guessing i need to set somesort of interval for this to work. I have been messing with it for a good hour or so now and i cant seem to get it working. Has anyone done this before or seen it done else were? I keep saying I'm going to have to learn javascript and then the library jQuery but find myself learning Swift now instead.
Short one today. I want these two functions to occur back to back. Second function only begins after the first function is complete.
$(function() {
$('.tlt').textillate();
})
$(function() {
$('.tlt1').textillate();
})
If you can please help me with this not only in just code to make that happen but also an explanation of what you did I sure would appreciate it. I've read all morning on promises etc. but have yet to be successful in implementing this.
As you can tell I'm using the plug-in textillate to fade text out one letter at a time. Works great! But I have multiple paragraphs I'm wanting to apply this too so I can't make the div class .tlt since I then lose all paragraphs since it's strips it into spans. That would be ideal of course but I think I forced into making different classes for each paragraph. This will become problematic in the future though since the content is generated dynamically and I will have no idea how many paragraphs that dynamic content will contain. So if there was a way to keep my <p> and </p> that would be even better.
Thanks!
Alright guys, I have a bit of a problem here. I am deleting records using isset($_POST) on the current page but when it submits the records i deleted are still visible. I was thinking of echoing some jquery/ajax to re-load the div that displays the records. Has anyone ever done this before? I dont want the entire page to re-load just that specific area. Hi I am in the process of teaching myself web development, coming from a vb and mssql background. I am building a small page that will display my film library, I just want something quick and simple that gets things working. I have three img tags on my page that display the film posters. The current film and the one previous and next. What I would like is a left and a right arrow that just scroll through the library. I am thinking I need to read the sub folder of D:\movies and story the full path name into an array, and then when the user presses a arrow it moves forward or back. Everything is local and I am unsure about how to handle the event of the left/arrow being pressed. Does PHP handle that kind of event or would Jquery be more suitable or something else completely?? thanks for any pointers. I am trying to limit comments and replies to comments and display an error message once the limit is reached. I have successfully limited comments and comment replies, and successfully provided the error message when prompted ONLY for the comments, and not the comment replies. The comment replies have a little bit of jquery working with them, so that's the only thing I can see that would be causing the message not to display. I have tried other methods then the one currently being used. https://gist.github.com/8972a8343c6fd2b878b1 thanks in advance. Hello all,
So I found this html and jquery example online. Works great if I just copy the below code in a file call test.html and run it from the browser, however if I create a PHP project in netbeans and create a file called index.php and put the same code and the jquery.min.js in the same directory, for some reason it doesn't work. The java script portion give strange behavor. I am new to all these, can someone please help?
<!DOCTYPE html> <!--Code by Chris Youderian, ContactMetrics.com, http://contactmetric...act-form-jquery, Code released under an MIT license, http://opensource.org/licenses/MIT --> <html lang="en"> <head> <script type='text/javascript' src='jquery.min.js'></script> </head> <!-- Styles --> <style> #contact label{ display: inline-block; width: 100px; text-align: right; } #contact_submit{ padding-left: 100px; } #contact div{ margin-top: 1em; } textarea{ vertical-align: top; height: 5em; } .error{ display: none; margin-left: 10px; } .error_show{ color: red; margin-left: 10px; } input.invalid, textarea.invalid{ border: 2px solid red; } input.valid, textarea.valid{ border: 2px solid green; } </style> <!-- JavaScript Code --> <script> $(document).ready(function() { <!-- Real-time Validation --> <!--Name can't be blank--> $('#contact_name').on('input', function() { var input=$(this); var is_name=input.val(); if(is_name){input.removeClass("invalid").addClass("valid");} else{input.removeClass("valid").addClass("invalid");} }); <!--Email must be an email --> $('#contact_email').on('input', function() { var input=$(this); var re = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/; var is_email=re.test(input.val()); if(is_email){input.removeClass("invalid").addClass("valid");} else{input.removeClass("valid").addClass("invalid");} }); <!--Website must be a website --> $('#contact_website').on('input', function() { var input=$(this); if (input.val().substring(0,4)=='www.'){input.val('http://www.' input.v...substring(4));} var re = /(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])?/; var is_url=re.test(input.val()); if(is_url){input.removeClass("invalid").addClass("valid");} else{input.removeClass("valid").addClass("invalid");} }); <!--Message can't be blank --> $('#contact_message').keyup(function(event) { var input=$(this); var message=$(this).val(); console.log(message); if(message){input.removeClass("invalid").addClass("valid");} else{input.removeClass("valid").addClass("invalid");} }); <!-- After Form Submitted Validation--> $("#contact_submit button").click(function(event){ var form_data=$("#contact").serializeArray(); var error_free=true; for (var input in form_data){ var element=$("#contact_"+form_data[input]['name']); var valid=element.hasClass("valid"); var error_element=$("span", element.parent()); if (!valid){error_element.removeClass("error").addClass("error_show"); error_free=false;} else{error_element.removeClass("error_show").addClass("error");} } if (!error_free){ event.preventDefault(); } else{ alert('No errors: Form will be submitted'); } }); }); </script> <body> <form id="contact" method="post" action=""> <!-- Name --> <div> <label for="contact_name">Name:</label> <input type="text" id="contact_name" name="name"></input> <span class="error">This field is required</span> </div> <!-- Email --> <div> <label for="contact_email">Email:</label> <input type="email" id="contact_email" name="email"></input> <span class="error">A valid email address is required</span> </div> <!--Website --> <div> <label for="contact_website">Website:</label> <input type="url" id="contact_website" name="website"></input> <span class="error">A valid url is required</span> </div> <!-- Message --> <div> <label for="contact_message">Message:</label> <textarea id="contact_message" name="message"></textarea> <span class="error">This field is required</span> </div> <!-- Submit Button --> <div id="contact_submit"> <button type="submit">Submit</button> </div> </form> </body> </html> i have two scripts i am using in one file. one is for an image slider and the other is a drop-down menu. both jquery driven. one seems to break the other. if i remove the first line of code from one script (
jQuery.noConflict()), it seems to fix the problem and both scripts work. can someone explain to me what is going on? :/ fyi, i tried renaming variables for one script, hoping their was a naming conflict but that didnt work for me either.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="initial-scale=1" /> <!-- Apple mobiles -->
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content = "<?php echo $keywords; ?>" />
<meta name="description" content="<?php echo $description; ?>" />
<title><?php echo $page_title; ?></title>
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="bmw_styles.css" />
<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/flexdropdown.css" />
<!-- homepage slider -->
<link rel="stylesheet" type="text/css" href="slider/css/default.css" />
<link rel="stylesheet" type="text/css" href="slider/css/component.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>-->
<script type="text/javascript" src="scripts/global.js"></script>
<!-- navigation -->
<script type="text/javascript" src="scripts/flexdropdown.js"></script>
<!-- homepage slider -->
<script src="slider/js/modernizr.custom.js"></script>
<script src="slider/js/jquery.cbpFWSlider.js"></script>
<!-- initialize jquery when the DOM is ready -->
<script type="text/javascript">
$( function() {
$( '#cbp-fwslider' ).cbpFWSlider();
$( '#cbp-fwslider' ).cbpFWSlider('interval');
} );
</script>
</head>
I am using this to open contents into a modal window, but in the process I am passing it through loop.php to check if the page exists and then load. Is there a way to completely skip the loop.php file and load my clicked link?
$(document).ready(function(){
///////LINK in a Modal Window////////
$('#all').delegate('a.pop-lnk', 'click', function(){
var page = $(this).attr('id');
$('#gr-out').css({ opacity: 0.7, 'width':$(document).width(),'height':$(document).height()}).show();
$('#popup').css({'display': 'block'});
$('#popup').load("../help-file/loop.php?page="+ page);
});
});
The id attr I am getting from this code is my page's name but I need to add the .php extension if is possible so I can load the page.
Edited by Pavlos1316, 18 November 2014 - 03:04 PM. |
|||||||