开发者

Custom trigger event using prototype js not finding current pasted values

开发者 https://www.devze.com 2023-02-13 03:58 出处:网络
I\'m having an issue with the version of prototype in Richfaces 3.3.3. The code I list below worked fine before upgrading Richfaces.

I'm having an issue with the version of prototype in Richfaces 3.3.3.

The code I list below worked fine before upgrading Richfaces.

Event.observe('#{formName}:suggest', 'paste', this.handleMousePaste.bind(this));


        // Trigger keyup event when user copy and pastes data into field. (Using mouse to paste will not work without this fix)
        function handleMousePaste(event) {

            // Get element object event occured on
            var element = Event.element(event);

            // Trigger a keyup event which will send ajax request to server (Event already attached in Richfaces code)
            triggerEvent(element,'keyup');

        }

        // Create custom function that will allow us trigger an event anywhere in our javascript code
        function triggerEvent(element,event){
            if (document.createEventObject)
            {
                // dispatch for IE
                var evt = document.createEventObject();

                return element.fireEvent('on'+event,evt)
            }
            else
            {
                // dispatch for firefox + others
                var evt = document.createEvent("HTMLEvents");
                evt.initEvent(event, true, true ); // event type,bubbling,cancelable

                return !element.dispatchEvent(evt);
            }
        }

What it is doing: The handleMousePaste() is firing the keyup event which is attached to a input text field on my page (Via Richfaces a4j:suppoer tag)

<h:inputText value="#{myBean.typed}" id="suggest" styleClass="dataTableFilterField">
                <a4j:support event="onkeyup" reRender="Table1,tableScroller" ajaxSingle="true" requ开发者_高级运维estDelay="200" ignoreDupResponses="true" eventsQueue="filterQueue"/>     
            </h:inputText>

For some reason it is not picking up the value I paste into the input field 'suggest'. If I paste it in a second time it will pick up the first value I pasted in. For example: If I paste in 'Tom', the ajax request sends but the suggest field is blank. Now pasting in 'Tom2' I can see that the suggest value been sent is 'Tom' (The field contains 'TomTom2').

Like I said, this was behaving fine before upgrading Richfaces and therefore new version of Prototype I believe.

Any Ideas?


Managed to fix it. Attaching for anyone that has a similar problem.

// Attach js handlers when page content is fully loaded (Prototype.js framework)
                Event.observe(window, 'load', function() {

                    // Only attach event listener if the element exists on page
                    if ( $('#{formName}:suggest') ) {                   
                        Event.observe('#{formName}:suggest', 'paste', this.handleMousePaste.bind(this));
                    }   
                });


                // Trigger keyup event when user copies and pastes data into field. (Using mouse to paste will not work without this fix)
                function handleMousePaste(event) {

                    // Need to put a tiny delay in so the element has time to get the pasted in content.
                    setTimeout(function() {this.triggerEvent($('#{formName}:suggest'),'keyup')}, 10);
                }

                // Create custom function that will allow us trigger an event anywhere in our javascript code
                function triggerEvent(element,event){
                    if (document.createEventObject)
                    {
                        // dispatch for IE
                        var evt = document.createEventObject();

                        return element.fireEvent('on'+event,evt);
                    }
                    else
                    {
                        // dispatch for firefox + others
                        var evt = document.createEvent("HTMLEvents");
                        evt.initEvent(event, true, true ); // event type,bubbling,cancelable

                        return !element.dispatchEvent(evt);
                    }
                }
0

精彩评论

暂无评论...
验证码 换一张
取 消