Auswahllisten verändern - langsam
David
- javascript
ich hab mir was aus den haaren gesogen wie ich auswahllisten verändern kann.
hab 6 listen (die erste hat sogar über 11000 einträge) bei denen die daten aus ner datenbank eingelesen werden.
leider ist das durch die übergabe als strink, das splitten und umsortieren echt langsam geworden.
gibts ne möglichkeit das zu verbessern und zu beschläunigen ?
hier das script:[CODE] <script type="text/javascript">
//AjaxHTTP Request
function getXMLHttpRequestObject() {
var requestObject;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer") {
requestObject = new ActiveXObject("Microsoft.XMLHTTP");
}else{
requestObject = new XMLHttpRequest();
}
return requestObject;
}
var httpRequestObject = getXMLHttpRequestObject();
//REQ fertig
function clickOnTag() {
var txtSelectedValuesObj = document.getElementById('tag');
var selectedArray = new Array();
var selObj = document.getElementById('tag');
var i;
var count = 0;
for (i=0; i<selObj.options.length; i++) {
if (selObj.options[i].selected) {
selectedArray[count] = selObj.options[i].value;
count++;
}
}
//alert(selectedArray);
if(document.archiv.sort[0].checked == true){
$sort = 'alphaab';
} else if(document.archiv.sort[1].checked == true){
$sort = 'alphaauf';
}
// hier ajaxen
//alert('getbyTAG.php?tagID='+selObj);
httpRequestObject.open('GET', 'getbyTAG.php?tagID='+selectedArray);
httpRequestObject.onreadystatechange = ajaxEvent;
httpRequestObject.send(null);
//
function ajaxEvent() {
// Ajax-Anfrage erfolgreich?
if(httpRequestObject.readyState == 4){
// Holt die Antwort aus der Anfrage
var ajaxResponse = httpRequestObject.responseText;
// AJAX GET
alert("respond hier da");
neueTag = new Array();
neueProjekte = new Array();
neueJahr = new Array();
neueSemester = new Array();
neueDozent = new Array();
neueStudent = new Array();
//Projekte sichern
tagArray = new Array();
projektArray = new Array();
jahrArray = new Array();
semesterArray = new Array();
studentArray = new Array();
dozentArray = new Array();
for (i = 0; i < archiv.tag.length; i++) {
tagArray[i] = new Array();
archiv.tag.options[i].selected = false;
tagArray[i][0] = archiv.tag.options[i].text;
tagArray[i][1] = archiv.tag.options[i].value;
}
for (i = 0; i < archiv.projekt.length; i++) {
projektArray[i] = new Array();
archiv.projekt.options[i].selected = false;
projektArray[i][0] = archiv.projekt.options[i].text;
projektArray[i][1] = archiv.projekt.options[i].value;
}
for (i = 0; i < archiv.jahr.length; i++) {
jahrArray[i] = new Array();
archiv.jahr.options[i].selected = false;
jahrArray[i][0] = archiv.jahr.options[i].text;
jahrArray[i][1] = archiv.jahr.options[i].value;
}
for (i = 0; i < archiv.semester.length; i++) {
semesterArray[i] = new Array();
archiv.semester.options[i].selected = false;
semesterArray[i][0] = archiv.semester.options[i].text;
semesterArray[i][1] = archiv.semester.options[i].value;
}
for (i = 0; i < archiv.student.length; i++) {
studentArray[i] = new Array();
archiv.student.options[i].selected = false;
studentArray[i][0] = archiv.student.options[i].text;
studentArray[i][1] = archiv.student.options[i].value;
}
for (i = 0; i < archiv.dozent.length; i++) {
dozentArray[i] = new Array();
archiv.dozent.options[i].selected = false;
dozentArray[i][0] = archiv.dozent.options[i].text;
dozentArray[i][1] = archiv.dozent.options[i].value;
}
tagArray.sort();
projektArray.sort();
jahrArray.sort();
semesterArray.sort();
studentArray.sort();
dozentArray.sort();
var counterI = 0;
erstemal = ajaxResponse.split("@--@");
for(var counterI = 0; counterI < erstemal.length; counterI++){
var zweitemal = new Array();
zweitemal = erstemal[counterI].split("|=|");
for(var countJ = 0; countJ < zweitemal.length; countJ++){
var drittemal = new Array();
drittemal = zweitemal[countJ].split("@-@");
for(var countK = 0; countK < drittemal.length; countK++){
var viertemal = new Array();
viertemal = drittemal[countK].split("||");
if(zweitemal[0]=="tag"){
neueTag.push(viertemal[0]);
}
if(zweitemal[0]=="projekt"){
neueProjekte.push(viertemal[0]);
}
if(zweitemal[0]=="dozent"){
neueDozent.push(viertemal[0]);
}
if(zweitemal[0]=="jahr"){
neueJahr.push(viertemal[0]);
}
if(zweitemal[0]=="student"){
neueStudent.push(viertemal[0]);
}
if(zweitemal[0]=="semester"){
neueSemester.push(viertemal[0]);
}
}
}
}
alert("weidder");
neueTag.splice(0,1);
neueProjekte.splice(0,1);
neueJahr.splice(0,1);
neueSemester.splice(0,1);
neueStudent.splice(0,1);
neueDozent.splice(0,1);
finalProjekte = new Array();
finalJahr = new Array();
finalSemester = new Array();
finalDozent = new Array();
finalStudent = new Array();
finalTag = new Array();
for(var z = 0; z < tagArray.length; z++){
for(var y = 0; y < neueTag.length; y++){
if(tagArray[z][1] == neueTag[y]){
finalTag.push(tagArray[z]);
tagArray.splice(z, 1);
}
}
}
totalFertig6 = finalTag.concat(tagArray);
for (j = 0; j < totalFertig6.length; j++) {
archiv.tag.options[j].text = totalFertig6[j][0];
archiv.tag.options[j].value = totalFertig6[j][1];
}
for(var z = 0; z < projektArray.length; z++){
for(var y = 0; y < neueProjekte.length; y++){
if(projektArray[z][1] == neueProjekte[y]){
finalProjekte.push(projektArray[z]);
projektArray.splice(z, 1);
}
}
}
totalFertig = finalProjekte.concat(projektArray);
for (j = 0; j < totalFertig.length; j++) {
archiv.projekt.options[j].text = totalFertig[j][0];
archiv.projekt.options[j].value = totalFertig[j][1];
}
for(var z = 0; z < jahrArray.length; z++){
for(var y = 0; y < neueJahr.length; y++){
if(jahrArray[z][1] == neueJahr[y]){
finalJahr.push(jahrArray[z]);
jahrArray.splice(z, 1);
}
}
}
totalFertig2 = finalJahr.concat(jahrArray);
for (j = 0; j < totalFertig2.length; j++) {
archiv.jahr.options[j].text = totalFertig2[j][0];
archiv.jahr.options[j].value = totalFertig2[j][1];
}
for(var z = 0; z < semesterArray.length; z++){
for(var y = 0; y < neueSemester.length; y++){
if(semesterArray[z][1] == neueSemester[y]){
finalSemester.push(semesterArray[z]);
semesterArray.splice(z, 1);
}
}
}
totalFertig3 = finalSemester.concat(semesterArray);
for (j = 0; j < totalFertig3.length; j++) {
archiv.semester.options[j].text = totalFertig3[j][0];
archiv.semester.options[j].value = totalFertig3[j][1];
}
for(var z = 0; z < dozentArray.length; z++){
for(var y = 0; y < neueDozent.length; y++){
if(dozentArray[z][1] == neueDozent[y]){
finalDozent.push(dozentArray[z]);
dozentArray.splice(z, 1);
}
}
}
totalFertig4 = finalDozent.concat(dozentArray);
for (j = 0; j < totalFertig4.length; j++) {
archiv.dozent.options[j].text = totalFertig4[j][0];
archiv.dozent.options[j].value = totalFertig4[j][1];
}
for(var z = 0; z < studentArray.length; z++){
for(var y = 0; y < neueStudent.length; y++){
if(studentArray[z][1] == neueStudent[y]){
finalStudent.push(studentArray[z]);
studentArray.splice(z, 1);
}
}
}
totalFertig5 = finalStudent.concat(studentArray);
for (j = 0; j < totalFertig5.length; j++) {
archiv.student.options[j].text = totalFertig5[j][0];
archiv.student.options[j].value = totalFertig5[j][1];
}
for(i=0;i < finalProjekte.length; i++){
archiv.projekt.options[i].selected = true;
}
for(i=0;i < finalJahr.length; i++){
archiv.jahr.options[i].selected = true;
}
for(i=0;i < finalSemester.length; i++){
archiv.semester.options[i].selected = true;
}
for(i=0;i < finalDozent.length; i++){
archiv.dozent.options[i].selected = true;
}
for(i=0;i < finalStudent.length; i++){
archiv.student.options[i].selected = true;
}
for(i=0;i < finalTag.length; i++){
archiv.tag.options[i].selected = true;
}
}
}
}
</script>[/CODE]
Hallo,
ich mag mich täuschen, kann es sein, dass du soviel Arbeitsspeicher benötigst, dass sich mein Opera aufhängt?
Zum Testen wäre eine kleinere Datenmenge angenehmer ....
überblicken tue ich dein Script nicht, aber was machst du hier?
> for(i=0;i < finalProjekte.length; i++){
> archiv.projekt.options[i].selected = true;
> }
?? kann man mehr als eine Option auswählen?
Gruß plan_B
Dankesehr
Das ganze soll sowas wie eine facettensuche sein.
ich hab ne datenbank mit projekten und eben viele schlagwörter.
die riesige liste ist eben nur für die leute die sich wirklich durchkämpfen wollen.
klicke ich einen tag an sollen sich die anderen listen neu aufbauen.
die dazugehörigen projekte und studenten + kram nach oben rutschen.
Der codeschnipsel markiert dann die gefundenen projekte...
können auch mal 10 sein.
Hallo,
... weiss zwar immer noch nicht, was du per Ajax nachlädst. Habe aber selbst mal mit deinen Auswahllisten getestet, nur interessehalber - denn eine Auswahlliste mit über 11000 ( elftausend) Optionen - wer soll da was drin finden?
<form method="post" name="archiv">
<table border="0">
<tr>
<td colspan=6>
<input type="radio" name="sort" value="alphaab" onchange="chg_sort(this.form,true)"> alphabetisch absteigend
<input type="radio" name="sort" value="alphaauf" onChange="chg_sort(this.form,false)"> alphabetisch aufsteigend</td></tr>
<tr><td>
<select multiple size="20" id="tag" name="tag" >
<option value="1059"></option>
<option value="2">-</option>
<option value="1774">-ausstellung</option>
....
function chg_sort(form,revers) {
var sels=form.getElementsByTagName("select");
for (var i=0;i<sels.length;i++) {
alert(i+" "+sels[i].name+" sortieren " );
sel_sort(sels[i],revers);
}
}
function sel_sort(sel,revers) {
alert( "select-optionen sortieren: "+sel.name
+"\nOptionen: "+sel.options.length
+"\n" + ( revers? "descending " : "ascending") );
var arr= []; // all Optionen merken
for (var i=0, ie=sel.options.length; i<ie; i++) {
arr[i]=new Array(
sel.options[i].text,
sel.options[i].value,
sel.options[i].selected );
}
// Sortierfunktionen
function by_text(a,b) {
return a[0]<b[0] ? -1 : a[0] == b[0] ? 0 : 1 ;
}
function by_text_revers(a,b) {
return a[0]<b[0] ? +1 : a[0] == b[0] ? 0 : -1 ;
}
arr.sort(revers ? by_text_revers : by_text );
sel.options.length=0; // alle Optionen löschen
for (var i=0, ie=arr.length; i<ie; i++ ) {
sel.add(new Option(
arr[i][0],
arr[i][1],
0,
arr[i][2] ));
}
alert( "sort fertig: "+sel.name );
}
und mit diesem Verfahren dauert es eben auch einige Minuten ...
übrigens, der Validator hat einige Beanstandungen ...
Gruß plan_B
hier mal ne version.... gibt n paar alerts die ich reingebaut hab und
die scriptwarnung muss man auch wegklicken. is halt doch nicht ok das ding. viel zu viel....
ich hab mir schon sagen lassen das JSON ne lösung sein könnte.
aber ich hab nicht wirklich plan davon.
shit : hier der link :
hfg-forum.de/test/index.php