PHP & jquery
Author
Discussion

anonymous-user

Original Poster:

85 months

Wednesday 11th March 2020
quotequote all
Is this even possible to do?! I have this code :-

$(document).ready(function(){
setInterval(function(){

$("#flow").load(location.href + " #flow");


}, 10000);
});

In the PHP each div contains "flow" with a unique ID tagged on so flowID123 in my example.

I can get the first part to work , so after the refresh the page updates but obviously it is finding all divs that contain "flow" & then displaying it again (hope this makes sense, I've confused myself big time here!). What I think I need is this :-

$("#flow-ID123").load(window.location.href + " #flow-ID123" );

Is it even possible to link these two parts together via the ID123 part? If yes what code is required?!

Thank you for any idea's/help smile

Edited by Dave_ST220 on Wednesday 11th March 13:13

droopsnoot

14,741 posts

273 months

Wednesday 11th March 2020
quotequote all
I was under the impression that by using the # selector, you are specifying the ID. So it appears that if you only put part of the ID, perhaps it's updating all that match, so by specifying a full ID you would limit it to only working on that ID. (I haven't done much jQuery, that might be clear).

Dave_ST220 said:
I can get the first part to work , so after the refresh the page updates but obviously it is finding all divs that contain "progress" & then displaying it again (hope this makes sense, I've confused myself big time here!)
How is that code looking for anything that contains "progress" ? Or did you mean "anything that contains 'flow'" ?

For this bit

$("#flow-ID123").load(window.location.href + " #flow-ID123" );

Are you wanting to re-load the page and move focus directly to a specific part, like a normal href to an "<a name=" tag?

I suspect I haven't understood what you want to do here.

Edited by droopsnoot on Wednesday 11th March 13:15

anonymous-user

Original Poster:

85 months

Wednesday 11th March 2020
quotequote all
Sorry, typo! Was on the phone when typing. Corrected wink

droopsnoot

14,741 posts

273 months

Wednesday 11th March 2020
quotequote all
If you're hoping to load just the contents of the id #flow-ID123 within your href page, I don't think that's going to work.

Maybe you could have your href page take the id as a parameter and only return the information for that specific id? So the page would need to be produced by PHP or some other server-side language.

$('#flow-ID123').load("info.php?id=123")

and have info.php get the ID from $_GET['id'] and just return the html for that id.

anonymous-user

Original Poster:

85 months

Wednesday 11th March 2020
quotequote all
I'm trying to update an html table on a PHP page without refreshing the page. So for example I have this :-

<td><div id="flow">'.$row['flow'].'</td>

The database is updated by a website visitor so that code is always current, the page the above code is on is a backend page. If I manually refresh the page the info in "flow" obviously updates, however I don't want to have the whole page refresh (which would be easy) just certain elements. Someone else said this :-

"If you're going to do this, do it right: use AJAX and JSON to get (1) all of the data (2) at the same time (3) without tons of wasted bytes. You make/update your PHP script so that it is capable of returning a JSON object with the flow, keeping in mind that you only need to return data that may actually change. Then use your setInterval to get that data, pull out the bits of it, and update the elements on the page."

Which sounds all well and good but I haven't a clue how that would be done (I'm not a corder & unfortunately it doesn't justify paying someone hundreds to code this as it's just not worth it).

If it was just a single div (or any element for that matter) it would be easy........

TangoAlpha

1,175 posts

285 months

Wednesday 11th March 2020
quotequote all
index.html

$(document).ready(function() {
setInterval(function() {
$("div.flow").each(function(index, element) {
$(element).load("info.php?id="+element.id);
});
}, 10000);
});

<div class="flow" id="flow-123"></div>
<div class="flow" id="flow-124"></div>
<div class="flow" id="flow-125"></div>

info.php

<?php

echo 'This div has the id ' . $_GET['id'];

?>

anonymous-user

Original Poster:

85 months

Wednesday 11th March 2020
quotequote all
[redacted]

anonymous-user

Original Poster:

85 months

Wednesday 11th March 2020
quotequote all
TangoAlpha said:
index.html

$(document).ready(function() {
setInterval(function() {
$("div.flow").each(function(index, element) {
$(element).load("info.php?id="+element.id);
});
}, 10000);
});

<div class="flow" id="flow-123"></div>
<div class="flow" id="flow-124"></div>
<div class="flow" id="flow-125"></div>

info.php

<?php

echo 'This div has the id ' . $_GET['id'];

?>
Thanks, my head is fried but I'll give it a gosmile

anonymous-user

Original Poster:

85 months

Wednesday 11th March 2020
quotequote all
TangoAlpha, I've dropped you a PM wink Thanks

TangoAlpha

1,175 posts

285 months

Thursday 12th March 2020
quotequote all
Dave_ST220 said:
TangoAlpha, I've dropped you a PM wink Thanks
Replied via your email address.