• Registered: 2007-10-02
  • Posts: 24

Topic: SOLVED - Was - Possible Google Chrome Bug

I am getting the following error when ***certain*** buttons are calling xajax getFormValues methods:

Uncaught TypeError: Object #<an HTMLInputElement> has no method 'substring' - xajax_core.js:94

The offending line is: return;if(prefix!=child.name.substring(0,prefix.length))

This is in xajax 0.5 beta 4, so I will try with the latest greatest.  it is a little suspect to me since I have many buttons on my page, all using the getFormValues() method, but only this one is failing (to my knowledge).  These buttons all work on Firefox and IE - only Chrome has the problem.  I have seen something similar posted in other places regarding the prototype.js scripts.

Any insight would be appreciated.

Last edited by robertwb (2010-06-22 6:49:52 PM)

  • Registered: 2007-10-02
  • Posts: 24

Re: SOLVED - Was - Possible Google Chrome Bug

Same error is confirmed in the release version of 0.5.   Line 105 xajax_core.js.

Two examples follow, one that fails with the above reported error, the second which completes without error.

the code that does NOT work:
<input type="button" name="saveelement" value="Save Element" onclick="xajax_showAddElementResult(xajax.getFormValues(&quot;addelement&quot;)); ">

This Code DOES work:
<input type="button" name="savenew" value="Save Operator" onclick="xajax_showOperatorEditResult(xajax.getFormValues(&quot;operator10&quot;))">

  • From: Boise, Idaho, USA
  • Registered: 2006-04-28
  • Posts: 1,045

Re: SOLVED - Was - Possible Google Chrome Bug

Hi,

Here's some code using your button definitions. They both work with Chrome in my environment...

Code: PHP

<?php

/*

    Basic XAJAX page / Simple Form Handling Example.

  Reference:

  http://community.xajaxproject.org/topic/8323/possible-google-chrome-bug/

*/

require_once("xajax/xajax_core/xajax.inc.php");

$xajax = new xajax();                          

$xajax->configure('javascript URI', 'xajax/');    //Uncomment to turn on the debugger

//$xajax->configure('debug',true);

$xajax->register(XAJAX_FUNCTION,"showAddElementResult");

$xajax->register(XAJAX_FUNCTION,"showOperatorEditResult");

$xajax->processRequest();

function showAddElementResult($dta)

{

    $resp=new xajaxResponse();                  

    $resp->alert(print_r($dta,true));  //Alert the passed form data.        

    return $resp;                              

}

function showOperatorEditResult($dta)

{

    $resp=new xajaxResponse();                  

    $resp->alert(print_r($dta,true));          

    return $resp;                              

}



?>

<html>

<head>

<? $xajax->printJavascript(); ?>

<title>test</title>

<style>

label{

    font-weight: bold;

    width: 150px;

    text-align: right;

}

</style>

</head>

<body>

<form id='addelement'>

<fieldset>

<label>Name:</label><input id="myname" name="myname"/><br/>

<label>Address:</label><input id="myaddress" name="myaddress"/>

<input type="hidden" id="test" name="test" value='5'/>

</fieldset>

</form>

<input type="button" name="saveelement" value="Save Element" onclick="xajax_showAddElementResult(xajax.getFormValues(&quot;addelement&quot;)); ">



<br/>This Code DOES work:

<form id='operator10'>

<fieldset>

<label>Name:</label><input id="myname" name="myname"/><br/>

<label>Address:</label><input id="myaddress" name="myaddress"/>

<input type="hidden" id="test" name="test" value='5'/>

</fieldset>

</form>

<input type="button" name="savenew" value="Save Operator" onclick="xajax_showOperatorEditResult(xajax.getFormValues(&quot;operator10&quot;))">

</body>

</html>

 

Ed

If you ever stop learning you may as well dig a hole, crawl in and pull the top over yourself.
  • Registered: 2007-10-02
  • Posts: 24

Re: SOLVED - Was - Possible Google Chrome Bug

So, would you say this point to a DOM/HTML problem specific to my page?

  • From: Boise, Idaho, USA
  • Registered: 2006-04-28
  • Posts: 1,045

Re: SOLVED - Was - Possible Google Chrome Bug

I suppose so...

If you ever stop learning you may as well dig a hole, crawl in and pull the top over yourself.
  • Registered: 2007-10-02
  • Posts: 24

Re: SOLVED - Was - Possible Google Chrome Bug

I am revisiting this without resolution thus far.  When I have experienced strange behavior in FORM elements in the past, it is often due to un-happy table arrangement (form elements outside of proper table tags), and/or other goofed up tags.  However, in this case I have yet to find any of that nonsense.

So... some more info, perhaps might jog someones mind to offer a suggestion of where I might want to look. 

I have multiple buttons and multiple forms on a single page.  All of the buttons are virtually identical, although their submit action is tied to different forms.  In EACH CASE the buttons are lying OUTSIDE of the <form></form> tags.

The difference is that in Chrome, and now Safari, these buttons fail to perform the onClick action that is set, with an error being reported in Chrome at line 94 of the 0.5 xajax version.  The code that is unhappy is as follows:

if(prefix!=child.name.substring(0,prefix.length)) return;


And the error console reports:

Uncaught TypeError: Object #<an HTMLInputElement> has no method 'substring'

Note, that this button certainly has a name, and it has been verified as having a unique name in the page.  Any ideas would be awesome.

  • Registered: 2007-10-02
  • Posts: 24

Re: SOLVED - Was - Possible Google Chrome Bug

SOLVED.

There was some tag shenanigans after all.  The form end tag </form> was placed inside of a <div></div> while the form opening tag was placed outside of said <div>.  This caused Chrome to run through the other forms that appeared after the form in question, submitting their data - however, it still affiliated them with their own forms and thus the variables that got passed to the _formValues method were corrupted in some way.  I have to verify on Safari when I get home tonight, but I suspect the same thing was happening.

So, that which didn't work looked like this:

<form>
<div id='div1'>
<input...>
</div>
<div id='div2>
<input...>
</form>
</div>

The properly functioning version looks like this:

So, that which didn't work looked like this:

<form>

<div id='div1'>
<input...>
</div>
<div id='div2>
<input...>
</div>

</form>

Last edited by robertwb (2010-06-22 6:49:30 PM)