Post PHP and get value on jQuery window page, refresh page as `msnbc.com`

Finally, I found an article at http://code.google.com/intl/en/web/ajaxcrawling/docs/getting-started.html msnbc using this method. Thanks to all my friends.

Thank you for your help. I will study this for myself: -}

Today I am updating my question again, deleting all my code. Maybe I think that everything is wrong.

I want to make a product display page.

One of them - index.php, the other - search.php(like a jquery box page). index.phphas some lists of product catalogs; each click on a catagory item of a product passes each value to search.php. search.phpwill create a mysql query and view the details of the products. It ( search.php) also has a search box. ( search.phpcan display a page to display multiple products, the search result is similar to the jQuery gallery ...).

I need to do something in search.php, but without an update index.php.

I tried many methods while thinking: make search.php as iframe (but can't judge the height of search.php when it turns the page and index.php without updating); use jquery ajax / json pass value from index.php for search.php and then return the whole page value to index.php. (there is still some problem with the URL rule. php depends on the URL values ​​in search.php, but if the value changes, the two pages will refresh everything.)

So. I think, ask, find, try ... By chance, I find the site as my request.

in this url, change the search word after% 3D, refresh only the side page

in this url, change the search word after = the page will refresh

I found something in my source code, are these key rules?

<script type="text/javascript"> 
var fastReplace = function() {
    var href = document.location.href;
    var siteUrl = window.location.port ? window.location.protocol+'//'+window.location.hostname +':'+window.location.port : window.location.protocol+'//'+window.location.hostname;
    var delimiter = href.indexOf('#!') !== -1 ? '#!wallState=' : '#wallState=';

    var pieces = href.split(delimiter);
    if ( pieces[1] ) {
        var pieces2 = pieces[1].split('__');
        if ( pieces2[1] && pieces2[1].length > 1) {
            window.location.replace( unescape(pieces2[1].replace(/\+/g, " ")));
        }
    }
}();
</script> 

. . - index.php. - search.php. js url

index.php#search.php?word=XXX&page=XXX

index.php?

, - , js, pass value get value.

.

+3
3

, - : http://powerwall.msnbc.msn.com/

, ajax- - : http://tkyk.github.com/jquery-history-plugin/

, ( ..) ajax - js. , href url ajax, ....

function change_box_links(output_area){
    output_area.find('a').each(function(){
        $(this).bind('click', function(e){
            e.preventDefault();
            var url = $(this).attr('href');
            $.ajax({
                url: url,
                success: function(data){
                    output_area.html(data);
                    //update url in addressbar
                    change_box_links(output_area);
                }
            });

        });
    });
}

, ...

[2011-05-15]

, , "". , , .

, html, script html, ajax.

html-

  • ,
  • ..

"", , . recommand a div:

<div id="yourbox"></div>

, , , . , JS ajax- :

( jquery)

$('#showsearch_button').bind('click', function(){showsearch();});

function show_search() {
    $.ajax({
        url: 'search.php',
        success: function(data){
            var output_area = $('#yourbox');
            output_area.html(data);
            $.address.hash('search');
            change_box_links(output_area);
         }
    });
});

. (. ) , html- ( ). , url:

jquery history-plugin

function change_box_links(output_area){
    output_area.find('a').each(function(){
        $(this).bind('click', function(e){
            e.preventDefault();
            var url = $(this).attr('href');
            $.ajax({
                url: url,
                success: function(data){
                    output_area.html(data);
                    var name = url.replace('/\.php/','');
                    $.address.hash(name);
                    change_box_links(output_area);
                }
            });

        });
    });
}

- , :

$.address.change(function(event) {
    var name = $.address.hash();
    switch(name){
        case 'search': show_search(); break;
        default: alert("page not found: "+name);
    }
});

, . , . : , ; -)

0

, ( ). , .

dataType ='json' jQuery.ajax
  json_encode() B.php
  json_decode() A.php $.getJSON()

:

jQuery.load()

+2

im , , , , ,

, - , , , div ur .

if so you can do it with jquery.load () and here is an example (no json needed)

Step 1:

Index.php

<p>
        brand:<select id=jquerybrand>$jquerybrands</select><br />
        Model:<select id=jquerycars></select><br />
</p>
<script type=\"text/javascript\">
$(document).ready(function(){
$('#jquerybrand').change(function(){
var value=$(this).value;
var url='api/quick.php?'+this.id+'='+this.value+' option';
$('#jquerycars').load(url);
});
});
</script>

It will just show 2 dowpdown windows (maybe text or something like that). and add a listener to any change in value. after changing it, he will send the field identifier and the new value to api / quick.php, then answer.php will be loaded into the #jquerycars drop-down list.

Step 2 quick.php

if(isset($_GET['jquerybrand'])){
$jquerycars="";
require_once("../lib/database.php");
$sql_db = new database();
$l=$sql_db->Item_in_table("car","sheet1","WHERE `brand`='$jquerybrand';");
foreach($l as $l)$jquerycars .="<option>$l</option>";
echo $jquerycars;//response that will replace the old #jquerycars
}

this will confirm that this is a request only to get the result of the request, then it will execute the request and repeat the results. Now, as soon as the results are back, it will replace the old ones :)

hope this helps :).

0
source

All Articles