This is a migrated thread and some comments may be shown as answers.

RadInputManager and Prototype Incompatibility?

7 Answers 100 Views
Input
This is a migrated thread and some comments may be shown as answers.
Philippe GRACA
Top achievements
Rank 1
Philippe GRACA asked on 17 Mar 2009, 10:11 AM
Hi
i'm getting tired trying to debug the following simple page that contains a Radajaxmanager, a RadInputMananger AND a reference to prototype.js (the latest version 1.6.0.3). the RadInputManager transforms a textbox in an Email Required Field.

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<!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 runat="server"
  <title>test</title> 
</head> 
<body> 
  <form id="form1" runat="server"
  <telerik:RadScriptManager ID="rsm" runat="server"
    <Scripts> 
      <asp:ScriptReference Path="http://www.prototypejs.org/assets/2008/9/29/prototype-1.6.0.3.js" /> 
    </Scripts> 
  </telerik:RadScriptManager> 
  <telerik:RadAjaxManager ID="ram" runat="server"
    <AjaxSettings> 
      <telerik:AjaxSetting AjaxControlID="btUpd"
        <UpdatedControls> 
          <telerik:AjaxUpdatedControl ControlID="lb"></telerik:AjaxUpdatedControl> 
        </UpdatedControls> 
      </telerik:AjaxSetting> 
    </AjaxSettings> 
  </telerik:RadAjaxManager> 
  <asp:TextBox ID="txtFrom" runat="server" Width="322px" MaxLength="500"></asp:TextBox> 
  <telerik:RadInputManager ID="rim" runat="server"
    <telerik:RegExpTextBoxSetting BehaviorID="ebh4" ValidationExpression="^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$"
      <Validation IsRequired="true" /> 
      <TargetControls> 
        <telerik:TargetInput ControlID="txtFrom" /> 
      </TargetControls> 
    </telerik:RegExpTextBoxSetting> 
  </telerik:RadInputManager> 
  <asp:Button ID="btUpd" runat="server" Text="Update" OnClick="btUpd_Click" /> 
    <br /> 
    <asp:Label ID="lb" runat="server" /> 
  </form> 
</body> 
</html> 
 

The code behind is trivial

public partial class WebForm2 : System.Web.UI.Page 
  { 
    protected void Page_Load(object sender, EventArgs e) 
    { 
 
    } 
 
    protected void btUpd_Click(object sender, EventArgs e) 
    { 
      lb.Text = "ajax query!"
    } 
  } 

When I do provide a valid email in the textbox and press the update button i get a javascript error

com.get_targetControlIDs is not a function
--> var ids=com.get_targetControlIDs();

A few remarks

It appears that when prototype is loaded, the onsubmit function od radinputmanager.js (line 726) is retrieving two values instead of one only in the this._getSettings() method.

_onSubmit:function(){ 
var i; 
for(i in this._getSettings()){ 
if(this._getSettings()[i]){ 
this._beforeSubmit(this._getSettings()[i]); 

The first and correct retrieved value is "rim_e4" which corresponds to the behaviour.
The second one which is weird and I cannot understand why it is bugging is "each" which is a function and not a behaviour at all.

I think that the Object.extend(Array.prototype, Enumerable); line in protoype.js is causing the issue but i can't understand why

Please help me, this is really getting urgent.
Best Regards
Philippe



7 Answers, 1 is accepted

Sort by
0
Philippe GRACA
Top achievements
Rank 1
answered on 17 Mar 2009, 03:21 PM
Using firebug, I'm able to debug the content of the _getSettings method and I can see that all the prototype array methods are also in there.

setting : rim_e4
setting : each
setting : eachSlice
setting : all
setting : any
setting : collect
setting : detect
setting : findAll
setting : grep
setting : include
setting : inGroupsOf
setting : inject
setting : invoke
setting : max
setting : min
setting : partition
setting : pluck
setting : reject
setting : sortBy
setting : toArray
setting : zip
setting : size
setting : inspect
setting : find
setting : select
setting : member
setting : entries
setting : _reverse
setting : _each
setting : clear
setting : first
setting : last
setting : compact
setting : flatten
setting : without
setting : uniq
setting : intersect
setting : clone
setting : toJSON

Is there a way to avoid that? I need prototype by the way :)
Philippe
0
Philippe GRACA
Top achievements
Rank 1
answered on 17 Mar 2009, 04:24 PM
As of now, I am overring the _beforeSubmit event

  <script type="text/javascript" language="javascript"
    Telerik.Web.UI.RadInputManager.prototype._beforeSubmit = function(com) { 
      if (typeof (com) != 'object'return
      var ids = com.get_targetControlIDs(); 
      for (var i = 0; i < ids.length; i++) { 
        com.get_targetInput(ids[i])._beforeSubmit(); 
      } 
    } 
</script> 
 

It is working but not really acceptable
0
Philippe GRACA
Top achievements
Rank 1
answered on 18 Mar 2009, 09:13 AM
To whom may be interested, the support confirmed that Telerik RadControls are not compatible with prototype.js.

0
Nikolay Rusev
Telerik team
answered on 20 Mar 2009, 08:40 AM
Hello Philippe,

I am afraid that actually Prototype.js is not compatible to use together with some JavaScript libraries.
The problem is the way Prototype.js extends Array object which breaks all kind of for-each array iteration.

Why I Don't Use The prototype.js JavaScript Library
Javascript "Associative Arrays"

Best wishes,
Nikolay
the Telerik team


Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Philippe GRACA
Top achievements
Rank 1
answered on 20 Mar 2009, 09:10 AM
Hi and thx for the answer and links
In the second one, i read that interesting comment

So I will say it again: Array is not meant to be used for key/value pairs. Luckily, there is a dead-simple way to fix this. In the above example, you need only change Array to Object. (Or, if you’re using literal syntax, change [] to {}.) There. Your wrong code is no longer wrong, and it took only a little more work than a simple find-and-replace

What are your thoughts on this? Do you think telerik arrays key/values pairs can be replaced by simple objects?

Best regards
Philippe




0
Nikolay Rusev
Telerik team
answered on 20 Mar 2009, 03:57 PM
Hello Philippe,

Extending Array object as Prototype.js does is not actually a  good practice. This might cause unexpected behaviors.

You can check for example how ASP.NET AJAX client API extends some of the root objects as Array,String .. or even some other JavaScript library as jQuery.

Regards,
Nikolay
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.
0
Philippe GRACA
Top achievements
Rank 1
answered on 20 Mar 2009, 04:02 PM
Thx Nikolay
I'll abandon prototype on my next projects.
Regards
Philippe

Tags
Input
Asked by
Philippe GRACA
Top achievements
Rank 1
Answers by
Philippe GRACA
Top achievements
Rank 1
Nikolay Rusev
Telerik team
Share this question
or