Chciałbym pobrać dane przez ajaxa na stronę wykorzystując zwykły link, i w taki sposób żeby po kliknięciu na niego były pobrane tylko dane, ale żeby skrypt pozostał na tej samej stronie, bez przeładowania.
W jaki sposób można pobrać link(podobno przez attr('href') ale to nie działa) i zablokować przeładowanie strony?
0
0
http://api.jquery.com/load/ i podczep wykonywanie tego skryptu pod klikniecie http://api.jquery.com/click/ , pamietaj by zablokowac wykonanie linku: http://api.jquery.com/event.preventdefault/
0
w onclick linka daj preventdefault, z attr(href) wyciągniesz gdzie prowadził. dane z linka możesz popbrać jakimś load() i wrzucić gdzie ptorzeba.
0
Blokowanie przez preventDefault dalej nie działa, może napiszę na czym dokładnie polega skrypt.
Ma on pobierać dane na zasadzie paginacji, całą paginację mam zrobioną w php, jquery ma przesyłać tylko jeden parametr do funkcji, który jest pobierany z aktualnie zaznaczonego selecta.
Funkcja zwraca dane przygotowane dla jquery czyli zamiast return wypisuje echo json_encode($dane);
To jest kod, który pobiera dane z selecta i następnie z funkcji php:
$(document).ready(function(){
$('select#select').change(function(){
var id = { id : $('#select :selected').val()};
$.ajax({
type: "POST",
url: "./index.php?controller=Controller&action=action",
dataType: "json",
data: id,
success : function(json){
if(!(typeof json[0] !== "undefinied" && json[0])){
$('#result').html('Brak danych');
}else{
$('result').html('');
for(var i = 0; i < json[0].length; i++){
$('#result').append(json[0][i] + '<br />');
}
$('#result').append('<br />');
$('#result').append(json['link']);
}},
error: function(){
alert('wystąpił błąd');
}
});
});
//Tutaj kod, który ma obsłużyć kliknięcie linku
$('#result a').click(function(e){
e.preventDefault();
var id = { id : $('#select :selected').val()};
var href = $('#result a').attr('href');
});
});
json['link'] to mają być odnośniki do numeru strony (nastepna, poprzednia itp.) z której mają być pobrane dane.
sam link wygląda jak dana url w funkcji ajax + numer strony oraz powinien mieć także daną id.
O ile pierwszy fragment kodu działa, czyli dane zmieniają się po zmianie selecta, to już obsługa linku nie chce działać.
Próbowałem wcześniej pisać kod na wzór funkcji $.ajax.
Wszystko jednak rozbija się o przeładowanie strony czego nie chcę.
Sprawdziłem teraz niezwiązany link i preventDefault na nim dziala.
Nie chce działać tylko na linku z numerem strony, tak jak by go w ogóle nie widział
0
Słyszałeś kiedyś o wcięciach?
Druga rzecz to masz błąd składniowy, nawet na forum widać że połowa jest na niebiesko
0
Przepisywałem kod i trafiła się literówka.
W tym nie leży problem.
0
ale ty masz tu rozpierduche. radze ci sciagnac jakies IDE i pozbyc sie tych klopotow od reki. kopiujac twoj kod do normalnego IDE od czerownego ci oczy wypali (notabene IDE byloby zbedne gdybys posluchal rady @dzek69 i porobil wciecia).
masz pogubione zamkniecia i bledny selector
wiec do rzeczy
$(document).ready(function(){
$('select#select').change(function(){
var id = { id : $'#select :selected').val()}; //BRAKUJE OTWIERAJACE NAWIASU PO ZNAKU DOLARA
$.ajax({
type: "POST",
url: "./index.php?controller=Controller&action=action",
dataType: "json",
data: id,
success : function(json){
if(!(typeof json[0] !== "undefinied" && json[0])){
$('#result').html('Brak danych');
}else{
$('result').html('');
for(var i = 0; i < json[0].length; i++){
$('#result').append(json[0][i] + '<br />');
}
$('#result').append('<br />');
$('#result').append(json['link']);
}, //TEN NAWIAS ZAMYKA CI IF'A A NIE CALLBACKA SUCCESS, MUSISZ DODAC JESZCZE JEDEN NAWIAS ZAMYKAJACY PRZED PRZECINKIEM
error: function(){
alert('wystąpił błąd');
}
});
});
//Tutaj kod, który ma obsłużyć kliknięcie linku
$('#result a').click(function(e){
e.preventDefault();
var id = { id : $('#select : selected').val()}; // POWINNO BYC :selected ZAMIAST : selected, SPACJA ROZPIEPRZA CI WSZYSTKO, KONSOLA CI O TYM LADNIE POWIE, ALE TY WOLISZ JEJ NIE UZYWAC BO JESTES HARDKOREM
var href = $('#result a').attr('href');
}); //BRAK NAWIASU KLAMROWEGO ZAMYKAJACEGO I NAWIASU OTWARTEGO ZAMYKAJACEGO I SREDNIKA, CZYLI JESZCZE JEDEN TAKI KOMPLET BO TEN ZAMYKA CLICKA, A BRAK ZAMYKACZA DO DOCUMENT.READY
Komentarze caps lockiem co bys nie przeoczyl jak nawiasow i innych dupereli :)
0
Przecież napisałem że błędy z nawiasami wynikają z tego że kod musiałem przepisać, pisałem go na kompie nie podłączonego do internetu. Używam eclipsa.
funkcja $.ajax działa, ale nie chce już działać zablokowanie linku e.preventDefault(); nawet jeśli użyję tylko preventa.
0
wstaw minimum kodu ktore u Ciebie nie dziala, czyli htmlowy link i podpiete do tego javascript z blokowaniem. uzyj jsbin lub jsfiddle. i daj kod taki jaki jest, bo nie mozna ustalic bledu w kodzie, ktorego nie podajesz tylko przepisujesz mnozac kolejne bledy. zreszta do konsoli tez by wartalo zajrzec co tam sie dzieje.
0
Eee... takich jaj nasze kury nie robią. Serio - nie zdażyło mi się w kodzie który się validował, żeby preventdefault nie preventował. https://developer.mozilla.org/en-US/docs/Web/API/event.preventDefault
Konsola, sprawdzanie i jedziesz, bo ciężko mi uwieżyć żeby preventdefault nie robił tego co potrzeba. jak coś to jeszcze możesz zatrzymać propagacje itp...
0
Link jest zwracany przez funckję $.ajax w linijce:
$('#result').append(json['link']);
a nie działa żadna praca na nim czyli w linijkach:
$('#result a').click(function(e){
e.preventDefault();
});
Link zwrócony przez ajax wygląda następująco:
<a href="index.php?controller=controller&action=action&page=1">[1]</a>
Konsola firefoxa nie zwraca żadnych błędów.
Dodam że gdy wstawie jakiś nowy link niezwiązany z ajaxem, to normalnie wszystko na nim działa. Tego linku jakby nie widział.
Skopiowany kod pliku:
$(document).ready(function(){
$('select#select').change(function(){
var l = { l_ID : $('#select :selected').val()};
$.ajax({
type: "POST",
url: "./index.php?controller=W&action=getLWAjax",
dataType: "json",
data: language,
success : function(json){
if(!(typeof json[0] !== "undefined" && json[0])){
$('#words_addTF').html('Brak danych');
}else{
$('#words_addTF').html('');
for(var i = 0; i < json[0].length; i++){
$('#words_addTF').append(json[0][i] + '<br />');
}
$('#words_addTF').append('<br />');
$('#words_addTF').append(json['linki']);
}},
error: function(){
alert('wystapil blad');
}
});
});
$('#words_addTF a').click(function(e){
e.preventDefault();
});
});
A to widok:
<script src="./lib/js/ajaxAddT.js"></script>
<form id="lW" method="post" action="index.php?controller=L&action=getAllL">
<label for="l_ID">Język: </label>
<select id="select" name="l_ID">
<?php foreach($dane['ls'] as $l){?>
<option value="<?php echo $l['l_ID']; ?>" ><?php echo $l["l_name"];?></option>
<?php }?>
</select>
<div id="words_addTF">
<p>hdg</p>
</div>
</form>
<form action="index.php?controller=T&action=add" method="post" >
<br />
<br />
<label for="word">T: </label>
<input type="text" name="word" />
<br />
<label for="l_ID" >Język : </label>
<select name="l_ID">
<?php foreach($dane['ls'] as $l){?>
<option value="<?php echo $l['l_ID']; ?>" ><?php echo $l["l_name"];?></option>
<?php }?>
</select>
<br />
<input type="submit" value="Dodaj" />
</form>
2
w zadnym momencie tej przydlugawej dyskusji nie napisales ze link jest GENEROWANY PRZEZ AJAX, ehh
w takim przypadku odwoluj sie do niego tak:
$("#result").on('click', 'a', function(e) {
alert('rob co masz robic');
e.preventDefault();
});
jedno ALE, div result nie moze byc generowany dynamicznie, tylko musi byc w kodzi od samego pcozatku. jesli jest generowany dynamicznie to zaczep o najblizszego rodzica ktory nie jest generowany dynamicznie.
ehh.....
0
Napisałem w drugim swoim poście czym jest json['link'], a czytając kod można dojść do tego że to jest zwracane przez ajax.
Kod teraz działa jak należy dzięki za pomoc.