-4

I just almost completed designing of my Page Rank Checker Site...! Now I just want one functionality but I am confused...I have almost created the Page Rank Script working fine..but I want that If someone start typing I.e entering site address in html Input and as soon as he completes the site address so automaticaly without clicking on submit button the result should show..just beneath the input without page loading....! I am quite sure..that It can be achieved with javascript..so if you people guide me in the right way please?

I will do it then myself..!

Here is my ideal site like how I want : http://www.prchecker.net/

And Here is my Page Rank Script : http://www.huntedhunter.com/pr_checker/

And Here is my PR Checker Designed site : http://www.prchecker.biz/

Waiting for your replies..!

Umair Shah
  • 2,305
  • 2
  • 25
  • 50

2 Answers2

0

You'll want to employ AJAX to achieve dynamic loading of content into your page without the need to reload it.

You can check out the basics here: http://www.w3schools.com/ajax/ajax_intro.asp

Edit, to help you getting started:

You will need a function like this, which creates the AJAX request:

<script>
    function load()
    {
        var xmlhttp;

        if (window.XMLHttpRequest)
          {
              // code new browsers
              xmlhttp=new XMLHttpRequest();
          }
        else
          {
              // code for old ones
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }

        xmlhttp.onreadystatechange=function()
          {
            // if request finished & successful
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    // do stuff
                    // most likely you will need to make use of 
                    // xmlhttp.responseText
                    // or
                    // xmlhttp.responseXML
                }
          }

        // initialize url with the service you want to query. 
        var url;
        xmlhttp.open("GET",url,true);
        xmlhttp.send();
    }
</script>

However, because your post lacks information regarding your data source we can't tell you any more specifics.

Just read some tutorials regarding AJAX and I'm sure that you'll make quick progress. And remember, AJAX is asynchronous! This means that you will most likely need to make use of callback functions.

daZza
  • 1,669
  • 1
  • 29
  • 51
  • An example of AJAX and PHP: [http://stackoverflow.com/q/5298401](http://stackoverflow.com/q/5298401) – patstuart May 15 '14 at 19:24
  • Thanks for your answer and learned from there and got created this check please...! http://www.huntedhunter.com/pr_checker/ – Umair Shah May 15 '14 at 19:57
  • Doesn't look too bad for a start. What you probably want to have a closer look at are "AJAX live search" tutorials like http://www.w3schools.com/php/php_ajax_livesearch.asp or http://ninetofive.me/blog/build-a-live-search-with-ajax-php-and-mysql if you prefer jQuery – daZza May 15 '14 at 21:30
0

Actually, what @Blazemonger says is pretty accurate. But, even trying to help you, we can't do much with the info you provided. I'll try to narrow it down so your reading becomes lighter. As they said, you'll need AJAX for the PHP execution. About when to execute that AJAX, it's a little trickier. To execute something as soon as someone finishes typeing is hard to achieve. You can try using the On KeyUp event. This means that, as soon as you release a key, having the focus on the desired input, the AJAX call will trigger. That's not a good idea (you'll have too many calls to you PHP webservice), so you'll surely want to validate the url entered. So, I'll leave you a sketch of what I think you should do, and some references to documentation:

$(input).keyup(function(){
    if(isValidURL(input.val()) {
        $.ajax( <bunch of parameters> );
    }
});

With that, read about jQuery Ajax and jQuery keyboard events

Hope it helps!

Hige
  • 144
  • 5
  • Thanks for your answer and learned from there and got created this check please...! I used w3schools and did this... http://www.huntedhunter.com/pr_checker – Umair Shah May 15 '14 at 19:59
  • It seems to be working, but I'd strongly recommend you to filter some calls and keys. For example, filter when the arrow keys are pressed, or as I said, when the URL is not valid (for example "www."). You are hitting the webservice too many times – Hige May 15 '14 at 20:11
  • right..it is hitting webservice too many times..! so how that can be possible please..! any code..! – Umair Shah May 16 '14 at 06:25
  • google how to filter keys, and parse urls, my friend – Hige May 16 '14 at 12:39