Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I have added the Ajax since you last looked at, as well as modify other code a little. Like returns in php and loading gif for html and rest of ajax. Hope this helps! when you comment, you should include '@'+'tumharyyaaden' so that stackexchange shows me update, if you have questions ofc.</p> <p>PHP: save as process.php</p> <pre><code>&lt;?php require('../db.php'); $url= NULL; if(isset($_POST['a'])) { $url = mysql_real_escape_string($_POST['a']); } function Visit($url) { $agent = "Mozilla/4.0 (compatible; MSIE 5.01; Windows NT 5.0)";$ch=curl_init(); curl_setopt ($ch, CURLOPT_URL,$url ); curl_setopt($ch, CURLOPT_USERAGENT, $agent); curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt ($ch,CURLOPT_VERBOSE,false); curl_setopt($ch, CURLOPT_TIMEOUT, 5); $page=curl_exec($ch); //echo curl_error($ch); $httpcode = curl_getinfo($ch, CURLINFO_HTTP_CODE); curl_close($ch); if($httpcode&gt;=200 &amp;&amp; $httpcode&lt;300) { echo '&lt;span class="up"&gt;'.$httpcode.'&lt;span class="icon"&gt;&lt;img src="images/info.png" alt="website is up"/&gt;&lt;/span&gt;&lt;/span&gt;'; exit; } else { $httpcode=404; $date = date("l, j \of F Y \@ H:i"); $to = "someone@domain.com"; $subject = "Urgent: $url is down"; $message = "Hello,\n\nIt appears that on our latest check of $url on $date that the site was down.\n\nRegards,\nWeb Checker"; $headers = 'From: noreply@webchecker.co.uk' . "\r\n" . 'Reply-To: noreply@webchecker.co.uk' . "\r\n"; mail($to, $subject, $message, $headers); echo '&lt;span class="down"&gt;'.$httpcode.'&lt;span class="icon"&gt;&lt;img src="images/info.png" alt="website is down"/&gt;&lt;/span&gt;&lt;/span&gt;'; exit; } } if(!empty($url)){ Visit($url); exit; } ?&gt; </code></pre> <p>HTML:</p> <pre><code>&lt;ul id="site-list" class="list"&gt; &lt;li class="title"&gt; &lt;span class="id"&gt;&lt;/span&gt; &lt;span class="name"&gt;Title&lt;/span&gt; &lt;span class="url"&gt;URL&lt;/span&gt; &lt;span class="status"&gt;HTTP Status&lt;/span&gt; &lt;/li&gt; &lt;?php // some PHP to fetch all the gig entries from the shows table $sql = "SELECT * FROM `check`"; $query = mysql_query($sql) or die(mysql_error()); // a loop to place all the values in the appropriate table cells while ($row = mysql_fetch_array($query)){ //begin the loop... $id=$row['id']; $name=$row['name']; $url=$row['url']; ?&gt; &lt;li class="websites"&gt; &lt;span class="id"&gt;&lt;?php echo $id; ?&gt;&lt;/span&gt; &lt;span class="name"&gt;&lt;?php echo $name; ?&gt;&lt;/span&gt; &lt;span class="url"&gt;&lt;?php echo $url; ?&gt;&lt;/span&gt; &lt;span class="status http-status"&gt;&lt;img src="images/spinner.gif"/&gt;&lt;/span&gt; &lt;/li&gt; &lt;?php } ?&gt; &lt;/ul&gt; &lt;br /&gt; &lt;a href="#" id="check" class="button"&gt;Check Now&lt;/a&gt; </code></pre> <p>jQuery:</p> <pre><code>$('#check').click(function(){ $('.http-status').html('&lt;img src="images/spinner.gif"/&gt;'); $('#site-list li.websites').each(function(){ var newurl = $(this).find('span.url a').attr('href'); $.ajax({ type: "POST", url: "process.php", data: ({"a":newurl}), cache: false, success: function(message){ $(this).find('li.status').html(message); } //End AJAX return }); //End AJAX call }); //End li each }); //End Check $('#check').click(); </code></pre> <p>Explanation: Sorry i didn't get to comment the code, but basically, three pieces to it, two php's one that will generate the html, one that will check and return status and last bit is JS which will send requests via AJAX so your page doesn't have to refresh on every check click. </p> <p>UPDATE: 2011/08/25</p> <p>It seems odd to me that your current code (namely JS) doesn't resemble anything of what i provided. What i have above is entire construct of your page. So i would say consider adopting at least the JS from above and modifying it to fit your other needs rather than to try and fix your current code which i would say has too many things wrong with it. Anyhow, lets look at your code:</p> <p><strong>Your code</strong></p> <pre><code>$('#check').click(function(){ $('#site-list li').each(function(){ var li=$(this); if(!li.hasClass('title')) { $('span.status',li).html('&lt;img src="images/loader.gif" alt="" /&gt;'); $.post('process.php',{ url:$('span.url',li).text(), id:$('span.id',li).text()}, function(response) { $('span.status',li).html(response.data); $('span.status',li).simpletip({fixed:true,position:'right',offset:[5,0],content:response.message}); var tooltip=$('span.up',li).eq(0).simpletip(); if(response.up){ $('span.up img',li).attr('src','images/activity_monitor.png'); tooltip.update('Site is Up');} else{ $('span.up img',li).attr('src','images/activity_monitor_warning.png');tooltip.update('Site is Down');$('span.status span',li).css('color','red'); } },'json'); } }); return false; }); </code></pre> <p>So, first, 1). you are missing the <code>$('#check').click();</code> which currently prevents loading or the status from showing up properly on page load. Meaning, that bit of code is not optional for you.</p> <p>Second 2). Your selectors and process of selecting are very inefficient.</p> <pre><code>$('#site-list li').each(function(){ var li=$(this); if(!li.hasClass('title')) { </code></pre> <p>Above, your first selector should have been <code>$('#site-list li.websites').each(</code> so you wouldn't need to run unnecessary checks on Title class list nor will have to run second check separately on excluding the title class for entire list. When doing these sorts of inefficient checks under <code>each()</code> it causes so many unnecessary calls that shouldn't made.</p> <p>Third 3). You are unnecessarily complicating the script by using your selector style, choice of tooltip plug-in and by using .post instead of .ajax. For tooltip, use something like tiptip tooltip, it's light weight, very easy to use but customizable, full of features and will vastly simplify your script. .ajax is cleaner, more transparent and easier hence reduces potential for conflicts. Also, use actual CSS styles and properties for formatting document, not JS. So again, I like the code that's cleaner, simpler, more transparent and most of all, more efficient, so again, if you need help customizing my code to your needs, i can help. But as your code currently stands, i can not say which part is wrong since too much seems wrong to me. </p> <p>Forth 4). I don't mean to be rude or to offend you but personally i can not stand the way the current JS code stands. So please don't take this personally, it's just matter of preference more than anything else. That said, i can help you in changing my original answer to better suit your needs. </p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload