Linking jquery functions to PHP query results

Using PHP I am retrieving a list of videos. I am using jquery to display the video in an overlay. I have everything working, but the problem is the method of implementation seems a little brute force to me and I am looking for a way to cut out the redundant code.Basically I get a list of videos from …

via PHP Website Development » Search Results » ajax:

Linking jquery functions to PHP query results

Using PHP I am retrieving a list of videos. I am using jquery to display the video in an overlay. I have everything working, but the problem is the method of implementation seems a little brute force to me and I am looking for a way to cut out the redundant code.
Basically I get a list of videos from the database and output those using a foreach loop to the screen. I use the ID of the video to make the like link id for each result unique:
” …I then have to add the jquery to each iteration of the loop. Its an ajax call that passes the information about the video, the current user, etc. If the current user votes for a video then the jquery ajax function is called and a new vote count is displayed:
//upVote for a discussion
$(‘#like‘).click(function()
$.ajax(
type:”POST”,
url:’/ajax/likeFile.php’,
data:”voter=” +
+ “&poster=” +
+ “&classID=” +
+ “&lessonID=” +
+ “&id=” +
+ “&type=like”,
success: function(data)
var $response=$(data);
var votes = $response.filter(‘#voteCount’).text();
$(‘#fileVotes’).text(votes);
$(‘#like’).attr(‘src’, ‘/images/upvoteDisabled.png’);
$(‘#unlike’).attr(‘src’, ‘/images/downvote.png’);

});
});Like I said, this is working fine. The problem is that I would like to cut down on repeating the jquery over and over for each link. Is there a way to call this and just have the item that gets selected pass its current loop iteration variables instead of having create a jquery function for each link?
This is a really convoluted question I know. Thanks in advance to anyone who wants to tackle this.
……………………………………..

First, set an HTML5 DOCTYPE so you can take advantage of custom data attributes:
Then have PHP populate your data attributes for each anchor:
Then, you can:
$(‘a.like’).click(function()
$.ajax(
type:”POST”,
url:’/ajax/likeFile.php’,
data:”voter=” + isset($_SESSION[‘user_id’]) ? $_SESSION[‘user_id’] : ”); ?>
+ “&poster=” + $(this).data(‘userID’)
+ “&classID=” +
+ “&lessonID=” +
+ “&id=” + $(this).data(‘fileID’)
…Prefixing the attribute with data- will make it HTML5 forward-compatible, and if you need to validate for previous versions of XHTML, just extend the DTD:
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”
[


]>

……………………………………..

Give a class to all elements upon which vote up function should be triggered on clicking. Then it would be something like
e.g. that is an anchor element with voteup class
$(‘.voteup’).click(function()
var fileid = $this.attr(‘id’);
//update $video[‘fileid’] with fileid
//the code to update a specific class element can be implemented with this approach as well
)

……………………………………..

Instead of generating the JavaScript code on the fly, generate a PHP array, transform it to a native JavaScript data type using json_encode(). In JavaScript you loop trough the data binding the click event. It will be easier and you won’t need to create special HTML markup.

For more info: Linking jquery functions to PHP query results

PHP Website Development » Search Results » ajax

Linking jquery functions to PHP query results

Share this post:

Related Posts

Leave a Comment