webForumDet fria alternativet
Logga in / Bli medlem

Ajax problem

JavaScript

4 svar · 411 visningar · startad av jahadesign

jahadesignMedlem sedan okt. 200621 inlägg
Frågan#1

Hej,

Jag försöker sätta ihop ett php script som loopar ut ett formulär ca 10 ggr. (jag har ej med just den php-koden). Varje formulär får ett enskilt id-nummer, jag har indikerat detta med [number] i koden. Vad jag behöver hjälp med är att få vidare variabeln till [number] i funktionen "alertContents" i mail.js

Är detta möjligt? Skulle vara mycket tacksam för hjälp!!!!

mail.js

  var http_request = false;
   function makeRequest(url, parameters) {
      http_request = false;
      if (window.XMLHttpRequest) { // Mozilla, Safari,...
         http_request = new XMLHttpRequest();
         if (http_request.overrideMimeType) {
         	// set type accordingly to anticipated content type
            //http_request.overrideMimeType('text/xml');
            http_request.overrideMimeType('text/html');
         }
      } else if (window.ActiveXObject) { // IE
         try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (e) {
            try {
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
         }
      }
      if (!http_request) {
         alert('Cannot create XMLHTTP instance');
         return false;
      }
      http_request.onreadystatechange = alertContents;
      http_request.open('GET', url + parameters, true);
      http_request.send(null);
   }
   
   function alertContents() {
      if (http_request.readyState == 4) {
         if (http_request.status == 200) {
            //alert(http_request.responseText);
            result = http_request.responseText;
            document.getElementById('resultat[B][blue][number][/blue][/B]').innerHTML = result;
		 	document.getElementById('mailwaiting[B][blue][number][/blue][/B]').innerHTML = '';
         } else {
            alert('There was a problem with the request.');
         }
      } else {
            document.getElementById('mailwaiting[B][blue][number][/blue][/B]').innerHTML = '<img src="/kund/top15/images/mail/waiting.gif">';
	  }
  
   }
   
   function get(obj) {
      var getstr = "?";
      for (i=0; i<obj.childNodes.length; i++) {
         if (obj.childNodes[i].tagName == "INPUT") {
            if (obj.childNodes[i].type == "text") {
               getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
            }
            if (obj.childNodes[i].type == "checkbox") {
               if (obj.childNodes[i].checked) {
                  getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
               } else {
                  getstr += obj.childNodes[i].name + "=&";
               }
            }
            if (obj.childNodes[i].type == "radio") {
               if (obj.childNodes[i].checked) {
                  getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
               }
            }
         }   
         if (obj.childNodes[i].tagName == "SELECT") {
            var sel = obj.childNodes[i];
            getstr += sel.name + "=" + sel.options[sel.selectedIndex].value + "&";
         }
         if(obj.childNodes[i].tagName == "TEXTAREA") {
		 	getstr += obj.childNodes[i].name + "=" + obj.childNodes[i].value + "&";
		 }
      }
      makeRequest('test.php', getstr);
   }

index.php

<head>
<script type="text/javascript" src="js/mail.js"></script>
</head>
<body>
<div id="addCh">
  <div id="mailwaiting[number]"></div>
  <strong>Add Challenger</strong><br />
  <br />
  <form name="addForm[number]" id="addForm[number]" action="javascript:get(document.getElementById('addForm[number]'))">
    <input type="hidden" name="db" value="top15" />
    <input type="hidden" name="toplist" value="test" />
    <input type="hidden" name="number" value="[number]" />
    Your Name:<br />
    <input  type="text" name="yname"/>
    <br />
    <br />
    Your Email:<br />
    <input  type="text" name="ymail"/>
    <br />
    <br />
    Friend's Name:<br />
    <input  type="text" name="fname"/>
    <br />
    <br />
    Friend's Email:<br />
    <input type="text" name="fmail"/>
    <br />
    <br />
    <input type="submit"/>
  </form>
  <div id="resultat[number]"></div>
</div>
</body>

test.php

<?
print_r($_GET);
?>
emissionMedlem sedan dec. 19996 721 inlägg
#2

Vildkodat, men du förstår kanske principen.

1. Skicka med numret så att det blir tillgängligt för javascriptet.
2. Skapa onreadystatechange-handlern dynamiskt

mail.js

  var http_request = false;
   function makeRequest(url, parameters, [B][blue]number[/blue][/B]) {
      http_request = false;
      if (window.XMLHttpRequest) { // Mozilla, Safari,...
         http_request = new XMLHttpRequest();
         if (http_request.overrideMimeType) {
         	// set type accordingly to anticipated content type
            //http_request.overrideMimeType('text/xml');
            http_request.overrideMimeType('text/html');
         }
      } else if (window.ActiveXObject) { // IE
         try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (e) {
            try {
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
         }
      }
      if (!http_request) {
         alert('Cannot create XMLHTTP instance');
         return false;
      }
      http_request.onreadystatechange = [B][blue]function { alertContents(number); };[/blue][/B]
      http_request.open('GET', url + parameters, true);
      http_request.send(null);
   }
   
   function alertContents(number) {
      if (http_request.readyState == 4) {
         if (http_request.status == 200) {
            //alert(http_request.responseText);
            result = http_request.responseText;
            document.getElementById('resultat[B][blue]' + number [/blue][/B]).innerHTML = result;
		 	document.getElementById('mailwaiting[B][blue]' + number [/blue][/B]).innerHTML = '';
         } else {
            alert('There was a problem with the request.');
         }
      } else {
            document.getElementById('mailwaiting[B][blue]' + number [/blue][/B]).innerHTML = '<img src="/kund/top15/images/mail/waiting.gif">';
	  }
  
   }
   
   function get(obj,number) {
      var getstr = "?";
      [B][blue]var name;
      var value;[/blue][/B]
      for (i=0; i<obj.childNodes.length; i++) {
         name = null;
	 value = null;
	 if (obj.childNodes[i].tagName == "INPUT") {
            if (obj.childNodes[i].type == "text") {
	       [B][blue]name=obj.childNodes[i].name;
	       value=obj.childNodes[i].value;[/blue][/B]
            }
            if (obj.childNodes[i].type == "checkbox") {
               [B][blue]if (obj.childNodes[i].checked) {
                 name=obj.childNodes[i].name;
	         value=obj.childNodes[i].value;
	       }[/blue][/B]
            }
            if (obj.childNodes[i].type == "radio") {
               if (obj.childNodes[i].checked) {
                  [B][blue]name=obj.childNodes[i].name;
	         value=obj.childNodes[i].value;[/blue][/B]
               }
            }
         }   
         if (obj.childNodes[i].tagName == "SELECT") {
            var sel = obj.childNodes[i];
	    [B][blue]if (sel.selectedIndex>=0)
	    {
	       name=sel.name;
	       value=sel.options[sel.selectedIndex].value;
            }[/blue][/B]
	    
         }
         if(obj.childNodes[i].tagName == "TEXTAREA") {
	       [B][blue]name=obj.childNodes[i].name;
	       value=obj.childNodes[i].value;[/blue][/B]
	 }
	 [B][blue]if (name!=null && value!=null)
	 {
		getstr +=encodeURIComponent(name) + "=" + encodeURIComponent(value) + "&";
	 }[/blue][/B]
      }
      makeRequest('test.php', getstr, [B][blue]number[/blue][/B]);
   }

index.php

<head>
<script type="text/javascript" src="js/mail.js"></script>
</head>
<body>
<div id="addCh">
  <div id="mailwaiting[number]"></div>
  <strong>Add Challenger</strong><br />
  <br />
  <form name="addForm[number]" id="addForm[number]" action="javascript:get(document.getElementById('addForm[number]'),[number])">
    <input type="hidden" name="db" value="top15" />
    <input type="hidden" name="toplist" value="test" />
    <input type="hidden" name="number" value="[number]" />
    Your Name:<br />
    <input  type="text" name="yname"/>
    <br />
    <br />
    Your Email:<br />
    <input  type="text" name="ymail"/>
    <br />
    <br />
    Friend's Name:<br />
    <input  type="text" name="fname"/>
    <br />
    <br />
    Friend's Email:<br />
    <input type="text" name="fmail"/>
    <br />
    <br />
    <input type="submit"/>
  </form>
  <div id="resultat[number]"></div>
</div>
</body>
jahadesignMedlem sedan okt. 200621 inlägg
#3

det skumme är att det blir samma fel med det scriptet, så fort du börjar skicka med variblar i funcktion alertContents() så går det inte att få scriptet att komma till fas http_request.readyState == 4.

rätta mig om jag har fel, har testat nämligen att skiva in lite alert meddelanden i scriptet.

emissionMedlem sedan dec. 19996 721 inlägg
#4

Lite scopefel som jag inte såg. Något sånt här:


function createRequest()
{
	var http_request=false;
	if (window.XMLHttpRequest) { // Mozilla, Safari,...
         http_request = new XMLHttpRequest();
         if (http_request.overrideMimeType) {
            http_request.overrideMimeType('text/html');
         }
      } else if (window.ActiveXObject) { // IE
         try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (e) {
            try {
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
         }
      }
      if (!http_request) {
         alert('Cannot create XMLHTTP instance');
         return false;
      }
}

function makeRequest(url, parameters, number) {
      var http_request = createRequest();
      http_request.onreadystatechange = function { alertContents(number); };
      http_request.open('GET', url + parameters, true);
      http_request.send(null);

      function alertContents(number) {
      if (http_request.readyState == 4) {
         if (http_request.status == 200) {
            //alert(http_request.responseText);
            result = http_request.responseText;
            document.getElementById('resultat' + number ).innerHTML = result;
		 	document.getElementById('mailwaiting' + number ).innerHTML = '';
         } else {
            alert('There was a problem with the request.');
         }
      } else {
            document.getElementById('mailwaiting' + number ).innerHTML = '<img src="/kund/top15/images/mail/waiting.gif">';
	  }
  
   }
   }
jahadesignMedlem sedan okt. 200621 inlägg
#5

Läste på http://developer.mozilla.org/ och vad jag förstår går det bara att skicka vidare http_request variabeln. Får nämligen inte if och else satserna att funka innanför function alertContents(number) när jag kör med http_request.onreadystatechange = function { alertContents(number); };.

253 ms totalt · 4 externa anrop · v20260731065814-full.86ec41c2
118 ms — deklarationer (db)
0 ms — hämta statistik (cache)
130 ms — hämta tråd, inlägg och bilagor (db)
120 ms — ändringar (db)