JQuery - Narzędzia

Linki

Dynamiczne ładowanie linków. Funkcja:

function Link(div, tar)
{
$(div).load(tar, function()
          {
             $(div).find('a');
           });
}

I wywołujemy przez.

<a onclick="Link('#main', 'plik.php'); return false;" href="plik.php">Link 1 </a>
<a onclick="Link('#main', 'plik.php?zmienna=wartosc'); return false;" href="plik.php?zmienna=wartosc">Link 1 </a>
Formularze:

Funkcja wysyłania formularza (częściowo bazuje na tej daniela1302):

function sendForm(form, div)
{
            var url = $(form).attr('action');
            var met = $(form).attr('method');               
            var data;
            $(form+' :input').each
            (
                function (elementIndex)
                {
                    var name = $(this).attr('name');
                    var value = $(this).val();
 
                    if (data == null)
                        data = name+'='+value;
                    else
                        data += '&'+name+'='+value;
                }
            );
            $.ajax
            (
                {                   
                    type: met,
                    url: url,
                    data: data,
 
                    error: function (XMLHttpRequest, textStatus, errorThrown)
                    {
                        $("#error").show();
                        $("#error").append('Błąd obiektu o nazwie:'+XMLHttpRequest+'<br />Komunikat:'+textStatus+'<br />Rodzaj:'+ errorThrown);
                    },
                    success: function(html)
                    {
                        $(div).html(html);
                    }
                }
            );
    }
   
Wywołujemy ją poprzez np.

<script type="text/javascript">

$(document).ready(function(){
$("#form").submit(function(){
sendForm("#form", "#main");
 return false;
});
});

</script>
<form id="form" action="plik.php?go" method="post">
<input name="test" type="text" />
 
<input name="test1" type="text" />
 
<input type="submit" value="Wyślij" />
 
</form>

Jednak mi osobiście wygodniej jest pisać w ten sposób..

<form id="form" action="plik.php?go" method="post" onsubmit="sendForm('#form', '#main');  return false;">
<input name="test" type="text" />
 
<input name="test1" type="text" />
 
<input type="submit" value="Wyślij" />
 
</form>

Loader

Teraz dodatek, który jest bardziej ułatwieniem dla przeglądających witrynę, niźli dla admina. Służe do tego, by goście nie pomyśleli, że się strona zawiesiła. Należy kod ten wkleić na początku kodu funkcji.

$("#loader").ajaxStart(function(){
$(this).show();
});
$("#loader").ajaxStop(function() {
$(this).hide();
});

Aby zadziałał , potrzebny jest przykładowy div..

<div id="loader">Ładowanie....</div>

I to wszystko, póki co.