Frage Javascript, AJAX, input per ID an javascript übergeben

[necromonger1983]

Hallo Forum-User,

ich absoluter Neuling und benötige bitte HILFE.

Ich möchte den eingegebenen Text in einer Textzeile an Javascript/AJAX übergeben.

<div class="form-group">
<label for="usr">Fahrgestellnummer eingeben</label>
<input type="text" class="form-control" id="usr">
</div>
<a href="javascript:anfordern('Übergabewert')" class="btn btn-info" role="button">Senden</a>

Ich möchte den Wert aus dem Input mit der id: usr an Javascript "Übergabewert" übergeben!

 

[Arne Drews]

Hallo,

Den Aufruf im Attribut href solltest Du vergessen, setze statt dessen einen Click-Handler auf den <a>-Tag.
Den Wert erhältst Du relativ easy direkt über das Tag-Objekt:

var _usr = document.getElementById( 'usr' );
anfordern( _usr.value );

 

[necromonger1983]

Danke für deine schnelle Antwort. Ich bekomme es einfach nicht hin. Nach dem einsetzen, startet anscheinend das Javascript garnicht mehr.

Mein umgebauter Code:

<script type="text/javascript">
        var rq;
        var _eingabe = document.getElementById( 'usr' );
        function anfordern()
        {
            alert( _eingabe.value );
            rq = new XMLHttpRequest();
            rq.open("post","http://www.***********.de/********/action_neu_anlegen.php", true);
            rq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            rq.send("fgst=" + _eingabe.value);
            rq.onreadystatechange = auswerten;
        }
        function auswerten()
        {
            if(rq.readyState == 4 && rq.status == 200) document.getElementById("meinediv").innerHTML = rq.responseText;
        }
        </script>

<div class="form-group">
            <label for="usr">Fahrgestellnummer eingeben</label>
            <input type="text" class="form-control" id="usr">
        </div>
        <p allign="right">
        <a href="javascript:anfordern" class="btn btn-info" role="button">Senden</a>
        </p>

Vielleicht hast du noch einen Tipp oder siehst den Fehler! Danke erstmal im Voraus!

Gruss

 

[Arne Drews]

window.onload = function() {

    document.getElementById( 'btnsend' ).addEventListener( 'click', function( ev ) {

        ev.preventDefault();

        var _rq = new XMLHttpRequest();
        var _eingabe = document.getElementById( 'usr' );

        _rq.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    document.getElementById( 'meinediv' ).innerHTML = this.responseText;
                }
            };

        _rq.open( 'post', 'http://www.***********.de/********/action_neu_anlegen.php', true );
        _rq.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
        _rq.send( 'fgst=' + _eingabe.value );

    });

};

<a href="#" id="btnsend" class="btn btn-info" role="button">Senden</a>

btw. das funktioniert natürlich nur, wenn die PHP-Datei auf derselben Domain liegt, wie das HTML-Dokument! Beispiel: XmlHttpRequest Demo