[PHP][JavaScript]jquery autocomplete -własne parametry Opcje

[rafik73]

Witam
Korzystam z najnowszego pluginu
jquery autocomplete, wszystko chodzi fajnie,
dane pobieram z pliku z zapytaniem MySQL.
Używam standardowych parametrów: label i value
Potrzebuje dodatkowych parametrów, np.: o nazwie id.
Istnieje taka możliwość, czy tylko te dwa
parametry przypisane na stałe?
Czyli...
Mam kolumny id_osoby, name, miasto.
Chcę przesłać odpowiednio za pomocą parametrów :
label: name,miasto
value: name
id: id_osoby


Ten post edytował rafik73 23.10.2015, 07:25:00

[Pyton_000]

A wiesz ile jest takich skryptów do autocomplete?

[rafik73]

No właśnie sęk w tym, że nie mogłem znaleźć
rozwiązania w necie.

[kapslokk]

Myślę, że Pytonowi po prostu chodzi o to, że jak podasz konkretnie którego autocomplete'ra używasz, będzie znacznie łatwiej Ci pomóc (IMG:style_emoticons/default/wink.gif)

[rafik73]

Sorki
Chodzi o najnowszy jquery ui 1.11.4

Ten post edytował rafik73 23.10.2015, 09:00:51

[Pyton_000]

http://stackoverflow.com/questions/7292462...mplete-response

[rafik73]

[PHP] pobierz, plaintext 
<?php
 
 
$q=$_GET["term"];
if (!$q) return;
 
mysql_query("SET NAMES 'utf8'");//polskie znaki
$query = mysql_query("SELECT * FROM baza WHERE miasto LIKE '$q%'  ORDER BY miasto") or die(i'Błąd zapytania');
 
 
$json=array();
 
    while($z=mysql_fetch_array($query)){
         $json[]=array(
                    "value"=> $z['name],
                    "label"=>$z['miasto'],
                   "id"=>$z['id_osoby']  // to chcę dodać
 
                        );
    }
 
 echo json_encode($json);
?>
[PHP] pobierz, plaintext 

Ten post edytował rafik73 23.10.2015, 10:03:27

[Pyton_000]

no super, Ty powiedziałeś co chcesz, ja dałem rozwiązanie... A gdzie to chcesz dodać?

[rafik73]

id ma być przesłane do formularza,do hidden

[JAVASCRIPT] pobierz, plaintext 
<script type="text/javascript">// <![CDATA[
$(function() {
 
			$("#search").autocomplete({
				source: "search.php",minLength:1,
				focus: function(event, ui) {
					// prevent autocomplete from updating the textbox
					event.preventDefault();
					// manually update the textbox
					$(this).val(ui.item.label);
				},
				select: function(event, ui) {
					// prevent autocomplete from updating the textbox
					event.preventDefault();
					// manually update the textbox and hidden field
					$(this).val(ui.item.label);
					$("#id_search").val(ui.item.value);
				}
			});
		});
 
// ]]></script>
[JAVASCRIPT] pobierz, plaintext 

[Pyton_000]

$("#id_search").val(ui.item.value);

zmień value na klucz id i tyle.

[rafik73]

Też tak myślałem ale tak nie działa,mam wrażenie, że value
i label są na stałe zapisane w skrypcie jquery

[Pyton_000]

console.log(ui.item)

[rafik73]

Sprawdzę po 15,bo teraz z pracy ze smartfona piszę :-)

To była literówka, działa, dzięki wielkie !
Ale to nie koniec problemu....mam problem z wyświetlaniem tych danych w pętli. na stronie wyświetlam zawartość bazy danych
w formularzu do edycji, która jest w pętli while.
Skrypt szukania:

[PHP] pobierz, plaintext 
<?php
 
 
$q=$_GET["term"];
if (!$q) return;
 
mysql_query("SET NAMES 'utf8'");//polskie znaki
$query = mysql_query("SELECT name,surname,id,miasto FROM miasta WHERE  surname LIKE '$q%'  ORDER BY surname ASC") or die('Błąd zapytania');
 
 
$json=array();
 
    while($s=mysql_fetch_array($query)){
 
         $json[]=array(
                    "value"=> $s['surname'].' '.$s['name'],
                    "label"=>$s['surname'].' '.$s['name'].' '.$s['miasto'],
                    "id"=>$s['id'] ,
                    "miasto"=>$s['miasto']
 
                        );
 
    }
 
 echo json_encode($json);
?>
[PHP] pobierz, plaintext 

odbieram:

[JAVASCRIPT] pobierz, plaintext 
<script type="text/javascript">
$(function() {
 
			$(".search").autocomplete({
 
				source: "search.php",minLength:2,
				focus: function(event, ui) {
					// prevent autocomplete from updating the textbox
					event.preventDefault();
					// manually update the textbox
					$(this).val(ui.item.label);
				},
				select: function(event, ui) {
					// prevent autocomplete from updating the textbox
					event.preventDefault();
					// manually update the textbox and hidden field
					$(this).val(ui.item.value);
					$(".id_search").val(ui.item.id);
          $(".id_miasto_search").val(ui.item.miasto);
				}
			});
		});
 
</script>
[JAVASCRIPT] pobierz, plaintext 

Wysyłam do formularza w pętli, wyświetla się powiedzmy 5 rekordów.
Problem w tym, że wysyła te same dane do textboxa o klasie 'id_miasto_search' oraz 'id_search'
Nie traktuje pojedyńczego rekordu tylko masowo.

czyli mamy:

[PHP] pobierz, plaintext 
while{
textbox1 class="id_search";
textbox2 class="id_miasto_search";
}
[PHP] pobierz, plaintext 

[Pyton_000]

Nie do końca rozumiem. albo to wina pory.

[rafik73]

[PHP] pobierz, plaintext 
// tu zapytanie mysql, $query
while($a=mysql_fetch_array($query)){
echo'<input type="text" class="search" name="nazwisko" value=".'$a ['name']">';
echo'<input type="text" class="id_search" name="id" value=".'$a ['id']">';
echo'<input type="text" class="id_miasto_search" name="miasto" value=".'$a ['id_miasto']">';
}
[PHP] pobierz, plaintext 

Kiedy edytuje textbox o klasie search, to wartości id_search oraz id_miasto_search są przekazywane do wszystkich rekordów w pętli a nie tylko do edytowanego.

Ten post edytował rafik73 23.10.2015, 21:56:34

[Pyton_000]

Ujmij inputy w np. div i potem przypisuj wartości na zasadzie:

$(this).closest('div').find(".id_miasto_search").val(ui.item.miasto);

[rafik73]

Nie działa, za to dla klasy 'id_search' zadziałało:

[JAVASCRIPT] pobierz, plaintext 
$(this).parent().parent().parent().find(".id_search").val(ui.item.id);
[JAVASCRIPT] pobierz, plaintext 

zaś dla klasy 'id_miasto_search' nie działa. fakt, że input z tą klasą nie jest obok inputa 'id_search', tylko pod innymi divami, w
innej części formularza, ale nie mogę go namierzyć parentami, dopiero gdy dorzucę jeden parent, czyli:

[JAVASCRIPT] pobierz, plaintext 
$(this).parent().parent().parent()..parent()find(".id_miasto_search").val(ui.item.miasto);
[JAVASCRIPT] pobierz, plaintext 

to się wyświetla ale niestety we wszystkich rekordach (IMG:style_emoticons/default/sad.gif)

Ten post edytował rafik73 24.10.2015, 10:47:15

[trueblue]

W każdym .search przechowuj w atrybucie np. data-id-search oraz data-id-miasto, id pól zależnych (im nadaj unikalne id).
W metodzie select pobierz obydwa atrybuty z elementu .search, dzięki temu nie będziesz musiał przeszukiwać struktury.

[rafik73]

Można prosić bardziej łopatologicznie? (IMG:style_emoticons/default/biggrin.gif)

[trueblue]

Kiedy tworzysz elementy w pętli nadaj im id, np. id="search1" i id="miasto1", i tak po kolei.
W elemencie .search powiązanym z tymi elementami dodaj atrybuty: data-id1="search1" i data-id2="miasto1".
W metodzie select pobierz wartości atrybutów (.attr('data-id1') .attr('data-id2')), pobrane wartości wskażą na powiązane elementy, który chcesz uzupełnić.

[rafik73]

Ale klasy w tych elementach się nie pozbywać?

[trueblue]

Do tego co proponuję, klasa nie jest potrzebna.

[rafik73]

Coś takiego skleciłem ale nie działa:

[JAVASCRIPT] pobierz, plaintext 
$(function() {
			 $("#id_search").attr("data-id_search");
        $("#id_miasto_search").attr("data-id_miasto_search");    
			$(".search").autocomplete({
 
				source: "search.php",minLength:2,
				focus: function(event, ui) {
					// prevent autocomplete from updating the textbox
					event.preventDefault();
					// manually update the textbox
					$(this).val(ui.item.label);
				},
				select: function(event, ui) { 
 
					// prevent autocomplete from updating the textbox
					event.preventDefault();
					// manually update the textbox and hidden field
					$(this).val(ui.item.value);   
 
 
          $("data-id_search").val(ui.item.id);
          $("data-id_miasto_search").val(ui.item.miasto);
				}
 
			});
		});
[JAVASCRIPT] pobierz, plaintext 

Oczywiście dodałem dwa inputy o id 'id_search' oraz 'id_miasto_search'
Co robię nie tak?

[trueblue]

Co robisz w liniach 2/3 oraz 21/22?

[rafik73]

2/3 nadaje atrybuty




inputy:

[PHP] pobierz, plaintext 
while{
textbox1 id="id_search";
textbox2 id="id_miasto_search";
}
[PHP] pobierz, plaintext 

21/22 wysyłam dane do textboxów

Ten post edytował rafik73 25.10.2015, 20:17:28

[trueblue]

Sprawdź (w dokumentacji) jak się nadaje atrybuty. Jeśli to zrobisz, to nie nadawaj elementom (a dokładnie jednemu, bo miałeś jednego nadawać) w js, tylko w bezpośrednio w html/php.
$ w jQuery jest selektorem, wybierającym elementy od danym id, klasie, tagu, etc. Ty nie masz w kodzie tagów <data-id_search>, miałeś pobrać z jednego elementu nadane atrybuty (nadane paragraf wyżej) i dzięki temu miałbyś "wskaźniki" na dwa zależne elementy.

[rafik73]

Wycinek z http://api.jquery.com/attr/

[HTML] pobierz, plaintext 
<img id="greatphoto" src="brush-seller.jpg" alt="brush seller">
[HTML] pobierz, plaintext 

Setting a simple attribute

To change the alt attribute, simply pass the name of the attribute and its new value to the .attr() method:

[JAVASCRIPT] pobierz, plaintext 
$( "#greatphoto" ).attr( "alt", "Beijing Brush Seller" );
[JAVASCRIPT] pobierz, plaintext 

[trueblue]

Setting a simple attribute

To change the alt attribute, simply pass the name of the attribute and its new value to the .attr() method:

[JAVASCRIPT] pobierz, plaintext 
$( "#greatphoto" ).attr( "alt", "Beijing Brush Seller" );
[JAVASCRIPT] pobierz, plaintext 

To tylko potwierdza, że niepoprawnie to robisz, abstrahując od tego, że niepotrzebnie w JS i nie dla tych elementów.

[rafik73]

2/3 nadaje atrybuty




inputy:

[PHP] pobierz, plaintext 
while{
textbox1 id="id_search";
textbox2 id="id_miasto_search";
}
[PHP] pobierz, plaintext 

21/22 wysyłam dane do textboxów

Ale nadałem atrybuty id powyżej


chwila,chwila,chyba łape

Czyli nadaje atrybuty elementom?:

[PHP] pobierz, plaintext 
while{
textbox1 data-id_search="id_search"  id="id_search";
textbox2 data-id_miasto_search="id_miasto_search"   id="id_miasto_search";
}
[PHP] pobierz, plaintext 

[Pyton_000]

Czy Ty znasz podstawy HTML i JS?

[rafik73]

Kiedy tworzysz elementy w pętli nadaj im id, np. id="search1" i id="miasto1", i tak po kolei.
W elemencie .search powiązanym z tymi elementami dodaj atrybuty: data-id1="search1" i data-id2="miasto1".
W metodzie select pobierz wartości atrybutów (.attr('data-id1') .attr('data-id2')), pobrane wartości wskażą na powiązane elementy, który chcesz uzupełnić.

[PHP] pobierz, plaintext 
while{
textbox data-id_search="id_search" data-id_miasto_search="id_miasto_search" class="search";
 
textbox1   id="id_search";
textbox2    id="id_miasto_search";
}
[PHP] pobierz, plaintext 

o to ci chodziło?

Kod php powyżej ma charakter poglądowy, dlatego ma taki dziwny zapis.

Ten post edytował rafik73 25.10.2015, 21:22:16

[trueblue]

Prawie. Jako, że tworzysz elementy w pętli, będzie ich wiele, a to oznacza, że muszą mieć różne id (dodawaj do id jakąś wartość licznika).
Wtedy linie 2/3 nie są potrzebne, a 21/22 trzeba będzie zmodyfikować.

Ten post edytował trueblue 25.10.2015, 22:11:49

[rafik73]

O ludzie,te dane mam już w 2 pętlach wyświetlane,i teraz mam 3 dołożyć? Nie ma innej metody?

[trueblue]

Jeśli masz dwie pętle, jedną do tworzenia .search, a drugą do tych dwóch inputów, to należy zmodyfikować obydwie.


Ten post edytował trueblue 25.10.2015, 23:01:36

[rafik73]

Jedna pętla generuje kalendarz z samymi poniedziałkami
a druga wyświetla zawartość tabeli MySQL, zawartość tabeli jest nakladana według dat na wygenerowany kalendarz

.search jest w jednym formularzu z 'id_search' i 'id_miasto_search'.

[trueblue]

Jakąkolwiek/wszystkie pętlę/e gdzie tworzysz .search oraz id_search i id_miasto_search.

[rafik73]

trueblue, serdeczne dzięki. Fajnie, że komuś się chce pochylać nad oczywistymi tematami.
Pytałeś o podstawy - jakieś są. Z braku czasu programuję modułowo i na miarę potrzeb.
Mam zacięcie i zamiłowanie, ale jw. No i niestety, te "dziury" czasami wychodzą.
Pozdrawiam i dzięki.