dolythgoe
asked on
jquery $.get request on mouseover
Hi all,
I'm looking to get some dynamic date into the jquery get request.
I have a page which can will output a series of <div>'s like so:
What I'm trying to do is work out the best way to write unique data into each div that can be included in a jquery get request everytime a user hovers over the div area.
For example:
Goes into:
Please could someone give me a hand on:
- The best way to package the data in the <div>
- A method of detecting hover state and making the get call with the data
Huge thanks
I'm looking to get some dynamic date into the jquery get request.
I have a page which can will output a series of <div>'s like so:
<div class="resultset">
<div>
<div class="resultset">
<div>
<div class="resultset">
<div>
...so on..
What I'm trying to do is work out the best way to write unique data into each div that can be included in a jquery get request everytime a user hovers over the div area.
For example:
<div class="resultset">
//Some non visible data
<div>
Goes into:
$.get("resulthover.php",{
//data
},
function(data) {
//do something
}
);
Please could someone give me a hand on:
- The best way to package the data in the <div>
- A method of detecting hover state and making the get call with the data
Huge thanks
ASKER
HUGE thanks :)
If I don't have an id for the <div> since they're dynamically loaded and multiple (so the script can't know what the id is) would I need to do this inline?
If I don't have an id for the <div> since they're dynamically loaded and multiple (so the script can't know what the id is) would I need to do this inline?
You can use the class name instead of Id of div...but it should be different for each for getting the values.
you can use the js code as inline using <script type="text/javascript"></s cript> or link the js file
Please refer the below modified code.
Thanks
you can use the js code as inline using <script type="text/javascript"></s
Please refer the below modified code.
Thanks
// js -- inline or link
$(document).ready(function(){
$(".somedivclass").mouseover(function(){
divval = $(".somedivclass").val();
var dataString="divval"+divval;
$.ajax({
type: "POST",
url: "resultthrover.php",
data: dataString,
cache: false,
success: function(html)
{
$(".anotherdivclass").html(html);
}
});
});
});
// resulthrover.php
<?php
if($_REQUEST){
if($_REQUEST['divval']){
echo "Some data/information";
}
}else
echo "";
?>
You can use the $(".somedivclass").each for mulitple named class for the div.
thanks
thanks
// js -- inline or link
$(document).ready(function(){
$(".somedivclass").mouseover(function(){
$(".somedivclass").each(fucntion(){
divval = $(".somedivclass").val();
var dataString="divval"+divval;
$.ajax({
type: "POST",
url: "resultthrover.php",
data: dataString,
cache: false,
success: function(html)
{
$(".anotherdivclass").html(html);
}
});
});
});
});
ASKER
That's really neat! Thanks
Sorry, one last little thing :) - where your code goes:
Can that be a child element that I keep hidden?
Could I even do something like:
Use CSS to hide it I guess...
Sorry, one last little thing :) - where your code goes:
divval = $(".somedivclass").val();
Can that be a child element that I keep hidden?
Could I even do something like:
<div class="result">
//Some stuff
<div class="data">datastring</div>
</div>
Use CSS to hide it I guess...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks for all your help!
You can use type as GET/POST.
Hope that helps.
Thanks
Open in new window