amiga-news DEUTSCHE VERSION
.
Links| Forums| Comments| Report news
.
Chat| Polls| Newsticker| Archive
.

amiga-news.de Forum > Programmierung > Javascript+PHP+MySQL: Personen auswählen [ - Search - New posts - Register - Login - ]

1 -2- [ - Post reply - ]

2011-01-24, 19:09 h

bruZard
Posts: 307
User
Kann er auch nicht, habe ja keinen funktionierenden Code gepostet. Aber der hier geht:
code:
function openWin(width, height){
			var win = $('#window');
			
			$('#modalOverlay').fadeTo('slow', 0.7);
			
			if(width > 0 && height > 0){
				win.css({ 
					'width' : width + 'px', 
					'height' : height + 'px', 
					'left' : '50%', 
					'top' : '50%', 
					'margin-left' : '-' + (width / 2) + 'px', 
					'margin-top' : '-' + (height / 2) + 'px' 
				});
			}
			
			win.fadeIn();
		}

--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-24, 19:15 h

AGSzabo
Posts: 1663
User
@bruZard:

ah jetzt ja,

btw, was bedeuten eigentlich die $-Zeichen? Ist das der Aufruf von JQuery?
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 19:23 h

bruZard
Posts: 307
User
Das ist ein Selektor, das Original aus JavaScript wäre:
code:
var meinDiv = window.document.getElementByID("meinDiv"); etc.

In jQuery schreibt man halt einfach "var meinDiv = $('#meinDiv')" und erhält das Objecthandle auf ein Element mit der ID "meinDiv". an muss das Objekt aber nicht in eine Variable übertragen (var meinDiv =).
Man kann auch Klassen selektierten, dann muss man die Raute durch einen Punkt ersetzen. Hierbei ist aber zu beachten dass Klassen mehrfach in einem Dokument vorkommen können und man deshalb kein Objekt, sondern ein Objekt-Array zurück bekommt.

Ein Sonderfall ist Ajax. Hier selektiert man nichts mit dem $ sondern ruft die Methode "ajax()" aus dem Objekt "$" auf. Als Parameter übergibt man der Method ein JSON Objekt. Bspw: { url : 'meinScript.php', method : 'POST' }
Einen Ajax Request auf die klassische Art, also ohne Framework, zu basteln grenzt an Selbstverstümmelung ;)

Die Dokumentation von jQuery ist sehr gut und ausführlich, zudem gibt es fantanstillionen viele Tutorials dazu.

[ Dieser Beitrag wurde von bruZard am 24.01.2011 um 19:23 Uhr geändert. ]

[ - Answer - Quote - Direct link - ]

2011-01-24, 19:34 h

AGSzabo
Posts: 1663
User
@bruZard:

suppa, ich lerne hier gerne weiter. was ist denn das objekt "$"? was hat es damit auf sich?

--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ Dieser Beitrag wurde von AGSzabo am 24.01.2011 um 19:35 Uhr geändert. ]

[ - Answer - Quote - Direct link - ]

2011-01-24, 19:49 h

bruZard
Posts: 307
User
jQuery macht Folgendes: Es erweitert alle HTML Objekte um Eigenschaften und Methoden. Beispielsweise kannst Du nur mit JavaScript nicht einfach "window.width;" schreiben um die Fensterbreite zu ermitteln. Die Eigenschaft "width" wird erst durch jQuery dem Objekt "window" hinzugefügt. Das Objekt "$" ist sozusagen das "MasterObject", es beinhaltet Methoden um Browser-übergreifend auf die Elemente des DOM zuzugreifen und diesen zu manipulieren. ein "$('#meinDiv');" definiert durch die Art des Parameters dass Du gern das Objekt zu "meinDiv" haben möchtest das all die fantastischen Methoden hat die Dumit purem JavaScript erst alle selbst programmieren müsstest. Das MasterObject hat aber auch Methoden die nicht an ein Element des DOM gebunden sind, wie eben die Methode "ajax" die es crossplatform ermöglicht ein PHP Script aufzurufen, Daten zu übergeben und den Output des Scripts zurück zu bekommen. Alles was das PHP Script per "echo" ausgibt kommt als Rückgabewert zurück.

--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-24, 19:54 h

AGSzabo
Posts: 1663
User
@bruZard:

ist ja super. wenn das projekt verwirklicht wird, kommt jquery mit rein. das ist klar. :-)

--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 20:15 h

AGSzabo
Posts: 1663
User
kannst du mir beschreiben wie ich dieses jquery-plugin ansprechen kann um mal zu sehen wie es löppt?

https://github.com/appsinyourpants/jquery-plugins/blob/master/jquery.tagify.js
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 20:16 h

bruZard
Posts: 307
User
Einfach nach jQuery einbinden. Es fügt sich nahtlos ein.
--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-24, 20:23 h

AGSzabo
Posts: 1663
User
@bruZard:

gut. wie rufe ich es auf? muss ich meiner textarea etwas hinzufügen od erso?
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 20:27 h

bruZard
Posts: 307
User
Ich finde keine Dokumentation zu diesem Plugin, somit ist es recht schwer hilfreich zu sein.
--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-24, 21:03 h

AGSzabo
Posts: 1663
User
ich hab jetzt das da in angriff genommen: http://www.devbridge.com/projects/autocomplete/jquery/

und das ist mein code, geht aber nicht, kannst du mir beschreiben wieso?
code:
<!DOCTYPE html>
<html>
<head>
	<title>Member-Search</title>

	<script type="text/javascript" src="jquery.js"></script>
	<script type="text/javascript" src="jquery.autocomplete.js"></script>

<script type="text/javascript">

function init() {

var a;

jQuery(function(){
  a = $('#query').autocomplete(

    lookup: ['January', 'February', 'March', 'April', 'May'] //local lookup values 

  );
});

}

window.onload = init;

</script>

</head>
<body>

<input type="text" name="q" id="query" />

</body>
</html>

--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 21:12 h

bruZard
Posts: 307
User
Steht in der Doku: "Autocomplete must be initialized after DOM has finished loading."

Das heißt Du musst Deinen Code so erweitern dass der Kram erst verfügbar ist wenn das DOM fertig geladen wurde:

code:
$(document).ready(function(){
  /*
    Hier kommt Dein Code rein, er wird erst ausgeführt 
    wenn wirklich das gesamte Dokument beim User im 
    Browser angekommen ist
  */
});

--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-24, 21:21 h

AGSzabo
Posts: 1663
User
@bruZard:

hmm, nö, das tut es nicht. ich hab es ja auch mit window.onload versucht, aber mit deinem beispiel geht es auch nicht. ;(
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 21:22 h

bruZard
Posts: 307
User
Das zu checken schaffe ich heute nicht mehr. Ich poste hier morgen die Lösung.
--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-24, 21:24 h

AGSzabo
Posts: 1663
User
@bruZard:

sehr vielen dank, :-)
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-24, 21:51 h

AGSzabo
Posts: 1663
User
ok, ich habs hinbekommen. ich hatte eine klammer vergessen. grml
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-25, 09:46 h

AGSzabo
Posts: 1663
User
@bruZard:

neues problem: ich habe versucht eine rückgabe per php script zu implementieren. es tut sich aber nix in der textarea.

(es geht immernoch um http://www.devbridge.com/projects/autocomplete/jquery/ )

hier mein javascript code:
javascript code:
$(document).ready(function(){

  $(function(){

      $('#query').autocomplete({
        onSelect: function(value, data){ alert('You selected: ' + value + ', ' + data); },
        width: 300,
        delimiter: /(,|;)s*/,
        serviceUrl:'json_get.php'
      });

  });

});


und das zugehörige php script auf dem server (json_get.php):
php code:
<?php

echo "{query:'Li',suggestions:['Liberia','Libyan Arab Jamahiriya','Liechtenstein','Lithuania'],data:['LR','LY','LI','LT']}";

?>


--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ Dieser Beitrag wurde von AGSzabo am 25.01.2011 um 09:48 Uhr geändert. ]

[ Dieser Beitrag wurde von AGSzabo am 25.01.2011 um 13:58 Uhr geändert. ]

[ - Answer - Quote - Direct link - ]

2011-01-25, 15:40 h

bruZard
Posts: 307
User
Bei mir funktioniert es.
HTML:
code:
<input type="text" name="search" id="searchText">


JS:
code:
$(window).ready(function(){
			$('#searchText').autocomplete({
				serviceUrl : "ac.php"
			});
		});


PHP:
code:
<?php
	echo "{ query : 'Kl', suggestions : ['Klaus', 'Klasse', 'Kloß'] }";
?>

--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-25, 16:09 h

AGSzabo
Posts: 1663
User
@bruZard:

ich habe entdeckt dass der case des zurückgelieferten "query:" wertes mit der eingabe übereinstimmen muß.
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-25, 16:17 h

AGSzabo
Posts: 1663
User
ich frage mich wozu es überhaupt gut sein soll, daß die originale eingabe zurückgeliefert werden muss, hast du eine idee?
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-25, 16:37 h

bruZard
Posts: 307
User
Warum das JSON Objekt unbedingt das Query beinhalten muss kann ich dir nicht sagen. Prinzipiell funktioniert das Ganze aber so: In PHP kommt per GET folgendes an:
code:
$query = $_GET["query"];

Nun kannst Du in Deiner Datenbank nach "Suggestions" suchen ...
code:
$result = MYSQL_QUERY("SELECT * FROM myTable WHERE name LIKE '$query%' ORDER BY name ASC");

...und mit der Rückgabe Dein JSON Objekt zusammenbasteln...
code:
while($row = MYSQL_FETCH_OBJECT($result))
{
  $sug.= "'".$row->name."',";
}
$sug = substr($sug, strlen($sug) - 2); // letztes Komma und Hochkomma abschneiden
echo "{ query : '$query', suggestions : [ $sug ] }";

Dieser Code ist nicht getestet!
--
PanzerZ |
methusalem | basic

[ Dieser Beitrag wurde von bruZard am 25.01.2011 um 16:37 Uhr geändert. ]

[ - Answer - Quote - Direct link - ]

2011-01-25, 16:41 h

AGSzabo
Posts: 1663
User
@bruZard:

imo darf man das letzte hochkomma nicht abschneiden. nur das letzte komma.
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-01-25, 16:43 h

bruZard
Posts: 307
User
Logisch, mein Fehler.
--
PanzerZ |
methusalem | basic

[ - Answer - Quote - Direct link - ]

2011-01-26, 14:08 h

AGSzabo
Posts: 1663
User
ich bin eine lösung näher gekommen. mir schwebt da folgendes vor:

bei mir kann eine person mehrere nicknames haben, aber nicht unbedingt einen realnamen. ich könnte einen nicknamen einer person in der nicks-tabelle suchen und hätte damit über einen foreignkey die id der person (im Bild "AUTHOR": http://janeway.quicktunnels.net/janeway.png ) und kann alle ihre weiteren nicks duch die selbe id in der nicks-liste finden und diese namenstrings zu einem verbundenen string (zB "AGS / Andy Silva") an ajax zurückliefern. das selbe spielchen muss ich aber vorher mit allen treffern machen und für die treffer ein array anlegen und dieses dann per json zurücksenden. ich weis nicht ob das praktisch ist.

ein anderers ansatz wäre, zur laufzeit eine tabelle im speicher anzulegen, in der für jede person ihre nicknamen schon zu einem namen verbunden sind und die mit der personentabelle 1:1 verknüpft ist. auf diese weise habe ich ohne umstände alle namensinformationen zu einer person auf einmal, während ich die nach der ersten methode erst mühsam zusammen suchen müsste. oder? welche methode ist besser?

und was kann ich tun wenn mal ein nickname zweimal vor kommt (für zwei verschiedene personen)?

--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ Dieser Beitrag wurde von AGSzabo am 26.01.2011 um 14:23 Uhr geändert. ]

[ - Answer - Quote - Direct link - ]

2011-01-29, 21:33 h

AGSzabo
Posts: 1663
User
hier geht es weiter: http://www.amiga-news.de/forum/thread.php?id=33687&start=1&BoardID=7#346454
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]

2011-02-02, 09:25 h

ChrisP
Posts: 983
User
Zitat:
Original von AGSzabo:
@ChrisP:

kannst du mir deinen code oder die variablenbelegung erklären oder mir den link zu der seite geben wo das script arbeitet? so dass ich sehen kann ob es das ist was ich suche? dein code scheint ja wirklich genial zu sein bei der kürze!


Ich bin noch nicht dazu gekommen, aber wie es aussieht, hast du ohnehin schon eine andere Loesung gefunden, richtig?


--
Suche Amiga 2500UX

[ - Answer - Quote - Direct link - ]

2011-02-02, 09:38 h

AGSzabo
Posts: 1663
User
@ChrisP:

richtig. :-)
--
Sam mini os4.1 upd. 2 / e-uae 39bb2 / A4000D 3.0 & 3.9 2mbchip 8mbfast Ariadne_II ide DVD und HD / A500 3.1 (mkick) adide 50mb / Athlon ii X2 Ubuntu Linux

[ - Answer - Quote - Direct link - ]


1 -2- [ - Post reply - ]


amiga-news.de Forum > Programmierung > Javascript+PHP+MySQL: Personen auswählen [ - Search - New posts - Register - Login - ]


.
Masthead | Privacy policy | Netiquette | Advertising | Contact
Copyright © 1998-2024 by amiga-news.de - all rights reserved.
.