Keskustelu: Nettisivujen teko: Ongelmia Ajax.Formin kanssa

Pallo [11.01.2008 18:57:33]

Löysin hyvän esimerkin jota aion sivullani käyttää; http://demos.mootools.net/Ajax.Form
(Tämähän lähettää siis AJAXilla viereiseen diviin tiedot, jossa php tiedosto ottaa ne tiedot GET:illä talteen ilman sivun päivittämistä.)

Ongelmia tulee kuitenkin heti vastaan, kun ajaxia enkä js hallitse.

Teen seuraavasti:

<script type = "text/javascript">
window.addEvent('domready', function(){
			$('myForm').addEvent('submit', function(e) {
				/**
				 * Prevent the submit event
				 */
				new Event(e).stop();

				/**
				 * This empties the log and shows the spinning indicator
				 */
				var log = $('log_res').empty().addClass('ajax-loading');

				/**
				 * send takes care of encoding and returns the Ajax instance.
				 * onComplete removes the spinner from the log.
				 */
				this.send({
					update: log,
					onComplete: function() {
						log.removeClass('ajax-loading');
					}
				});
			});
		});
</script>

<h3>Send a Form with Ajax</h3>

<form id="myForm" action="tulosta.php" method="get">
	<div id="form_box">
		<div>
			<p>First Name:</p>
			<input type="text" name="first_name" value="John" />
		</div>

                 <div class="hr"><!-- spanner --></div>
		<input type="submit" name="button" id="submitter" />
	<span class="clr"><!-- spanner --></span>
	</div>
</form>
<div id="log">
	<h3>Ajax Response</h3>
	<div id="log_res"><!-- spanner --></div>
</div>
<span class="clr"><!-- spanner --></span>

Ja tulosta.php

<?php
echo $_GET['first_name'];
?>

Mikä oikein mättää?

Hakoulinen [11.01.2008 19:46:23]

Mikäs se ongelma itse oli?

Pallo [11.01.2008 20:03:18]

Kun lomakkeesta lähettää niin se siirtyy tulosta.php tiedostoon, kun lomakkeen
tiedot pitäisi saaha tuohon diviin.

Hakoulinen [11.01.2008 20:56:12]

<?php
print "<pre>".print_r($_POST, true)."</pre>";
?>

Kokeile tuolla koodilla mikä sieltä löytyy? Mutta muista vaihtaa POST muotoon

Pallo [11.01.2008 21:29:02]

Tuo tulosta.php toimii hyvin, mutta ongelmana taitaa olla tämä javascript:

window.addEvent('domready', function(){
            $('myForm').addEvent('submit', function(e) {
                /**
                 * Prevent the submit event
                 */
                new Event(e).stop();

                /**
                 * This empties the log and shows the spinning indicator
                 */
                var log = $('log_res').empty().addClass('ajax-loading');

                /**
                 * send takes care of encoding and returns the Ajax instance.
                 * onComplete removes the spinner from the log.
                 */
                this.send({
                    update: log,
                    onComplete: function() {
                        log.removeClass('ajax-loading');
                    }
                });
            });
        });

Mitä tuossa on väärin? IE:llä katsoessa selain valittaa että joitain on tuossa js koodissa väärin. Sivulla on toimiva esimerkki, mutta en vaan saa toimimaan.
(http://demos.mootools.net/Ajax.Form)

Lebe80 [11.01.2008 22:53:05]

Asenna firefoxiin firebug tms. jolla näet virheilmoituksen.

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Kirjautuminen

Haku

Tehtävät