I am creating a mobile app that displays a "students" classes. For example, a list is generated on a jQm page ("entity_list") which when clicked will take them to another section on the same page where it will pull a list of information regarding that list. This is done via an id embedded in the url like so:
'.$class['title'].'
When clicked this code is used to extract that information:
$("a[href=#entity]").live("click",
function(e) {
navIdentity = $(this).data("identity");
$.post("entity.php", { entity_id: navIdentity} );
$("#entity").page();
}
);
The problem I am facing is that I can't then extract that id to then load more via php.
Does ANYONE know if theres a better way or how to fix this. Thanks a bunch!
How about this?
navIdentity = $(this).attr("data-identity");
Will it work?
There is probably an issue with the selector. Yours is
$("a[href=#entity]")
I assume you need to add quotes, like this
$("a[href='#entity']")
See the jQuery API at http://api.jquery.com/attribute-equals-selector/
Related
Hello, I am making a jQuery YouTube search and display web application and I need to send the link of a specific video to the database using PHP.
In the application, the user searches for a video and the unique code for that video gets inserted into a set YouTube link using an "id" variable. I want to capture the full link (including the unique id) and put it into the database without having to open a new page (which is how AJAX does it, I think).
Here are links to some similar problems, but they haven't worked for me. (getting youtube video id the PHP, How do I find all YouTube video ids in a string using a regex?, https://stackoverflow.com/questions/19977278/how-to-get-php-data-in-javascript, Data transfer from JavaScript to PHP, http://www.webdeveloper.com/forum/showthread.php?249863-pass-jquery-value-to-php-variable (sorry for the massive amount of links, Stack told me to include them if they were similar and didn't work))
Here is the code that makes it work so far.
<script type="text/javascript">
//on thumbnail click
$videoDiv.click(function(e) {
displayVideo(entry.media$group.yt$videoid.$t, entry.title.$t);
});
//Display the video
function displayVideo(id, title) {
//embed player
swfobject.embedSWF('http://www.youtube.com/e/' + id + '?enablejsapi=1&playerapiid=ytplayer&autoplay=1',
'video-placeholder', '544', '408', '9.0.0', null, null, { allowScriptAccess: "always" },
{ id: "youtubevideo" } );
}
</script>
Obviously, this isn't the whole function, but hopefully it should be enough.
Please help me, I've run out of places to look.
Hi Niklas,
Thank you for answering me, I’ve tried that out and it turns out that my code is a bit more complicated to allow for that.
My project for university also needs to have information sent to the page that the video is on, currently I have the form for the user on one page and the code to search YouTube and display the user’s information as well as the video on the next (external) page.
Unfortunately AJAX is still one of the languages I haven’t yet learnt, so the documentation you linked me to didn’t make much sense.
My code is very complicated as it uses the YouTube API as well as JavaScript, jQuery and PHP. The main js file for this searches YouTube and once the user clicks on the thumbnail, it fires up a displayVideo function, which also features the information from the previous page.
I can’t redirect the user to a new page after they select the video, just to get the id into PHP, because that would wipe the data from the first form when the user gets redirected back to the YouTube form.
I’m hoping you could please assist me.
Answer
Okey, know I understand what you're asking. That you would do something like this:
<script type="text/javascript">
$(function() {
//on thumbnail click
$videoDiv.click(function(e) {
var videoURL = displayVideo(entry.media$group.yt$videoid.$t, entry.title.$t);
$.post('url-to-your-php-file', {videoURL: videoURL}, function(response) {
// Do stuff with the response given/echoed by the PHP file
});
});
//Display the video
function displayVideo(id, title) {
//embed player
var videoURL = 'http://www.youtube.com/e/' + id + '?enablejsapi=1&playerapiid=ytplayer&autoplay=1';
swfobject.embedSWF(videoURL,
'video-placeholder', '544', '408', '9.0.0', null, null, { allowScriptAccess: "always" },
{ id: "youtubevideo" } );
return videoURL;
}
});
</script>
Hope this helps and good luck!
Answer before revised question
I won't write the code for you, but you're right in your thinking and I will give you some links that may help. You need to make an AJAX call to a PHP file which saves the link to the database.
AJAX Call
You're using jQuery, which makes AJAX calls real easy. Have a look at the jQuery .ajax() documentation. Though in this case it being a really small and "unadvanced" call you need to make, the shorthand wrapper function .post() will do nicely for you.
Retrieve the link in PHP
After that you can retrieve the link in the PHP using the global $_POST variable.
Adding the link to the database
For adding it to the database, I would recommend the PHP PDO library for making the connection and queries.
Hope this helps and don't hesitate to ask if there's anything you wonder!
I thought this would be really simple but obviously after a couple of days trial and no success I have to ask the people to help, looked everywhere.
right im basically creating a php template without much guidance on the foundation 4 framework with is a responsive framework. Now this framework is rather basic and so to add page transitions ive had to use jquery to do what i believe is an ajax call to take "content" from another page and display it on the template page index.html
for which I am currently using the following
<script>
$(document).ready(function() {
$('nav.top-bar > section.top-bar-section > ul.right > li > a').click(function() {
var toLoad = $(this).attr('href')+' #content';
$('#content').hide(1000,loadContent);
$('#load').remove();
$('#main_wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('fast');
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-0);
function loadContent() {
$('#content').load(toLoad,showNewContent);
}
function showNewContent() {
$('#content').show(1000,hideLoader);
}
function hideLoader() {
$('#load').fadeOut('fast');
}
return false;
});
});
</script>
NOW before i changed over to using ajax and jquery i was operating the menu "active" class and the page name with a simple variable set on each page in the first line listed as $page='' and then the page name
now that im loading the content with ajax even if i include this variable in the content of the new page it will not update in either the or the menu title
im very sorry i dont write things correctly im new to this forum thing
thank you for the help in advance
:) I prefer someone to explain what i need to do and how to do it rather than just copy and pasting code as im a learner :)
You probably want to load the page and parse the result in jQuery to get the new page’s <title> tag and set the requesting page’s <title> tag.
The only thing I’d ask is: why are you doing this? Are you just wanting AJAX page navigation in your website instead of the traditional propagating navigation?
I am only able to answer one part of your question due to extreme confusion, so:
First off, here's why your url changes:
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-0);
You are modifying it with that line. That line, however, has an interesting little quirk:
attr('href').length-0
at the end. Why the -0? That would make no difference. I'd clean it up.
Outside of that, I'm incredibly confused with what you're asking so let me try rephrasing it and you can tell me what I'm missing.
You want to have a user click on a navigation link, and load that link's content via an AJAX call using jQuery, and then replace the content on the page with the newly loaded page, correct?
When you say "right on top main page i have variable $page = then the page name", what do you mean by "main page"? Do you mean it's a line of text in HTML? Part of a script that you haven't included here? Part of your PHP code?
And then you say "ive tried including the tag in a div that changes along with the above content"- what is "the tag"?
By reading this 4 or 5 times I could barely discern the above understanding of what you're trying to do.
Please make heavy edits to you question- it's incredibly hard to understand.
Lastly, why are you trying to replace the browser's functionality of a user clicking a link and loading content? That's what the browser is for. The browser also, conveniently, has a loading indicator in the url bar usually (or some form thereof), letting the user know the content is still loading.
function loadContent() {
$('#content').load(toLoad,showNewContent);
}
So first off, look at the jQuery doc for the load method:
http://api.jquery.com/load/
Your issue is that it is calling for three arguments, and you are passing two. If there are multiple arguments listed and you only want to pass SOME of them, you still need to supply a null value for the ones you want to "skip". Try changing your call to this:
function loadContent() {
$('#content').load(toLoad, null, showNewContent);
}
You'll notice that I'm passing "null". If that doesn't work, pass an empty string, like this:
function loadContent() {
$('#content').load(toLoad, "", showNewContent);
}
That second argument is data to be passed with the request. It's the THIRD argument that you list as your callback, which as far as I can tell is where you're making the mistake.
I was wondering if this was possible to do. I know you can pull a html file and put it on your page like this, <a href='index.php?content=Contact.html'> . Is there someway to pull a webpage from a URL to your site. So instead of a link open in another tab, it would open that webpage on your current site page. If it's not possible, is there some sort of similar solution I can use.
You can use the iframe tag to display other web pages inside your own web page.
When you say:
I know you can pull a html file and put it on your page like this, <a href='index.php?content=Contact.html'>
Actually, that's not a normal feature - it's only a function of whatever index.php file is on your server, and simply displaying content referenced by a GET parameter can actually quite dangerous depending on whether you know what to protect against and how.
I guess it depends on how "embedded" in to your site you wish for it to be, but it sounds like you could use iframes.
If you want to load an external website into your site, have a look at iframes [docs].
If you want to update parts of the page with content coming from your domain and without refreshing the whole page, you can use Ajax.
Yes, it is possible. You can use AJAX to get the other file and then set the .innerHTML property of your div to the loaded content. In the simplest way, with jQuery you'll have something like this:
var data = jQuery.get("http://my.domain.com/file.html")
$('#mydiv').html(data);
you could use jquery's load() function. i would do it something like this:
$(document).ready(function () {
$('a').click(function (e) {
e.preventDefault();
$('#myDiv').load($(this).attr('href'));
}
}
Is there any way to prevent users from copying content from website and display encrypted code in view source?
I know that techies will always find a way but if it prevents normal users it's OK.
Check out ionCube HTML Obfuscator:-
http://www.ioncube.com/html_encoder.php
As of the text contents, Try this code:- Live Demo (IE isn't supported)
<script type="text/javascript">
document.oncopy = function(){
var bodyEl = document.body;
var selection = window.getSelection();
selection.selectAllChildren( document.createElement( 'div' ) );
};
</script>
Given the tags you used:
PHP is server-side code, and your end-users will never see your code
HTML cannot be hidden from end-users
Javascript and jQuery cannot be hidden either, but they can be obfuscated by 'minifying' the code. Typically this is done using a program like JSmin (online tool available at http://jscompress.com/)
No, there is not.
Even if you could encrypt the source, the browser still needs to create the DOM structure which can be re-serialised
as readable HTML.
No, there is not. The user will always be able to access the data sent to the browser. Encryption doesn't help here, because the data has to be decrypted at some point in order to be displayed on the screen.
For a laic user you can block right click event, ctrl+c, ctrl+insert key events on window. But for a more advanced user, there is no way you can block the content from being copied if you are using HTML. Flash would solve it, but who still uses flash for content, right?
For images, overlaying the image with a clear element so that you can't just right click and copy will stop some users.
It is possible to use flash or adobe objects (.swf / .pdf) to display content
You can use these tags ..
//$("body").css("-webkit-user-select", "none");
//$("body").css("-moz-user-select", "none");
//$("body").css("-ms-user-select", "none");
//$("body").css("-o-user-select", "none");
//$("body").css("user-select", "none");
I have a site that has voting on the front page node, and I need to update a view on the same node after each vote. I'm currently using the following code in my page.tpl.php
<script type="text/javascript">
function fivestarResult(voteResult) {
$('div#fivestar-summary-'+voteResult.vote.id).html(voteResult.result.summary);
window.location = "http://www.mydomain.com/";
};
</script>
Is there a way to directly refresh the view instead of refreshing the whole page? I'm not very good in javascript so I'm a little lost.
An idea i may do in this kind of situation is to Ajax call the view again and render it inside the page again via JQuery on click event.
take this example , i guess this will clarify more
Drupal 6: Render Views 2 data in a page tpl file
Thanks Rabe,
That sounds like it should work. I tried it a few different ways but couldn't get it to ...
Is there something obvious I could be missing from this code (in page.tpl.php)?
<script type="text/javascript">
function fivestarResult(voteResult) {
$('div#fivestar-summary-'+voteResult.vote.id).html(voteResult.result.summary);
<?php
$name = "comparison_view";
print views_embed_view($name, $display_id = 'default');
?>
};
</script>
Thanks a lot for the help
Like many things in Drupal, there may be a module already written to do this. Ajax views refresh sounds very promising!
I have spent countless hours debugging a view only to realize I had caching enabled and was looking at old results. The caches for different user groups are separate as well. So you may need to manually flush cache to get this to update, which might be a challenge with Ajax.