prototypejs / prototype Goto Github PK

previous lighthouse ticket #499
by kangjin jun

this method is evaluate code in comments

sample: <!-- <script> alert('1'); </script> -->

extractScripts: function() {

var matchAll = new RegExp(Prototype.ScriptFragment, 'img');
var matchOne = new RegExp(Prototype.ScriptFragment, 'im');
return (this.match(matchAll) || []).map(function(scriptTag) {
  return (scriptTag.match(matchOne) || ['', ''])[1];
});

},

debuged code -->

stripComments:function(){
return this.replace(/<\!--[\S\s]*?-->/, '');

},

extractScripts: function() {

var matchAll = new RegExp(Prototype.ScriptFragment, 'img');
var matchOne = new RegExp(Prototype.ScriptFragment, 'im');
return (this.stripComments().match(matchAll) || []).map(function(scriptTag) {
  return (scriptTag.match(matchOne) || ['', ''])[1];
});

},

previous lighthouse ticket #293
by dave mankoff

 setOpacity: function(element, value) {
    element = $(element);
    element.style.opacity = (value == 1 || value === '') ? '' :
      (value < 0.00001) ? 0 : value;
    return element;
  }

For elements that have an opacity of non-1 set in their stylesheet, calls to setOpacity(1) do not behave as expected - they simply set the opacity to that of the stylesheet.

I think a simple fix would be to remove the value == 1 check.

previous lighthouse ticket #3101
by Eric Friedman

Although the following prototype 1.7.1 statement works as expected in Chrome and IE10, it fails to set the background color of titleDiv in Firefox 20:
titleDiv.setStyle({ "background-color": titleBackgroundColor });

However, the following standard javascript statement works just fine in all 3 browsers:
titleDiv.style.backgroundColor = titleBackgroundColor;

previous lighthouse ticket #3505
by Jonathan

It's a timing issue, any line of code inserted before the IF statement fixes the issue.
Issue is IE10 only.

function getDimensions(element) {
    element = $(element);
    var display = Element.getStyle(element, 'display');

    for (var i = 0; i < 10; i++) // Fixes a rare issue where IE10 returns a width of 0 when display is true but element is still being rendered.
        if (element.offsetWidth && element.offsetHeight)
            break;

    if (display && display !== 'none') {
        return { width: element.offsetWidth, height: element.offsetHeight };
    }

previous lighthouse ticket #3507
by Marc Loonus

Prototype JavaScript framework, version 1.7.1
Windows 7 64-bit (WoW64)

Uncaught TypeError: Object [object Object] has no method 'dispatchEvent' on line 6598

function fireEvent_DOM(element, eventName, memo, bubble){}
Check Website http://akkufischer.de/tools

FF 23.01, IE10,OPERA 15.0, Safari 5.1.7(7534.57.2) continue showing Thumbs
Chrome (28.0.1500.98) stop the script

Thank you!

previous lighthouse ticket #3527
by Clemens Schwaighofer

Prototype 1.7.1.0
Chrome: 29.0.1547.65
Firefox: 23.0.1

Code HTML:

Foo 1 Foo 2
Code JS:

// select the input (radio) button data
var content = $('radioGroup').select('input');
// read in the HTML for this group
var target = $('radioGroup').innerHTML;
// replace the option 1 with option 3
var data_replace = new RegExp('radio_option_1', "g");
target = target.replace(data_replace, 'radio_option_3');
// pre read the select data before the update, radio button flags OK
content.each(function(v) {
    console.log('Before: ID: %s, checked: %s', v.id, v.checked);
});
// update the radioGroup div with the new changed data
$('radioGroup').update(target);
// radio button data is reset in Chrome
content.each(function(v) {
    console.log('After: ID: %s, checked: %s', v.id, v.checked);
});
}

Explanation:

The above script reads the input elements into a holding variable to keep the current selected stated.
Then it reads the whole div element and replaces the id from one element.
If the update is now run on the div with the new HTML data, in Chrome the previous selected element in the "content" variable is set to false. In Firefox it still shows the element as selected.

Problem:

The content from the select should not be connected to changes in the DOM.

Workaround:

For every radio element, a hash with id => state has to be created and used instead of the data from the original select read.

previous lighthouse ticket #1049
by Taloncor

Cloning a select-element won't clone the selectedIndex property of the original element.

Browser: Firefox 3.6.3 (Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.2.3) Gecko/20100401 SUSE/3.6.3-1.2 Firefox/3.6.3)

<html>
    <head>
        <script language="Javascript" src="prototype.js" type="text/javascript">
        </script>
    </head>
    <body>

        <select id="select_id">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
        </select>

        <script language="Javascript" type="text/javascript">
            $('select_id').observe("change", function(e) {
                var the_clone = $('select_id').clone(true);
                alert($('select_id').selectedIndex +"!="+the_clone.selectedIndex);
            });
        </script>

    </body>
</html>

previous lighthouse ticket #1653
by Deb

element.fireEvent(event.eventType, event);

return event;
Hello!

I'm a novice and am working on a family website. Everything is great except for the above script error being received in IE7 and IE8. I have absolutely no idea how to fix this as I've never worked with javascript, etc. I've tried using Google to research, but so far nothing recommended has worked. It could be me, though, as I have no skill with this, so all I can do is basically copy and paste the code where needed. Most of the explanations go right over my head! Hoping someone can help me out with this. Below is the code surrounding the line that the debugger says is causing the error:

function fireEvent_IE(element, eventName, memo, bubble) {

var event = document.createEventObject();
event.eventType = bubble ? 'ondataavailable' : 'onlosecapture';

event.eventName = eventName;
event.memo = memo;

element.fireEvent(event.eventType, event);
return event;
}

var fireEvent = document.createEvent ? fireEvent_DOM : fireEvent_IE;

Event.Handler = Class.create({

initialize: function(element, eventName, selector, callback) {
  this.element   = $(element);
  this.eventName = eventName;
  this.selector  = selector;
  this.callback  = callback;
  this.handler   = this.handleEvent.bind(this);
},

If you need more info, I'll be happy to supply it. Thank you very much for your help!

Deb

previous lighthouse ticket #3508
by Arnaud Dvl

Actually, the 1.7 version of prototype thinks that IE11 is a Mozilla browser.
You can have a look at this link to see all the removed API:
http://msdn.microsoft.com/en-us/library/ie/bg182625(v=vs.85).aspx

In particular, document.all and attachEvent have been removed.

previous lighthouse ticket #1278
by Jared Fedorchuk

Since browser detection is used for the getStyle and setOpacity functions you run into problems with IE 9 when using the scriptaculous fade/appear affects.

It seemed to me that IE9 was using the filter\alpha and regular opacity which was causing problems. I made it so it would only modify the opacity property.

I fixed it for my purposes by changing line 2539 from

else if (Prototype.Browser.IE) {
to

else if(navigator.appVersion.match(/MSIE\s+(?:6|7|8)\./)) {
and line 2742 from

else if (Prototype.Browser.Gecko && /rv:1\.8\.0/.test(navigator.userAgent)) {
to

else if (Prototype.Browser.Gecko && /rv:1\.8\.0/.test(navigator.userAgent) || document.all) {

previous lighthouse ticket #3515
by Ilya

When element have empty (boolean) attribute, search by this attribute without required value returns empty list.

< span my_attr>1
< span my_attr='x'>2

prototype 1.6.1:
$$('[my_attr]') -> 1,2

$$('[my_attr=]') -> 1

$$('[my_attr="x"]') -> 2

works in all browser

prototype 1.7.1:
IE7
$$('[my_attr]') -> 2

$$('[my_attr=]') -> 1

$$('[my_attr="x"]') -> 2

other browsers
$$('[my_attr]') -> 1,2

$$('[my_attr=]') -> 1

$$('[my_attr="x"]') -> 2

Didn't check IE6 (who cares?)
Similar bug fixed in jQuery: http://bugs.jquery.com/ticket/5637

previous lighthouse ticket #1125
by arno

Hi,
Element.insert(node) does not work when node is a text node:

var el = new Element('a', { href: 'link'});
var text = document.createTextNode('content');
el.insert(text);

will fail with exception:
"insert is undefined" on line 2054 for 1.7_rc2

that's because

if (Object.isString(insertions) || Object.isNumber(insertions) ||
    Object.isElement(insertions) || (insertions && (insertions.toElement || insertions.toHTML)))

previous lighthouse ticket #1315
by Victor

Add please "outline-width" (or just "outline") to the list of CSS properties calculated by Element.Layout.

It would be great also to make function getPixelValue() publicly accessible, e.g. as Element.Layout.getPixelValue() to use with the values not currently present in Element.Layout.

Why is the HEAD method excluded from Ajax.Request?

It should be a standard method supported by all browsers.

Correct me if I'm wrong.

previous lighthouse ticket #1399
by Pablo Biscayart

From the Javascript code in my web application, I do the following call:

request = new Ajax.Request(url, { method: "POST", parameters: qstring, onComplete: Process_Response } );

Assuming that the url and qstring are correct (the call works fine and work on Firefox), the flow will lead to Ajax.Request in prototype, which contains the following lines:

if (params = Object.toQueryString(params)) {

  // when GET, append parameters to URL
  if (this.method == 'get')
    this.url += (this.url.include('?') ? '&' : '?') + params;
  else if (/Konqueror|Safari|KHTML/.test(navigator.userAgent))
    params += '&_=';
}

This code adds an extra parameter ("_") to the query string when using Chrome, and when the flow reaches the following (located below in a try-catch block after the previous code):

this.body = this.method == 'post' ? (this.options.postBody || params) : null;
this.transport.send(this.body);

the call to the URL will fail due to signature mismatch, and my web app stops working. That hard-wiring of the browser names is pretty ugly indeed. Is this solvable in a way that you don't discriminate among browsers?
This looks the same in 1.6.0 and 1.6.0.2. If I was not clear enough, please contact me and accept my apologies.

Thank you,
Pablo

previous lighthouse ticket #3036
by Alex K

Hello,

This behavior only started with some recent iOS update.

I have some data displayed inside the container.
When i call ajax.updater to reload the content info, entire old content is removed, window repositioned (scroll) and then few seconds after new contend is loaded. The height is constant in all blocks i am loading.

This behavior creates flickering and repositions scroll bars to the the of the page.

Before, it would only replace the old content with the new, once it is all loaded, without any animation, in instant.

Did a lot of googling with no result.
Prototype call: var myAjax = new Ajax.Updater('response', 'engine.php', {method: 'get', parameters: pars, evalScripts: true});

iOS 6.1.3, 6.1.2, current Prototype

Thank you

previous lighthouse ticket #3309
by Emil Grau

Hello,

When I use "setOpacity" on a "virtual" DOM element (element not yet inserted), with IE7, it doesn't work since 1.7.1.

Example : just test this JS line :
new Element('div').setOpacity(0)

Browser : IE7

works until 1.7.0, breaks on 1.7.1

Regards

E. Grau

previous lighthouse ticket #3284
by Marques Lee

The logic for margin removal compensation for positionedOffset is incorrect.

The left margin should not be subtracted from the vertical coordinate, and the top margin should not be subtracted from the horizontal coordinate.

See prototype 1.7.1, lines 4050 - 4051, introduced in commit a7b2113:

    valueL -= layout.get('margin-top');
    valueT -= layout.get('margin-left');

It should probably be:

    valueL -= layout.get('margin-left');
    valueT -= layout.get('margin-top');

previous lighthouse ticket #1659
by Karl Stubsjoen

Measuring the top of an absolutely positioned div element with a margin-left value > 0 results in a bad top measurement. I'm getting a negative value. I've attached a sample HTML and script that I have tested with.
It does not seem to be an issue if you use the left property instead of margin-left.

Thanks Karl..

<!DOCTYPE html SYSTEM "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head><title></title>
    <style type="text/css">
        div {
        position:absolute;
        top:150px;
        left:20px;
        height:200px;
        width:200px;
        border:solid 1pt red;
        }
        #div2 {
            border-color:blue;
            margin-left:220px;
        }
    </style>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"></script>
    <script type="text/javascript">
        function test() {
            var areas = [$('div1'),$('div2')];
            areas.each(function(area) {
               var adjusted_height = document.viewport.getHeight() - area.measure('top') - 30;
               area.setStyle({'height':adjusted_height.toString() + 'px'});
              });
        }
        document.observe('dom:loaded', function() {
            $('test').on('click',test);
        });
    </script>
    </head>
    <body>
        <button id="test">Test</button>
        <div id="div1">div1</div>
        <div id="div2">div1</div>
    </body>
</html>

previous lighthouse ticket #1403
by George Kneif

My task is to drag a floating text over a picture. I obtain the picture position via ‘Position.cumulativeOffset’ and the mouse pointer position via ‘Event.pointerX’ and ‘Event.pointerY’. It has worked fine on webpages with a simple ‘ridge’ border. Unfortunately some browsers do not render ‘ridge’ borders correctly so I decided to write a new template where I draw the border. ‘Position.cumulativeOffset’ has returned incorrect values.

The structure of the new template is as follows:

1 'center' (yes, I know I should not use it but convenient)
2 'div id=Lbase, width=828px, pos=rel/0/10px, no border'
3 'div id=La, width=814px, pos=rel/0/0, border-width=7px'
4 'div id=Lb, width=800px, pos=rel/0/0, border-width=7px'
5 'div id=contents, width=800px, rel/0/0, no border'

‘Position.cumulativeOffset’ returns the same value for ‘Lbase’ and ‘contents’, i.e. it ignores the width of the two borders. Consequently the picture position is given 14 pixels less. I have added the 14 pixels to the picture position and the program now works correctly.

This error is consistent in all five browsers on my machine.

previous lighthouse ticket #4459
by Lars Brand

I'm using qftest (http://www.qfs.de/en/index.html) for automation of regression tests for TestLink (http://testlink.org/)
The Error-Message from qftest is:
"An error occurred inside a script on this page.

This is not a bug in QF-Test, rather the opposite: Herewith QF-Test
informs you about a potentially serious problem in your application.
Please notify the developers of the application and include the
information provided below.

Line: 6598
Character: 5
Message: Object doesn't support property or method 'dispatchEvent'
Code: 0
URL: http://1.2.3.4/testlink199/third_party/prototype/prototype.js

/*  Prototype JavaScript framework, version 1.7.1 */
  function fireEvent_DOM(element, eventName, memo, bubble) {
    var event = document.createEvent('HTMLEvents');
    event.initEvent('dataavailable', bubble, true);

    event.eventName = eventName;
    event.memo = memo;

    element.dispatchEvent(event);
    return event;
  }

previous lighthouse ticket #3493
by Pat

Hi,

I've a problem with prototye 1.7.1 on a Wiko Phone with the default Web browser ( and only with the default browser ).

When I test this code on this browser :

try {
alert(new Element('div')); } catch(err){ alert(err); }

I've got an error "Illegal constructor". I include Prototype for Phonegap projects ( It's works very well except on the Wiko Phone !! I've exactly the same problem.)

The default browser for Wiko phone is "Navigator v 4.1.2". When I install Chrome on my phone, it's work but Phonegap is based on the default browser...

Is there a solution ?

Thanks for help !

Pat

previous lighthouse ticket #1692
by Hero Wanders

Calling two times element.update(content) in a row causes event handlers registered on parts of the content via .observe() to vanish.

var e = new Element('span').update('hello');
e.observe('click', function() { alert('world'); });

var test = $('test');

test.update(e); // comment one of these two lines to see that the
test.update(e); // handler gets called only when doing a single update

Handlers directly registered via .addEventListener or .onclick etc. are not affected.

Live example:
Failing double update: http://jsfiddle.net/nH6PG/
Working single update: http://jsfiddle.net/BUJyt/

previous lighthouse ticket #3437
by Thorsten Glaser

Hi,

please consider including the Opera bugfix from Debian #647596

Thanks!

--- prototypejs-1.7.1.orig/prototype-1.7.1.js
+++ prototypejs-1.7.1/prototype-1.7.1.js
@@ -725,7 +725,7 @@

   function evalJSON(sanitize) {
     var json = this.unfilterJSON(),
-        cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g;
+        cx = /[\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff\u0000]/g;
     if (cx.test(json)) {
       json = json.replace(cx, function (a) {
         return '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4);

previous lighthouse ticket #618
by rvagg

If you insert a new element into the DOM that's hidden (display:none;) getOffsetParent() returns BODY no matter where you put it. If it's shown when you insert it it will return the correct element.

This problem does not exist in the IE8 that's in Windows 7 Beta, I'm not sure about the other pre-final releases of IE8 but I suspect this has crept into the final release.

Run attached file to see a demonstration, it uses clonePosition() to demonstrate that getOffsetParent() returns the wrong element for working out the positioning delta and therefore places the element in the wrong place (by a long way).

Work-around is to not use display:none; on your new elements.

See also http://groups.google.com/group/prototype-scriptaculous/browse_thread/thread/186e505aea6873db for mention of this problem.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js"></script>
<script type="text/javascript" language="javascript">
document.observe('dom:loaded', function() {
    var outp = function(t) {
        $('outp').insert({ bottom: new Element('p').update(t) });
    };
    var outppos = function(ele) {
        outp(ele.id + ' pos: ' + ele.viewportOffset()[1] + ',' + ele.viewportOffset()[0] + ' (should be 20,20)');
    };
    var outpparent = function(ele) {
        outp(ele.id + ' offset parent: ' + ele.getOffsetParent().tagName + '[' + ele.getOffsetParent().id + '] (should be DIV[srcele])');
    };
    var newele = function(prop) {
        var newele = new Element('div', prop).update(prop.id);
        $('srcele').insert({ bottom: newele });
        outpparent(newele);
        newele.clonePosition($('srcele'));
        newele.show();
    };
    newele({ id: 'newhide', style: 'position: absolute; display: none; background-color: #FFFF00; border-color: #00FF00; border: 1px transparent;' });
    newele({ id: 'newshow', style: 'position: absolute; background-color: #FF00FF; border-color: #FF0000; border: 1px transparent;' });
    outppos($('srcele'));
    outppos($('newhide'));
    outppos($('newshow'));
});
</script>

<div id="srcele" style="background-color:#00FFFF; border: 1px solid #0000FF; position: absolute; top: 20px; left: 20px; width: 50px; height: 50px;">src</div>
<div id="outp" style="margin-top: 100px;"></div>

</body>
</html>

I want to use the simplest radio button, for example, the gender selection, if I write a pure one in the pure html, it's totally fine, after I selected one gender, even if I click on the same gender, it won't cancel my selection, but if I put the codes under prototype.js, one issue will occur.

After I selected one gender, I click one the same gender, you can see that my selection has been canceled, but actually the value is the same.

previous lighthouse ticket #3574
by Fabien Ménager

We noticed strong performance issues after upgrading from Prototype 1.7 to 1.7.1, and finally found that it was due to the new getUniqueElementID_IE function, which replaces getUniqueElementID by using the IE's uniqueID property.

It looks like a good idea at first sight except when updating an element containing thousands of elements, on which purgeElement is called, which calls stopObserving, etc finally accessing the uniqueID property which seems to be created when accessed, so it's a lot slower than a simple UID++.

Keeping the original code from getUniqueElementID changes nearly everything, by going drom 80s of purge to 1.2s.

I see no regression to do this, but would like to know if anybody noticed this problem before me.

If you call Event.findElement with a pattern that doesn't match any elements in the ancestor chain, you get an error (in Chrome and FF) caused by getAttribute() being called on the root HTML document object, which doesn't have a getAttribute method. It is easily reproducible:

For now, I'm working around this by putting a try/catch around findElement calls.

[previous lighthouse ticket #431]https://prototype.lighthouseapp.com/projects/8886/tickets/431-stringextractscripts-stripscripts-performance-optimization)
by MIYAMUKO Katsuyuki

new RegExp is heavy operation in Firefox.

An attached patch is a to avoid recompiling the regexp in each method call.

Performance
1000 iteration of String#extractScripts.

IE7
0.453 => 0.172
Firefox3
2.012 => 0.046
Chrome
0.075 => 0.029
Safari3
0.063 => 0.016
Opera9
0.250 => 0.125

diff --git a/src/string.js b/src/string.js
index 58f79c2..8cd4b48 100644
--- a/src/string.js
+++ b/src/string.js
@@ -13,6 +13,8 @@ Object.extend(String, {
 });

 Object.extend(String.prototype, {
+  _scriptFragmentRegexp: new RegExp(Prototype.ScriptFragment, 'img'),
+
   gsub: function(pattern, replacement) {
     var result = '', source = this, match;
     replacement = arguments.callee.prepareReplacement(replacement);
@@ -60,15 +62,18 @@ Object.extend(String.prototype, {
   },

   stripScripts: function() {
-    return this.replace(new RegExp(Prototype.ScriptFragment, 'img'), '');
+    return this.replace(this._scriptFragmentRegexp, '');
   },

   extractScripts: function() {
-    var matchAll = new RegExp(Prototype.ScriptFragment, 'img');
-    var matchOne = new RegExp(Prototype.ScriptFragment, 'im');
-    return (this.match(matchAll) || []).map(function(scriptTag) {
-      return (scriptTag.match(matchOne) || ['', ''])[1];
-    });
+    var re = this._scriptFragmentRegexp;
+    var r = [];
+    while (true) {
+      var m = re.exec(this);
+      if (!m) break;
+      r.push(m[1]);
+    }
+    return r;
   },

   evalScripts: function() {
diff --git a/test/unit/string_test.js b/test/unit/string_test.js
index ab20366..42e0736 100644
--- a/test/unit/string_test.js
+++ b/test/unit/string_test.js
@@ -205,6 +205,12 @@ new Test.Unit.Runner({
       ('foo <script>boo();<'+'/script><script type="text/javascript">boo();\nmoo();<'+'/script>bar').extractScripts());
     this.assertEnumEqual(['boo();','boo();\nmoo();'], 
       ('foo <script>boo();<'+'/script>blub\nblub<script type="text/javascript">boo();\nmoo();<'+'/script>bar').extractScripts());
+
+    var str = 'foo <script>boo();<'+'/script>blub\nblub<script type="text/javascript">boo();\nmoo();<'+'/script>bar';
+    this.assertEnumEqual(['boo();','boo();\nmoo();'], str.extractScripts());
+    this.assertEnumEqual(['boo();','boo();\nmoo();'], str.extractScripts());
+
+    this.benchmark(function() { str.extractScripts() }, 1000);
   },

   testEvalScripts: function() {

previous lighthouse ticket #3967
by Navin Israni

Hi,

I am doing an Ajax.Request demo. I have a single function: myMethod, which accepts a string argument. The Ajax.Request fetches from a local json file. I have two buttons, both call myMethod but with different parameters.

My problem is:

As I am running the code on Chrome (latest) or IE 10,I am trying to bind the myMethod function to "click" event of both buttons. If I bind the events using "observe" method of Element class (binding happening in the "dom:loaded" event observer),

1: the function gets executed during the "dom:loaded" event itself and does not wait for "click" event of the buttons to occur.

2: If I change the binding location to "onclick" attribute of the html tag, it works fine.

Here is the code (the alternate implementation as described in point 1 above has been commented):

<script type="text/javascript">
            document.observe("dom:loaded",function(){
//               $('b1').observe('click',myMethod("P"));
//               $('b2').observe('click',myMethod("F"));
            });

            function myMethod(type)
            {
                var ajax = new Ajax.Request("students.json",{
                    method:'get',
                    onSuccess: function(response){

                        var respJSON = response.responseText.evalJSON();
                        alert(respJSON.students[0].name);
                        alert(respJSON.students[0].marks);
                        alert(respJSON.students[0].status);
                    }
                })
            }
            </script>

 <button id="b1" onclick="myMethod('P');"> Get Passed Students </button> | 
        <button id="b2" onclick="myMethod('F');"> Get Failed Students </button>

        <div id='mydiv'>


        </div>

Below is my JSON:

{
    "students": [
        {
            "name":"Shruti Gupta",
            "marks":79,
            "status":"P"
        },
        {
            "name":"Navin Israni",
            "marks":79,
            "status":"P"
        },
        {
            "name":"Suleman Soudagar",
            "marks":89,
            "status":"P"
        },
        {
            "name":"Meghna Kartha",
            "marks":59,
            "status":"F"
        },
        {
            "name":"Kshitiz Arora",
            "marks":49,
            "status":"F"
        }

    ]
}

previous lighthouse ticket #4806
by Sarita S

I recently upgraded prototype.js to 1.7.1 and after that "up" function call not working in IE9. Works great in firefox.

Here is how I am using "up" function in my JSP

function myfunction(item){
var row = $(item).up('tr'); $A(row.descendants()).each( function(elem){ // do something } ); }

Here is how it is called

<img name="testButton" src="images/edit.gif" onclick="myfunction(this);" />

I tried changing up call to

var row = $(item.up('tr'));
var row = $(item.id).up('tr');
var row = $(item).up('tr');
var row = item.up('tr');

None worked. I keep getting error: Object doesn't support this property or method 'up'
Please suggest if I need to downgrade prototype.js or is there a way to fix it.

Thanks
Sarita

previous lighthouse ticket #1426
by loduis (at hotmail)

var element = new Element('div');

element.update('Test fire event.');

document.body.insert(element);

element.observe('click:first', function (event) {
  console.log('First click ...')
  var element = event.findElement();
  // stop observing next all event
  // this destroy the element of Event.cache
  // but Opera and IE run next handlers berfore
  // stopObserving remove all handler
  element.stopObserving();
});

element.observe('click:second', function (event) {
  console.log('Second click ...');
});

element.fire('click:first');

See Lines:

6719: var cacheEntry = Event.cache[uid];
6729:  var cacheEntry = Event.cache[uid], element = cacheEntry.element;
6744: var cacheEntry = Event.cache[uid], element = cacheEntry.element;
cacheEntry is null because stopObserving remove from cache.

previous lighthouse ticket #752
by Radoslav Stankov

In a lot of cases I need to insert a large group of elements to an element, and was wondering if it will be useful to have something like this

$(ul).insert([li, li, li]);

// as before

$(ul).insert(li, li, li, li)

// - or -

$(element).insert(groupOfElements)

// as before

groupOfElements.each(Element.insert.curry(element));

Plus if Prototype have this behavior it could be optimized with usages of documentFragments for example (аlthough tests will need be needed for this).

If such enhancement is accepted I will be more than happy to create patch for it

The HTMLSelectElement has its own definition of remove() and fires that method when $('selectid').remove() is called instead of firing the method on HTMLElement that was added by PrototypeJS.

See this StackOverflow question and the corresponding JSFiddle

http://stackoverflow.com/q/19684961/341491

http://jsfiddle.net/b8FfT/

confirmed in OSX Chrome - possibly more

Hi,
I included Prototype in my Rails app with Sprockets and I get this error :
Sprockets::LoadError: can't find file for require `selector_engine.js' (line 30 of /var/apps/my_app/releases/20091202133347/vendor/sprockets/prototype/src/dom.js)

I'm using the very last master commit (9d47112)

previous lighthouse ticket #2131
by Natasha

Hi everybody,

I'm really desperate - please, please I need your help:

In case that your Internet Explorer (at least in version 8 + 9) is configured NOT to allow Active-X then the following JavaScript command

document.createElement('object')
will cause a warning
An add-on for this website failed to run. Check the security settings in the Internet options for potential conflicts
.
In prototype.js that "createElement('object')" command is triggered each time the library is loaded (which is normally: always) because of the following line

var HTMLOBJECTELEMENT_PROTOTYPE_BUGGY = checkDeficiency('object');
or (depending on the prototype version)

var HTMLOBJECTELEMENT_PROTOTYPE_BUGGY = checkElementPrototypeDeficiency('object');
Am I the only one who things that this is very annoying and not a good idea?
What exactly is the reason for this HTMLOBJECTELEMENT_PROTOTYPE_BUGGY hack (it's not commented at all)?
Are there any fixes/suggestions regarding that problem?
What exactly will happen if I just replace the line above by

var HTMLOBJECTELEMENT_PROTOTYPE_BUGGY = false;
?
Thank you very much in advance for your dear help.

Hugs
Natasha

previous lighthouse ticket #3509
by Andriy Godovanets

Prototype 1.7.1
IE8

Create CSS class
.hidden { display:none !important; }

set this class to HTML element
Issue:
$("test").visible() === true

The problem in visible method implementation:

function visible(element) {
return $(element).style.display !== 'none';
}
This could be fixed to something like

function visible(element) {
return getRawStyle($(element), "display") !== 'none';
}
but getRawStyle function located in other space

previous lighthouse ticket #3318
by Raju

--no content in ticket--

previous lighthouse ticket #3495
by Bob MacCallum

as per https://twitter.com/bobmaccallum/status/361140439107121152

Default behaviour is for the callback to be executed for the first time after the first sleep period, but it would be nice if there was an option for it to trigger immediately as well.

Simple (but undocumented) workaround is:

var pex = new PeriodicalExecuter(function(pe) {
   // stuff here 
}, 5);
pex.execute();

previous lighthouse ticket #3500
by Alexander Lisovtsov

Ajax.Request.success has bug in :

success: function() {
    var status = this.getStatus();
    return !status || (status >= 200 && status < 300) || status == 304;
},
getStatus: function() {
    try {
        if (this.transport.status === 1223) return 204;
        return this.transport.status || 0;
    } catch (e) { return 0 }
},

If getStatus == 0 then success function return true and Ajax.Updater every time update a success div.

On IPAD4 with IOS 6.1.3 when connection to server LOST -> Ajax.Updater update a "success" DIV with empty response.

previous lighthouse ticket #356
by quamis

I needed to b able to insert values in the middle of an array and did not find this functionality in prototype..so here it is:)

//extend the array object to support indexed insertions 
Array.prototype.insert=function(element,where) {

var slice1=this.slice(0,where);
var slice2=this.slice(where);

return new Array.concat(slice1,element,slice2);

};

previous lighthouse ticket #3530
by Michael Osipov

Try

var a = new Element("input", {type: "checkbox", checked: "checked"});
alert(a.outerHTML);

Expected is that attributes are created as-is but output is

You can try this jsFiddle: http://jsfiddle.net/r9yrb/

previous lighthouse ticket #1975
by Matt Hoyle

In Prototype 1.7.0 (scriptaculous requirement) I receive the following exception.

[09:42:59.903] NS_ERROR_ILLEGAL_VALUE: Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIDOMHTMLDivElement.compareDocumentPosition] @ http://10.1.1.70:3000/static/js/prototype.js:2349

After a new Element div had been created and inserted to a page and made Draggable. This exception occurs on the exit of my outer "add" div function. The error relates to undefined values being passed to function in Mozilla. The same code works in Chrome.

descendantOf()prototype.js (line 2343) element = div#a1234.mobject ancestor = null
initialize()dragdrop.js (line 276) element = "a1234"
klass()prototype.js (line 80)
makeDragObj()obj.js (line 31) id = "a1234"
mobj()obj.js (line 276) options = Object { id="a1234", name="objectName", fields={...}}
add()obj.js (line 182) arg = Object { id="a1234", name="objectName", fields={...}}
obj.js()obj.js (line 340)

My workaround was to add a check for a null ancestor in descendantOf in prototype.js: if (!ancestor) return false;

  descendantOf: function(element, ancestor) {
    element = $(element), ancestor = $(ancestor);

    if (!ancestor) return false;

    if (element.compareDocumentPosition)
      return (element.compareDocumentPosition(ancestor) & 8) === 8;

    if (ancestor.contains)
      return ancestor.contains(element) && ancestor !== element;

    while (element = element.parentNode)
      if (element == ancestor) return true;

    return false;
  },

It looks like the code has changed slightly in 1.7.1 but the same null flow could be possible in descendantOf_compareDocumentPosition:

  function descendantOf_compareDocumentPosition(element, ancestor) {
    element = $(element), ancestor = $(ancestor);
    return (element.compareDocumentPosition(ancestor) & 8) === 8;
  }

previous lighthouse ticket #3079
by Jean KST

Suppose we have:

<div id="myField" style="display:none">HELLO</div>

['myField'].each(Element.toggle) won't show it up

$('myField').toggle() is however OK

Problem does not appear in 1.7.0

previous lighthouse ticket #3585
by Dominik Tollon

I have an observer registered on a select tag. When I set the value of the select tag in javascript by 'Element.value = ' and immediately after I manually change the value by using the select box in my browser, the observer does not trigger. In all other circumstances the observer behaves as expected.

A used to confirm (button options: yes, no) sends a button value to a javascript callbackhandler. If user clicked the confirm button, the callbackhandler can check if the button's value is "yes". This is the behavior expected of , and it works in Prototype 1.5.1.2. If Prototype 1.6 is used instead, the button value in the javascript callbackhandler is always the number 1, presumably indicating that a button was clicked.

PrototypeJS defines Object.keys without considering if it is already defined. Instead, it should use the built-in standard, where available:

Prototype 1.6.1:
function keys(object) {
var results = [];
for (var property in object)
results.push(property);
return results;
}

ES5 requires Object.keys TypeError to be thrown there. The for-in loop is required to throw in the same case, where the object is not an object, however for web compat, browsers don't do that. Regardless, for Object.keys(9), Chrome throws.

Instead of calling push, it is faster to increment a variable.

  Object.keys = Object.keys || keys;
 
  function keys(object) {
    if(!(object instanceof Object)) {
      throw TypeError("Object.keys called on non-object");
    }
    var results = [], property, i = 0;
// Preset length, where available.
    results.length = object.__count__ || 0; 
    for (property in object)
  // faster than push()
      results[i++] = property;
    return results;
  }

The getOpacity function might - in some cases - return a string instead of a float (or integer).

In case a 3rd party library - f.e. script.aculo.us - uses the return value to calculate and set a new value. In case a string is returned "1" - 0.3 results in a faulty opacity value of -0.3.

By adding floatval() to the function getOpacity (around line 3149) the issue can be fixed.

  function getOpacity(element) {
    return parseFloat(Element.getStyle(element, 'opacity'));
  }

Credits go to Jigal van Hemert for fixing it for the TYPO3 Project.

• issue: http://forge.typo3.org/issues/58053
• solution: https://review.typo3.org/29578

previous lighthouse ticket #1726
by red-fern

I noticed it's a new feature in 1.7.1 that encode all spaces to +'s.

The problem here is that what if I have a string "I have a dog + a cat + a parrot". It would be sent to the server as "I+have+a+dog+++a+cat+++a+parrot". My sever side has no idea which one is a space and which is a genuine plus sign.

I have created a test page on jsfiddle:

http://jsfiddle.net/2HJqM

that uses the latest prototype (1.7.1) and latest scriptaculous (1.9). When you go to my test page, fireup Firebug and active the Net tab. Click RUN, then enter "a + b + c", then click on the latest POST request that pops up in the Net tab. You should see on the POST tab: value: a+++b+++c.

What we expect to receive in the form submission is: a+%2B+b+%2B+c

previous lighthouse ticket #208
by Clément Hallet

Hi,

I found a particular bug using WMP objects driven by javascript.

Those kind of objects can generete dom events, for instance the "PlayStateChange" event when the stream is buffered, played ...

Contrary to all other IE events, it doesn't have the 'on' prefix.

This basic javascript code works fine:

$(player_id).attachEvent("PlayStateChange",function(newState){
    Console.debug(newState)
}.bind(this));

But, since the "observe" method add a 'on' with IE, that prototype code doesn't work (the event is never catched) :

$(player_id).observe("PlayStateChange",function(newState){
    console.debug(newState)
}.bind(this));

I can't figure what the solution could be, maybe by checking the element type (if its tag is "object") and don't add the 'on' ?

I have tested it with IE6 and IE7. I don't know what the behaviour would be with firefox and the WMP plugin.

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  <head>
    <title>Player Test</title>
    <script src="prototype.js" type="text/javascript" charset="utf-8"></script>
  </head>

  <body>

    <object id="player" classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" height="300" width="400">
      <param name="autoStart" value="False">
      <param name="uiMode" value="none">
      <param name="playCount" value="999">
    </object>

    <a href="javascript:start();">start</a>

  </body>
</html>


<script type="text/javascript">

  function start() {

      // basic javascript code
      $('player').attachEvent("PlayStateChange",function(newState){
            alert("[js listener] " + newState);
      }.bind(this));

      // prototype code, doesn't work because of the added 'on' prefix
      $('player').observe("PlayStateChange",function(newState){
          alert("[prototype listener] " + newState);
      }.bind(this));

      $('player').URL = "mms://a926.l4479146925.c44791.g.lm.akamaistream.net/D/926/44791/v0001/reflector:46925'"; // stream or file url
      $('player').controls.play();

  }

</script>