Witam, mam pewien problem.
mam przykładowy formularz
<form id="forma" action="foo" target="resultContainer">
<!--content formy -->
<input type="submit" value="save" />
</form>
<div id="resultContainer">
</div>
Chciałbym by po wykonaniu akcji otrzymany response, został zwrócony do diva, który tu określiłem jako target.
Mogę to zrobić jakoś automatycznie bez ręcznego wysyłania Ajaxem i określania funkcji success w której sam będę wsadzał rezultat do określonego diva?
Da się, np. używając Angulara.
A jakoś prościej? używając jakiegoś dodatku do jQuery a nie całego Frameworka?
a ten ajax dlaczego Cię boli? Toż to aż ze 4 linijki kodu będzie z jQuery
Jest różnica między
<form id="forma" action="akcja" target ="div">
<input type="submit" value="save" />
</form>
,a
<form id="forma" action="akcja" target ="div">
<input type="button" onclick="save()" value="save" />
</form>
<script type="text/javascript">
function save()
{
$.ajax({
url:'akacja',
type:'POST',
data: $("#forma").serialize(),
success:function(html){
$("#div").html(html);
}
});
}
</script>
Tym bardziej jeśli takich formularzy mam kilkadziesiąt
A o klasach słyszał?
<form class="ajax" action="akcja" target ="div">
<input type="submit" value="save" />
</form>
$('form.ajax').submit(function(){
var that=$(this);
$.post(that.attr('action'), that.serialize(), function(info){$(that.attr('target')).html(info);});
return false;
});
I teraz sobie mnożysz tych formularzy ile chcesz i javascriptu nie dotykasz już (sry, że wyszło 5 linijek).
Powiesz, że skomplikowane? Na pewno prostsze niż szukanie dziwnych rozwiązań, które zapewne i tak objawią się w formie dodatkowej biblioteki, podczas gdy właśnie otrzymałeś gotowe rozwiązanie ;)
Pisane z palca, mogą być literówki
No prawie:)
Po zastosowaniu tego kodu formularz wysyła się 2x... ;)
<form class="ajax" action="urlDoAkcji" target="target_div">
//...tresc formularza (inputy textowe)
<input type="submit" value="Save" />
</form>
<div id="target_div">
</div>
<script type="text/javascript">
$('form.ajax').submit(function(){
var that=$(this);
$.post(that.attr('action'), that.serialize(), function(info){$(that.attr('target')).html(info);});
return false;
});
</script>
To teraz wywal z Twojego kodu JS i pliku HTML wszystko oprócz kodu, który wkleiłeś - wyśle się raz. Nie wiem co i gdzie masz dopisane, ale coś innego powoduje taki efekt.
A to, że nie wklei odpowiedzi tam gdzie trzeba to dlatego, że Twój target powinien być selektorem, który jQuery ogarnie.
Ok, sorry może faktycznie coś zwaliłem.
A da się zrobić tak, żeby po każdym ajaxie (nie tylko submicie formularzy), po otrzymaniu response'a wywołać jakąś określoną z góry funkcję?
zrób tak:
var request = $.ajax({
url: "xxx.php",
type: "GET",
data: { xxx: xxx },
dataType: 'json'
});
request.done(function(msg) {
});
request.fail(function(jqXHR, textStatus) {
});
potrzebuję coś bardziej uniwersjalnego bo nieraz wysyłam formularz za pomocą input type=submit a czaem "ręcznie" ajaxem tak jak pokazałeś.
Nie chcę przy każdym wywołaniu ajaxa dopisywać ciągle ten sam fragment kodu.
Chcę coś co zdefiniuję raz typu
pseudokod:
$.afterAjaxExecute(function(){ console.log("lalala");});
i to mi się wywoła zawsze niezaleznie jak i gdzie wyślę coś ajaxem.
jQuery("body").ajaxStart(function(){
});
jQuery("body").ajaxStop(function(){
});
jQuery("body").ajaxError(function(){
});