Ergebnis 1 bis 2 von 2
  1. #1
    elcomportal ist offline Grünschnabel
    registriert
    18-04-2017
    Beiträge
    2

    Am Ende der Funktion Klick simulieren

    Hallo,
    ich verwende bsn autosuggest für ein Suchformular. Das funktioniert auch gut, aber ich möchte nun, wenn ein Vorschlag angeklickt wird, daß nicht nur das Textfeld ausgefüllt wird, sondern das Formular auch abgesendet wird (wie bei ENTER)

    Hier das Formular:
    HTML-Code:
    <form method="post" action="/index.php/suchen">
    <div class="startsuchbox_div_links">
            <span style="position:relative; width:15%;  float:left; text-align:right;font-size: 1.5em; line-height:2em; margin-top:0.3em;">&nbsp;&nbsp; </span>
        <input type="text" id="testinput" value=""  name="starts_suche_plz" placeholder="Plz oder Ort eingeben" class="testinput" />&nbsp;
    </div>
    <div class="startsuchbox_div_rechts">
    <input type="submit" value="Suchen" name="starts_suche_submit" id="starts_suche_submit" style="position:relative; width:100%; font-size: 1.5em; line-height:2em; "/>
            <script type="text/javascript">
                var options = {
            script:"/autosuggest/test.php?json=true&",
            varname:"input",
            json:true,
            callback: function (obj) { document.getElementById('testid').value = obj.id; }
                };
                var as_json = new AutoSuggest('testinput', options);
            </script>
    </div>
    <div style="clear:both;"></div>
    </form>

    Und hier ist die .js-Datei (im Headerbereich eingebunden). Die Funktion, die beim anklicken des Eintrags ausgeführt wird habe ich fett geschrieben. Am Ende dieser Funktion müßte ich einen Klick auf den Button "starts_suche_submit" simulieren, um das Formular abzusenden. Hatte es mit document.getElementById('starts_suche_submit').click(); probiert, aber das zeigte keinerlei Wirkung.



    Code:
    
    var useBSNns;
    
    if (useBSNns)
    {
        if (typeof(bsn) == "undefined")
            bsn = {}
        _bsn = bsn;
    }
    else
    {
        _bsn = this;
    }
    
    if (typeof(_bsn.Autosuggest) == "undefined")
        _bsn.Autosuggest = {}
    
    _bsn.AutoSuggest = function (fldID, param)
    {
        if (!document.getElementById)
            return false;
        this.fld = _bsn.DOM.getElement(fldID);
    
        if (!this.fld)
            return false;
    
        this.sInput         = "";
    
        this.nInputChars     = 0;
        this.aSuggestions     = [];
        this.iHighlighted     = 0;
    
        this.oP = (param) ? param : {};
    
        if (!this.oP.minchars)                                    this.oP.minchars = 1;
        if (!this.oP.method)                                    this.oP.meth = "get";
        if (!this.oP.varname)                                    this.oP.varname = "input";
        if (!this.oP.className)                                    this.oP.className = "autosuggest";
        if (!this.oP.timeout)                                    this.oP.timeout = 100000;
        if (!this.oP.delay)                                        this.oP.delay = 250;
        if (!this.oP.offsety)                                    this.oP.offsety = -5;
        if (!this.oP.shownoresults)                                this.oP.shownoresults = true;
        if (!this.oP.noresults)                                    this.oP.noresults = "Keine &Uuml;bereinstimmung!";
        if (!this.oP.maxheight && this.oP.maxheight !== 0)        this.oP.maxheight = 250;
        if (!this.oP.cache && this.oP.cache != false)            this.oP.cache = false;
    
        var pointer = this;
    
        this.fld.onkeypress     = function(ev){ return pointer.onKeyPress(ev); }
        this.fld.onkeyup         = function(ev){ return pointer.onKeyUp(ev); }
    
        this.fld.setAttribute("autocomplete","off");
    }
    
    _bsn.AutoSuggest.prototype.onKeyPress = function(ev)
    {
        var key = (window.event) ? window.event.keyCode : ev.keyCode;
    
        var RETURN = 13;
        var TAB = 9;
        var ESC = 27;
    
        var bubble = true;
    
        switch(key)
        {
            case RETURN:
                this.setHighlightedValue();
                bubble = false;
                break;
    
            case ESC:
                this.clearSuggestions();
                break;
        }
    
        return bubble;
    }
    
    
    
    _bsn.AutoSuggest.prototype.onKeyUp = function(ev)
    {
        var key = (window.event) ? window.event.keyCode : ev.keyCode;
    
    
        var ARRUP = 38;
        var ARRDN = 40;
        var bubble = true;
        switch(key)
        {
            case ARRUP:
                this.changeHighlight(key);
                bubble = false;
                break;
    
    
            case ARRDN:
                this.changeHighlight(key);
                bubble = false;
                break;
    
    
            default:
                this.getSuggestions(this.fld.value);
        }
    
        return bubble;
    
    
    }
    
    
    
    
    
    
    
    
    _bsn.AutoSuggest.prototype.getSuggestions = function (val)
    {
        if (val == this.sInput)
            return false;
    
    
        if (val.length < this.oP.minchars)
        {
            this.sInput = "";
            return false;
        }
    
    
        if (val.length>this.nInputChars && this.aSuggestions.length && this.oP.cache)
        {
            var arr = [];
            for (var i=0;i<this.aSuggestions.length;i++)
            {
                if (this.aSuggestions[i].value.substr(0,val.length).toLowerCase() == val.toLowerCase())
                    arr.push( this.aSuggestions[i] );
            }
    
            this.sInput = val;
            this.nInputChars = val.length;
            this.aSuggestions = arr;
    
            this.createList(this.aSuggestions);
    
    
    
            return false;
        }
        else
        {
            this.sInput = val;
            this.nInputChars = val.length;
    
    
            var pointer = this;
            clearTimeout(this.ajID);
            this.ajID = setTimeout( function() { pointer.doAjaxRequest() }, this.oP.delay );
        }
    
        return false;
    }
    
    
    
    
    
    _bsn.AutoSuggest.prototype.doAjaxRequest = function ()
    {
    
        var pointer = this;
    
        var url = this.oP.script+this.oP.varname+"="+escape(this.fld.value);
        var meth = this.oP.meth;
    
        var onSuccessFunc = function (req) { pointer.setSuggestions(req) };
        var onErrorFunc = function (status) { alert("AJAX error: "+status); };
    
        var myAjax = new _bsn.Ajax();
        myAjax.makeRequest( url, meth, onSuccessFunc, onErrorFunc );
    }
    
    
    
    
    
    _bsn.AutoSuggest.prototype.setSuggestions = function (req)
    {
        this.aSuggestions = [];
    
        if (this.oP.json)
        {
            var jsondata = eval('(' + req.responseText + ')');
    
            for (var i=0;i<jsondata.results.length;i++)
            {
                this.aSuggestions.push(  { 'id':jsondata.results[i].id, 'value':jsondata.results[i].value, 'info':jsondata.results[i].info }  );
            }
        }
        else
        {
    
            var xml = req.responseXML;
    
            var results = xml.getElementsByTagName('results')[0].childNodes;
    
            for (var i=0;i<results.length;i++)
            {
                if (results[i].hasChildNodes())
                    this.aSuggestions.push(  { 'id':results[i].getAttribute('id'), 'value':results[i].childNodes[0].nodeValue, 'info':results[i].getAttribute('info') }  );
            }
    
        }
    
        this.idAs = "as_"+this.fld.id;
    
    
        this.createList(this.aSuggestions);
    
    }
    
    
    _bsn.AutoSuggest.prototype.createList = function(arr)
    {
        var pointer = this;
    
        _bsn.DOM.removeElement(this.idAs);
        this.killTimeout();
    
    
        var div = _bsn.DOM.createElement("div", {id:this.idAs, className:this.oP.className});
    
        var hcorner = _bsn.DOM.createElement("div", {className:"as_corner"});
        var hbar = _bsn.DOM.createElement("div", {className:"as_bar"});
        var header = _bsn.DOM.createElement("div", {className:"as_header"});
        header.appendChild(hcorner);
        header.appendChild(hbar);
        div.appendChild(header);
    
    
    
        var ul = _bsn.DOM.createElement("ul", {id:"as_ul"});
    
    
       for (var i=0;i<arr.length;i++)
        {
            var val = arr[i].value;
            var st = val.toLowerCase().indexOf( this.sInput.toLowerCase() );
            var output = val.substring(0,st) + "<em>" + val.substring(st, st+this.sInput.length) + "</em>" + val.substring(st+this.sInput.length);
    
    
            var span         = _bsn.DOM.createElement("span", {}, output, true);
            if (arr[i].info != "")
            {
                var br            = _bsn.DOM.createElement("br", {});
                span.appendChild(br);
                var small        = _bsn.DOM.createElement("small", {}, arr[i].info);
                //span.appendChild(small);
    
    
    
            }
    
            var a             = _bsn.DOM.createElement("a", { href:"#" });
    
            var tl         = _bsn.DOM.createElement("span", {className:"tl"}, " ");
            var tr         = _bsn.DOM.createElement("span", {className:"tr"}, " ");
            a.appendChild(tl);
            a.appendChild(tr);
    
            a.appendChild(span);
    
            a.name = i+1;
            a.onclick = function () { pointer.setHighlightedValue(); return false; }
            a.onmouseover = function () { pointer.setHighlight(this.name); }
    
            var li             = _bsn.DOM.createElement(  "li", {}, a  );
    
    
            ul.appendChild( li );
    
        }
    
    
        if (arr.length == 0)
        {
                    document.getElementById("tsession").value = '';
    
            var li             = _bsn.DOM.createElement(  "li", {className:"as_warning"}, this.oP.noresults  );
    
            ul.appendChild( li );
        }
    
    
        div.appendChild( ul );
    
    
        var fcorner = _bsn.DOM.createElement("div", {className:"as_corner"});
        var fbar = _bsn.DOM.createElement("div", {className:"as_bar"});
        var footer = _bsn.DOM.createElement("div", {className:"as_footer"});
        footer.appendChild(fcorner);
        footer.appendChild(fbar);
        div.appendChild(footer);
    
    
    
        var pos = _bsn.DOM.getPos(this.fld);
    
        div.style.left         = pos.x + "px";
        div.style.top         = ( pos.y + this.fld.offsetHeight + this.oP.offsety ) + "px";
        div.style.width     = this.fld.offsetWidth + "px";
    
    
    
        div.onmouseover     = function(){ pointer.killTimeout() }
        div.onmouseout         = function(){ pointer.resetTimeout() }
    
    
        document.getElementsByTagName("body")[0].appendChild(div);
    
    
    
        this.iHighlighted = 0;
    
    
    
    
    
    
        var pointer = this;
        this.toID = setTimeout(function () { pointer.clearSuggestions() }, this.oP.timeout);
    }
    
    
    
    _bsn.AutoSuggest.prototype.changeHighlight = function(key)
    {
        var list = _bsn.DOM.getElement("as_ul");
        if (!list)
            return false;
    
        var n;
    
        if (key == 40)
            n = this.iHighlighted + 1;
        else if (key == 38)
            n = this.iHighlighted - 1;
    
    
        if (n > list.childNodes.length)
            n = list.childNodes.length;
        if (n < 1)
            n = 1;
    
    
        this.setHighlight(n);
    }
    
    
    
    _bsn.AutoSuggest.prototype.setHighlight = function(n)
    {
        var list = _bsn.DOM.getElement("as_ul");
        if (!list)
            return false;
    
        if (this.iHighlighted > 0)
            this.clearHighlight();
    
        this.iHighlighted = Number(n);
    
        list.childNodes[this.iHighlighted-1].className = "as_highlight";
    
    
        this.killTimeout();
    }
    
    
    _bsn.AutoSuggest.prototype.clearHighlight = function()
    {
        var list = _bsn.DOM.getElement("as_ul");
        if (!list)
            return false;
    
        if (this.iHighlighted > 0)
        {
            list.childNodes[this.iHighlighted-1].className = "";
            this.iHighlighted = 0;
        }
    }
    
    
    _bsn.AutoSuggest.prototype.setHighlightedValue = function ()
    {
    
        if (this.iHighlighted)
        {
            document.getElementById("tsession").value = this.aSuggestions[ this.iHighlighted -1].info;
            this.sInput = this.fld.value = this.aSuggestions[ this.iHighlighted-1 ].value;
    
            this.fld.focus();
            if (this.fld.selectionStart)
                this.fld.setSelectionRange(this.sInput.length, this.sInput.length);
    
    
            this.clearSuggestions();
    
            if (typeof(this.oP.callback) == "function")
                this.oP.callback( this.aSuggestions[this.iHighlighted-1] );
    
    
    
        }
        else {
    
    
    _bsn.AutoSuggest.prototype.setHighlight(1);
    
            this.sInput = this.fld.value = this.aSuggestions[ this.iHighlighted ].value;
    
            this.fld.focus();
            if (this.fld.selectionStart)
                this.fld.setSelectionRange(this.sInput.length, this.sInput.length);
    
    
            this.clearSuggestions();
    
            if (typeof(this.oP.callback) == "function")
                this.oP.callback( this.aSuggestions[this.iHighlighted-1] );
        }
    
    
    }
    
    
    _bsn.AutoSuggest.prototype.killTimeout = function()
    {
        clearTimeout(this.toID);
    }
    
    _bsn.AutoSuggest.prototype.resetTimeout = function()
    {
        clearTimeout(this.toID);
        var pointer = this;
        this.toID = setTimeout(function () { pointer.clearSuggestions() }, 1000);
    }
    
    
    
    
    _bsn.AutoSuggest.prototype.clearSuggestions = function ()
    {
    
        this.killTimeout();
    
        var ele = _bsn.DOM.getElement(this.idAs);
        var pointer = this;
        if (ele)
        {
            var fade = new _bsn.Fader(ele,1,0,250,function () { _bsn.DOM.removeElement(pointer.idAs) });
        }
    }
    
    
    
    // AJAX PROTOTYPE _____________________________________________
    
    
    if (typeof(_bsn.Ajax) == "undefined")
        _bsn.Ajax = {}
    
    
    
    _bsn.Ajax = function ()
    {
        this.req = {};
        this.isIE = false;
    }
    
    
    
    _bsn.Ajax.prototype.makeRequest = function (url, meth, onComp, onErr)
    {
    
        if (meth != "POST")
            meth = "GET";
    
        this.onComplete = onComp;
        this.onError = onErr;
    
        var pointer = this;
    
        // branch for native XMLHttpRequest object
        if (window.XMLHttpRequest)
        {
            this.req = new XMLHttpRequest();
            this.req.onreadystatechange = function () { pointer.processReqChange() };
            this.req.open("GET", url, true); //
            this.req.send(null);
        // branch for IE/Windows ActiveX version
        }
        else if (window.ActiveXObject)
        {
            this.req = new ActiveXObject("Microsoft.XMLHTTP");
            if (this.req)
            {
                this.req.onreadystatechange = function () { pointer.processReqChange() };
                this.req.open(meth, url, true);
                this.req.send();
            }
        }
    }
    
    
    _bsn.Ajax.prototype.processReqChange = function()
    {
    
        // only if req shows "loaded"
        if (this.req.readyState == 4) {
            // only if "OK"
            if (this.req.status == 200)
            {
                this.onComplete( this.req );
            } else {
                this.onError( this.req.status );
            }
        }
    }
    
    
    
    
    // DOM PROTOTYPE _____________________________________________
    
    
    if (typeof(_bsn.DOM) == "undefined")
        _bsn.DOM = {}
    
    
    
    
    _bsn.DOM.createElement = function ( type, attr, cont, html )
    {
        var ne = document.createElement( type );
        if (!ne)
            return false;
    
        for (var a in attr)
            ne[a] = attr[a];
    
        if (typeof(cont) == "string" && !html)
            ne.appendChild( document.createTextNode(cont) );
        else if (typeof(cont) == "string" && html)
            ne.innerHTML = cont;
        else if (typeof(cont) == "object")
            ne.appendChild( cont );
    
        return ne;
    }
    
    
    
    
    
    _bsn.DOM.clearElement = function ( id )
    {
        var ele = this.getElement( id );
    
        if (!ele)
            return false;
    
        while (ele.childNodes.length)
            ele.removeChild( ele.childNodes[0] );
    
        return true;
    }
    
    
    
    _bsn.DOM.removeElement = function ( ele )
    {
        var e = this.getElement(ele);
    
        if (!e)
            return false;
        else if (e.parentNode.removeChild(e))
            return true;
        else
            return false;
    }
    
    
    
    
    
    _bsn.DOM.replaceContent = function ( id, cont, html )
    {
        var ele = this.getElement( id );
    
        if (!ele)
            return false;
    
        this.clearElement( ele );
    
        if (typeof(cont) == "string" && !html)
            ele.appendChild( document.createTextNode(cont) );
        else if (typeof(cont) == "string" && html)
            ele.innerHTML = cont;
        else if (typeof(cont) == "object")
            ele.appendChild( cont );
    }
    
    
    
    _bsn.DOM.getElement = function ( ele )
    {
        if (typeof(ele) == "undefined")
        {
            return false;
        }
        else if (typeof(ele) == "string")
        {
            var re = document.getElementById( ele );
            if (!re)
                return false;
            else if (typeof(re.appendChild) != "undefined" ) {
                return re;
            } else {
                return false;
            }
        }
        else if (typeof(ele.appendChild) != "undefined")
            return ele;
        else
            return false;
    }
    
    
    
    
    
    
    
    _bsn.DOM.appendChildren = function ( id, arr )
    {
        var ele = this.getElement( id );
    
        if (!ele)
            return false;
    
    
        if (typeof(arr) != "object")
            return false;
    
        for (var i=0;i<arr.length;i++)
        {
            var cont = arr[i];
            if (typeof(cont) == "string")
                ele.appendChild( document.createTextNode(cont) );
            else if (typeof(cont) == "object")
                ele.appendChild( cont );
        }
    }
    
    
    
    
    
    
    
    
    
    _bsn.DOM.getPos = function ( ele )
    {
        var ele = this.getElement(ele);
    
        var obj = ele;
    
        var curleft = 0;
        if (obj.offsetParent)
        {
            while (obj.offsetParent)
            {
                curleft += obj.offsetLeft
                obj = obj.offsetParent;
            }
        }
        else if (obj.x)
            curleft += obj.x;
    
    
        var obj = ele;
    
        var curtop = 0;
        if (obj.offsetParent)
        {
            while (obj.offsetParent)
            {
                curtop += obj.offsetTop
                obj = obj.offsetParent;
            }
        }
        else if (obj.y)
            curtop += obj.y;
    
        return {x:curleft, y:curtop}
    }
    
    
    
    
    
    
    
    
    
    
    // FADER PROTOTYPE _____________________________________________
    
    
    
    if (typeof(_bsn.Fader) == "undefined")
        _bsn.Fader = {}
    
    
    
    
    
    _bsn.Fader = function (ele, from, to, fadetime, callback)
    {
        if (!ele)
            return false;
    
        this.ele = ele;
    
        this.from = from;
        this.to = to;
    
        this.callback = callback;
    
        this.nDur = fadetime;
    
        this.nInt = 50;
        this.nTime = 0;
    
        var p = this;
        this.nID = setInterval(function() { p._fade() }, this.nInt);
    }
    
    
    
    
    _bsn.Fader.prototype._fade = function()
    {
    
        this.nTime += this.nInt;
    
        var ieop = Math.round( this._tween(this.nTime, this.from, this.to, this.nDur) * 100 );
        var op = ieop / 100;
    
        if (this.ele.filters) // internet explorer
        {
            try
            {
                this.ele.filters.item("DXImageTransform.Microsoft.Alpha").opacity = ieop;
            } catch (e) {
                // If it is not set initially, the browser will throw an error.  This will set it if it is not set yet.
                this.ele.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity='+ieop+')';
            }
        }
        else // other browsers
        {
            this.ele.style.opacity = op;
        }
    
    
        if (this.nTime == this.nDur)
        {
            clearInterval( this.nID );
            if (this.callback != undefined)
                this.callback();
        }
    }
    
    
    
    _bsn.Fader.prototype._tween = function(t,b,c,d)
    {
        return b + ( (c-b) * (t/d) );
    }

  2. #2
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.688

    AW: Am Ende der Funktion Klick simulieren

    Zitat Zitat von elcomportal Beitrag anzeigen
    Am Ende dieser Funktion müßte ich einen Klick auf den Button "starts_suche_submit" simulieren, um das Formular abzusenden.
    Nein musst du nicht. Das Formular kannst du mit FORM_NODE.submit() absenden.

    PS: die ID "testid" gibt es in deinem HTML gar nicht...

Ähnliche Themen

  1. Variable nach Funktion ende erhalten??
    Von TitanNano im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 03-02-2011, 20:02
  2. Klick simulieren mit JS
    Von ITrun90 im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 04-05-2010, 12:13
  3. Ok Button klick simulieren
    Von WARFIRE im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 30-08-2009, 02:15
  4. Antworten: 3
    Letzter Beitrag: 27-06-2008, 18:01
  5. Antworten: 2
    Letzter Beitrag: 02-06-2005, 14:50

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •