Hi,
I am using prototype.js 1.5.1. I''ve implemented Ajax.Updater in a
script which is working fine in both FF 2 and IE 6 except for the
following problem in FF only-
When the focus is on the submit button of a form, then pressing enter
SUBMITS the form with parameters passed to the url, as if it were no
ajax, and output is not displayed. Though Ajax.Updater works fine if
the submit button is clicked! This is an Firefox only problem. The
link to the script is http://sillypoints.com/sel_prot.cgi . You can
verify the problem by bringing the focus on any submit button and then
pressing enter.
The code is as follows:
<script type="text/javascript">
Event.observe(window,''load'',function(e)
{
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
});
function handleSubmit(evt)
{
var frm = Event.element(evt);
var elements = frm.elements;
new Ajax.Updater({
success:
''team'',
failure:
''team''
},
''players.cgi'', {
method:
''POST'',
asynchronous: true,
evalScripts: true,
parameters: {
category:
elements[''category''].value ,
country:
elements[''country''].value}
});
Event.stop(evt);
}
Ajax.Responders.register({
onCreate: function() {
if($(''loading'')
&&
Ajax.activeRequestCount>0)
Effect.Appear(''loading'',
{duration:0.5,queue:''end''});
},
onComplete: function() {
if($(''loading'')
&&
Ajax.activeRequestCount==0)
Effect.Fade(''loading'',
{duration:0.5,queue:''end''});
}
});
</script>
</head>
<body style="font-family:verdana;
font-size:10px">
<br><br><form id="form_one"
name="form_one">
SHOW<select name="category" class=sel>
<option value="all">All
Players</option>
<option
value="Batsman">Batsmen</option>
<option
value="Bowler">Bowlers</option>
<option value="Wk">Wicket
Keepers</option>
</select>
FROM<select name="country" class=sel>
<option value="all">All
Countries</option>
<option value="australia">Australia</option><option
value="bangladesh">Bangladesh</option><option
value="bermuda">Bermuda</
option><option value="canada">Canada</option><option
value="england">England</option><option
value="india">India</
option><option
value="ireland">Ireland</option><option
value="kenya">Kenya</option><option
value="netherlands">Netherlands</
option><option
value="newzealand">Newzealand</option><option
value="pakistan">Pakistan</option><option
value="scotland">Scotland</
option><option
value="southafrica">Southafrica</option><option
value="srilanka">Srilanka</option><option
value="windies">Windies</
option><option value="zimbabwe">Zimbabwe</option>
</select><input type=submit value=GO class=btngo />
</form>
<br><br>
<table width=100% height=100% border=0>
<tr>
<td valign=top width=40% height=100%>
<div id="team"
style="width:
400px;float:left;"></div>
</td>
<td valign=top width=20% height=100%>
<span id=''loading''
style="display:none"><img src=ajax-loader.gif
/></span>
</td>
<td valign=top width=40% height=100%>
<div id="players"
style="width:
400px;float:right;"></div>
</td>
</tr>
</table>
Where am I going wrong?
Thanks,
Naveen
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
</select><input type=submit value=GO class=btngo /> Change `type` to "button" ie: </select><input type="button" value=GO class=btngo /> On 8/21/07, Naveen <nkrgupta-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > Hi, > > I am using prototype.js 1.5.1. I''ve implemented Ajax.Updater in a > script which is working fine in both FF 2 and IE 6 except for the > following problem in FF only- > > When the focus is on the submit button of a form, then pressing enter > SUBMITS the form with parameters passed to the url, as if it were no > ajax, and output is not displayed. Though Ajax.Updater works fine if > the submit button is clicked! This is an Firefox only problem. The > link to the script is http://sillypoints.com/sel_prot.cgi . You can > verify the problem by bringing the focus on any submit button and then > pressing enter. > > The code is as follows: > > <script type="text/javascript"> > > > Event.observe(window,''load'',function(e) > { > > Event.observe(document.forms[''form_one''],''submit'',handleSubmit); > }); > > function handleSubmit(evt) > { > var frm = Event.element(evt); > var elements = frm.elements; > > new Ajax.Updater({ > success: > ''team'', > failure: > ''team'' > > }, > ''players.cgi'', { > method: ''POST'', > asynchronous: true, > evalScripts: true, > parameters: { > category: > elements[''category''].value , > country: > elements[''country''].value} > }); > > Event.stop(evt); > } > > Ajax.Responders.register({ > onCreate: function() { > if($(''loading'') && > Ajax.activeRequestCount>0) > Effect.Appear(''loading'', > {duration:0.5,queue:''end''}); > }, > onComplete: function() { > if($(''loading'') && > Ajax.activeRequestCount==0) > Effect.Fade(''loading'', > {duration:0.5,queue:''end''}); > } > }); > > </script> > > </head> > > <body style="font-family:verdana; font-size:10px"> > <br><br><form id="form_one" name="form_one"> > SHOW<select name="category" class=sel> > <option value="all">All Players</option> > <option value="Batsman">Batsmen</option> > <option value="Bowler">Bowlers</option> > > <option value="Wk">Wicket Keepers</option> > </select> > > FROM<select name="country" class=sel> > <option value="all">All Countries</option> > <option value="australia">Australia</option><option > value="bangladesh">Bangladesh</option><option > value="bermuda">Bermuda</ > option><option value="canada">Canada</option><option > value="england">England</option><option value="india">India</ > option><option value="ireland">Ireland</option><option > value="kenya">Kenya</option><option value="netherlands">Netherlands</ > option><option value="newzealand">Newzealand</option><option > value="pakistan">Pakistan</option><option value="scotland">Scotland</ > option><option value="southafrica">Southafrica</option><option > value="srilanka">Srilanka</option><option value="windies">Windies</ > option><option value="zimbabwe">Zimbabwe</option> > > </select><input type=submit value=GO class=btngo /> > </form> > <br><br> > <table width=100% height=100% border=0> > <tr> > <td valign=top width=40% height=100%> > <div id="team" style="width: > 400px;float:left;"></div> > </td> > <td valign=top width=20% height=100%> > > <span id=''loading'' > style="display:none"><img src=ajax-loader.gif / > ></span> > > </td> > <td valign=top width=40% height=100%> > <div id="players" style="width: > 400px;float:right;"></div> > </td> > </tr> > </table> > > Where am I going wrong? > > Thanks, > Naveen > > > > >-- Matt Harris (250)-588-2275 --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Hi,
Thanks for the reply, but just changing input type from submit to
button doesn''t help in my case. Probably because the event handlers
are written in a way to handle submit. I''ve written this snippet by
going through various codes from around the internet, and i''m not a JS/
AJAX expert. So if you can go through the following JS part of my code
to point out the part which needs to be changed, it''d be great.
<script type="text/javascript">
Event.observe(window,''load'',function(e)
{
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
});
function handleSubmit(evt)
{
var frm = Event.element(evt);
var elements = frm.elements;
new Ajax.Updater({
success: ''team'',
failure: ''team''
},
''players.cgi'', {
method: ''POST'',
asynchronous: true,
evalScripts: true,
parameters: {
category: elements[''category''].value ,
country: elements[''country''].value}
});
Event.stop(evt);
}
Ajax.Responders.register({
onCreate: function() {
if(\$(''loading'') && Ajax.activeRequestCount>0)
Effect.Appear(''loading'',{duration:0.5,queue:''end''});
},
onComplete: function() {
if(\$(''loading'') && Ajax.activeRequestCount==0)
Effect.Fade(''loading'',{duration:0.5,queue:''end''});
}
});
</script>
Thanks a ton,
Naveen
On Aug 21, 10:20 pm, "Matt Harris"
<harri...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> </select><input type=submit value=GO class=btngo />
>
> Change `type` to "button"
> ie:
> </select><input type="button" value=GO class=btngo />
>
> On 8/21/07, Naveen <nkrgu...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
>
>
>
>
>
> > Hi,
>
> > I am using prototype.js 1.5.1. I''ve implemented Ajax.Updater
in a
> > script which is working fine in both FF 2 and IE 6 except for the
> > following problem in FF only-
>
> > When the focus is on the submit button of a form, then pressing enter
> > SUBMITS the form with parameters passed to the url, as if it were no
> > ajax, and output is not displayed. Though Ajax.Updater works fine if
> > the submit button is clicked! This is an Firefox only problem. The
> > link to the script ishttp://sillypoints.com/sel_prot.cgi. You can
> > verify the problem by bringing the focus on any submit button and then
> > pressing enter.
>
> > The code is as follows:
>
> > <script type="text/javascript">
>
> > Event.observe(window,''load'',function(e)
> > {
>
> >
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> > });
>
> > function handleSubmit(evt)
> > {
> > var frm = Event.element(evt);
> > var elements = frm.elements;
>
> > new Ajax.Updater({
> > success:
> > ''team'',
> > failure:
> > ''team''
>
> > },
> >
''players.cgi'', {
> > method:
''POST'',
> > asynchronous: true,
> > evalScripts: true,
> > parameters: {
> > category:
> > elements[''category''].value ,
> > country:
> > elements[''country''].value}
> > });
>
> > Event.stop(evt);
> > }
>
> > Ajax.Responders.register({
> > onCreate: function() {
> >
if($(''loading'') &&
> > Ajax.activeRequestCount>0)
> >
Effect.Appear(''loading'',
> > {duration:0.5,queue:''end''});
> > },
> > onComplete: function() {
> >
if($(''loading'') &&
> > Ajax.activeRequestCount==0)
> >
Effect.Fade(''loading'',
> > {duration:0.5,queue:''end''});
> > }
> > });
>
> > </script>
>
> > </head>
>
> > <body style="font-family:verdana;
font-size:10px">
> > <br><br><form id="form_one"
name="form_one">
> > SHOW<select name="category" class=sel>
> > <option value="all">All
Players</option>
> > <option
value="Batsman">Batsmen</option>
> > <option
value="Bowler">Bowlers</option>
>
> > <option value="Wk">Wicket
Keepers</option>
> > </select>
>
> > FROM<select name="country" class=sel>
> > <option value="all">All
Countries</option>
> > <option
value="australia">Australia</option><option
> > value="bangladesh">Bangladesh</option><option
> > value="bermuda">Bermuda</
> > option><option
value="canada">Canada</option><option
> > value="england">England</option><option
value="india">India</
> > option><option
value="ireland">Ireland</option><option
> > value="kenya">Kenya</option><option
value="netherlands">Netherlands</
> > option><option
value="newzealand">Newzealand</option><option
> > value="pakistan">Pakistan</option><option
value="scotland">Scotland</
> > option><option
value="southafrica">Southafrica</option><option
> > value="srilanka">Srilanka</option><option
value="windies">Windies</
> > option><option
value="zimbabwe">Zimbabwe</option>
>
> > </select><input type=submit value=GO
class=btngo />
> > </form>
> > <br><br>
> > <table width=100% height=100% border=0>
> > <tr>
> > <td valign=top width=40%
height=100%>
> > <div id="team"
style="width:
> > 400px;float:left;"></div>
> > </td>
> > <td valign=top width=20%
height=100%>
>
> > <span
id=''loading''
> > style="display:none"><img src=ajax-loader.gif /
> > ></span>
>
> > </td>
> > <td valign=top width=40%
height=100%>
> > <div id="players"
style="width:
> > 400px;float:right;"></div>
> > </td>
> > </tr>
> > </table>
>
> > Where am I going wrong?
>
> > Thanks,
> > Naveen
>
> --
> Matt Harris
> (250)-588-2275
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
The problem with firefox submitting is because it is a submit type
input. This does not seem to be unique to firefox.
I cannot assure you that this will still work on pressing enter. You
may want to look into using an onChange event with your select''s.
Change this:
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
To:
Event.observe(''btngo'',''click'',handleSubmit);
Change this:
</select><input type=submit value=GO class=btngo />
To:
</select><input type="button" id="btngo" value=GO
class=btngo />
On 8/21/07, Naveen <nkrgupta-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:>
> Hi,
> Thanks for the reply, but just changing input type from submit to
> button doesn''t help in my case. Probably because the event
handlers
> are written in a way to handle submit. I''ve written this snippet
by
> going through various codes from around the internet, and i''m not
a JS/
> AJAX expert. So if you can go through the following JS part of my code
> to point out the part which needs to be changed, it''d be great.
>
> <script type="text/javascript">
>
>
> Event.observe(window,''load'',function(e)
> {
>
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> });
>
> function handleSubmit(evt)
> {
> var frm = Event.element(evt);
> var elements = frm.elements;
>
> new Ajax.Updater({
> success: ''team'',
> failure: ''team''
>
> },
> ''players.cgi'', {
> method: ''POST'',
> asynchronous: true,
> evalScripts: true,
> parameters: {
> category:
elements[''category''].value ,
> country:
elements[''country''].value}
> });
>
> Event.stop(evt);
> }
>
> Ajax.Responders.register({
> onCreate: function() {
> if(\$(''loading'') &&
Ajax.activeRequestCount>0)
>
Effect.Appear(''loading'',{duration:0.5,queue:''end''});
> },
> onComplete: function() {
> if(\$(''loading'') &&
Ajax.activeRequestCount==0)
>
Effect.Fade(''loading'',{duration:0.5,queue:''end''});
> }
> });
>
>
> </script>
>
> Thanks a ton,
> Naveen
>
> On Aug 21, 10:20 pm, "Matt Harris"
<harri...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > </select><input type=submit value=GO class=btngo />
> >
> > Change `type` to "button"
> > ie:
> > </select><input type="button" value=GO class=btngo
/>
> >
> > On 8/21/07, Naveen
<nkrgu...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >
> >
> >
> >
> >
> > > Hi,
> >
> > > I am using prototype.js 1.5.1. I''ve implemented
Ajax.Updater in a
> > > script which is working fine in both FF 2 and IE 6 except for the
> > > following problem in FF only-
> >
> > > When the focus is on the submit button of a form, then pressing
enter
> > > SUBMITS the form with parameters passed to the url, as if it were
no
> > > ajax, and output is not displayed. Though Ajax.Updater works fine
if
> > > the submit button is clicked! This is an Firefox only problem.
The
> > > link to the script ishttp://sillypoints.com/sel_prot.cgi. You can
> > > verify the problem by bringing the focus on any submit button and
then
> > > pressing enter.
> >
> > > The code is as follows:
> >
> > > <script type="text/javascript">
> >
> > > Event.observe(window,''load'',function(e)
> > > {
> >
> > >
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> > > });
> >
> > > function handleSubmit(evt)
> > > {
> > > var frm =
Event.element(evt);
> > > var elements =
frm.elements;
> >
> > > new Ajax.Updater({
> > > success:
> > > ''team'',
> > > failure:
> > > ''team''
> >
> > > },
> > >
''players.cgi'', {
> > > method:
''POST'',
> > > asynchronous:
true,
> > > evalScripts:
true,
> > > parameters: {
> > > category:
> > > elements[''category''].value ,
> > > country:
> > > elements[''country''].value}
> > > });
> >
> > > Event.stop(evt);
> > > }
> >
> > > Ajax.Responders.register({
> > > onCreate: function() {
> > >
if($(''loading'') &&
> > > Ajax.activeRequestCount>0)
> > >
Effect.Appear(''loading'',
> > > {duration:0.5,queue:''end''});
> > > },
> > > onComplete: function() {
> > >
if($(''loading'') &&
> > > Ajax.activeRequestCount==0)
> > >
Effect.Fade(''loading'',
> > > {duration:0.5,queue:''end''});
> > > }
> > > });
> >
> > > </script>
> >
> > > </head>
> >
> > > <body style="font-family:verdana;
font-size:10px">
> > > <br><br><form
id="form_one" name="form_one">
> > > SHOW<select name="category"
class=sel>
> > > <option value="all">All
Players</option>
> > > <option
value="Batsman">Batsmen</option>
> > > <option
value="Bowler">Bowlers</option>
> >
> > > <option value="Wk">Wicket
Keepers</option>
> > > </select>
> >
> > > FROM<select name="country"
class=sel>
> > > <option value="all">All
Countries</option>
> > > <option
value="australia">Australia</option><option
> > >
value="bangladesh">Bangladesh</option><option
> > > value="bermuda">Bermuda</
> > > option><option
value="canada">Canada</option><option
> > > value="england">England</option><option
value="india">India</
> > > option><option
value="ireland">Ireland</option><option
> > > value="kenya">Kenya</option><option
value="netherlands">Netherlands</
> > > option><option
value="newzealand">Newzealand</option><option
> > > value="pakistan">Pakistan</option><option
value="scotland">Scotland</
> > > option><option
value="southafrica">Southafrica</option><option
> > > value="srilanka">Srilanka</option><option
value="windies">Windies</
> > > option><option
value="zimbabwe">Zimbabwe</option>
> >
> > > </select><input type=submit value=GO
class=btngo />
> > > </form>
> > > <br><br>
> > > <table width=100% height=100% border=0>
> > > <tr>
> > > <td valign=top width=40%
height=100%>
> > > <div
id="team" style="width:
> > > 400px;float:left;"></div>
> > > </td>
> > > <td valign=top width=20%
height=100%>
> >
> > > <span
id=''loading''
> > > style="display:none"><img src=ajax-loader.gif /
> > > ></span>
> >
> > > </td>
> > > <td valign=top width=40%
height=100%>
> > > <div
id="players" style="width:
> > > 400px;float:right;"></div>
> > > </td>
> > > </tr>
> > > </table>
> >
> > > Where am I going wrong?
> >
> > > Thanks,
> > > Naveen
> >
> > --
> > Matt Harris
> > (250)-588-2275
>
>
> >
>
--
Matt Harris
(250)-588-2275
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Hi,
Changing the 2 lines, as said by you also doesn''t help :( It gives a
JS error ''Error: elements has no properties
Source File: http://sillypoints.com/sel_prot.cgi
Line: 42'' on clicking the button. Also when i put alerts inside the
function handleSubmit, i get value for var frm but no for var elements
-
var frm = Event.element(evt);
alert(frm); // displays [Object HTMLInputElement]
var elements = frm.elements;
alert(elements); // displays undefined
new Ajax.Updater({
success: ''team'',
failure: ''team''
},
''players.cgi'', {
method: ''POST'',
asynchronous: true,
evalScripts: true,
parameters: {
category: elements[''category''].value ,
country: elements[''country''].value}
});
Event.stop(evt);
Thanks
Naveen
On Aug 21, 11:22 pm, "Matt Harris"
<harri...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> The problem with firefox submitting is because it is a submit type
> input. This does not seem to be unique to firefox.
>
> I cannot assure you that this will still work on pressing enter. You
> may want to look into using an onChange event with your select''s.
>
> Change this:
>
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> To:
>
Event.observe(''btngo'',''click'',handleSubmit);
>
> Change this:
> </select><input type=submit value=GO class=btngo />
> To:
> </select><input type="button" id="btngo"
value=GO class=btngo />
>
> On 8/21/07, Naveen <nkrgu...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
>
>
>
>
>
> > Hi,
> > Thanks for the reply, but just changing input type from submit to
> > button doesn''t help in my case. Probably because the event
handlers
> > are written in a way to handle submit. I''ve written this
snippet by
> > going through various codes from around the internet, and i''m
not a JS/
> > AJAX expert. So if you can go through the following JS part of my code
> > to point out the part which needs to be changed, it''d be
great.
>
> > <script type="text/javascript">
>
> >
Event.observe(window,''load'',function(e)
> > {
> >
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> > });
>
> > function handleSubmit(evt)
> > {
> > var frm = Event.element(evt);
> > var elements = frm.elements;
>
> > new Ajax.Updater({
> > success:
''team'',
> > failure:
''team''
>
> > },
> > ''players.cgi'', {
> > method: ''POST'',
> > asynchronous: true,
> > evalScripts: true,
> > parameters: {
> > category:
elements[''category''].value ,
> > country:
elements[''country''].value}
> > });
>
> > Event.stop(evt);
> > }
>
> > Ajax.Responders.register({
> > onCreate: function() {
> > if(\$(''loading'') &&
Ajax.activeRequestCount>0)
> >
Effect.Appear(''loading'',{duration:0.5,queue:''end''});
> > },
> > onComplete: function() {
> > if(\$(''loading'') &&
Ajax.activeRequestCount==0)
> >
Effect.Fade(''loading'',{duration:0.5,queue:''end''});
> > }
> > });
>
> > </script>
>
> > Thanks a ton,
> > Naveen
>
> > On Aug 21, 10:20 pm, "Matt Harris"
<harri...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > </select><input type=submit value=GO class=btngo />
>
> > > Change `type` to "button"
> > > ie:
> > > </select><input type="button" value=GO
class=btngo />
>
> > > On 8/21/07, Naveen
<nkrgu...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
> > > > Hi,
>
> > > > I am using prototype.js 1.5.1. I''ve implemented
Ajax.Updater in a
> > > > script which is working fine in both FF 2 and IE 6 except
for the
> > > > following problem in FF only-
>
> > > > When the focus is on the submit button of a form, then
pressing enter
> > > > SUBMITS the form with parameters passed to the url, as if it
were no
> > > > ajax, and output is not displayed. Though Ajax.Updater works
fine if
> > > > the submit button is clicked! This is an Firefox only
problem. The
> > > > link to the script ishttp://sillypoints.com/sel_prot.cgi.
You can
> > > > verify the problem by bringing the focus on any submit
button and then
> > > > pressing enter.
>
> > > > The code is as follows:
>
> > > > <script type="text/javascript">
>
> > > > Event.observe(window,''load'',function(e)
> > > > {
>
> > > >
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> > > > });
>
> > > > function handleSubmit(evt)
> > > > {
> > > > var frm =
Event.element(evt);
> > > > var elements =
frm.elements;
>
> > > > new Ajax.Updater({
> > > >
success:
> > > > ''team'',
> > > >
failure:
> > > > ''team''
>
> > > > },
> > > >
''players.cgi'', {
> > > > method:
''POST'',
> > > >
asynchronous: true,
> > > > evalScripts:
true,
> > > > parameters:
{
> > > >
category:
> > > > elements[''category''].value ,
> > > >
country:
> > > > elements[''country''].value}
> > > > });
>
> > > > Event.stop(evt);
> > > > }
>
> > > > Ajax.Responders.register({
> > > > onCreate: function() {
> > > >
if($(''loading'') &&
> > > > Ajax.activeRequestCount>0)
> > > >
Effect.Appear(''loading'',
> > > > {duration:0.5,queue:''end''});
> > > > },
> > > > onComplete: function() {
> > > >
if($(''loading'') &&
> > > > Ajax.activeRequestCount==0)
> > > >
Effect.Fade(''loading'',
> > > > {duration:0.5,queue:''end''});
> > > > }
> > > > });
>
> > > > </script>
>
> > > > </head>
>
> > > > <body style="font-family:verdana;
font-size:10px">
> > > > <br><br><form
id="form_one" name="form_one">
> > > > SHOW<select name="category"
class=sel>
> > > > <option
value="all">All Players</option>
> > > > <option
value="Batsman">Batsmen</option>
> > > > <option
value="Bowler">Bowlers</option>
>
> > > > <option
value="Wk">Wicket Keepers</option>
> > > > </select>
>
> > > > FROM<select name="country"
class=sel>
> > > > <option
value="all">All Countries</option>
> > > > <option
value="australia">Australia</option><option
> > > >
value="bangladesh">Bangladesh</option><option
> > > > value="bermuda">Bermuda</
> > > > option><option
value="canada">Canada</option><option
> > > >
value="england">England</option><option
value="india">India</
> > > > option><option
value="ireland">Ireland</option><option
> > > > value="kenya">Kenya</option><option
value="netherlands">Netherlands</
> > > > option><option
value="newzealand">Newzealand</option><option
> > > >
value="pakistan">Pakistan</option><option
value="scotland">Scotland</
> > > > option><option
value="southafrica">Southafrica</option><option
> > > >
value="srilanka">Srilanka</option><option
value="windies">Windies</
> > > > option><option
value="zimbabwe">Zimbabwe</option>
>
> > > > </select><input type=submit
value=GO class=btngo />
> > > > </form>
> > > > <br><br>
> > > > <table width=100% height=100%
border=0>
> > > > <tr>
> > > > <td valign=top width=40%
height=100%>
> > > > <div
id="team" style="width:
> > > > 400px;float:left;"></div>
> > > > </td>
> > > > <td valign=top width=20%
height=100%>
>
> > > > <span
id=''loading''
> > > > style="display:none"><img
src=ajax-loader.gif /
> > > > ></span>
>
> > > > </td>
> > > > <td valign=top width=40%
height=100%>
> > > > <div
id="players" style="width:
> > > > 400px;float:right;"></div>
> > > > </td>
> > > > </tr>
> > > > </table>
>
> > > > Where am I going wrong?
>
> > > > Thanks,
> > > > Naveen
>
> > > --
> > > Matt Harris
> > > (250)-588-2275
>
> --
> Matt Harris
> (250)-588-2275
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Hi,
I had the same problem some time ago and I did this as a workaround:
Event.observe($(''form_id''), ''submit'',
function(event) {
Event.stop(event);
}
);
It says that when the form is submited it will stop the submission.
The code should be placed right after the form.
Hope that helps, and sorry for reply an old post.
Saludos!
Fede.
On Aug 21, 2:13 pm, Naveen
<nkrgu...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> Hi,
>
> I am using prototype.js 1.5.1. I''ve implementedAjax.Updater in a
> script which is working fine in both FF 2 and IE 6 except for the
> following problem in FF only-
>
> When the focus is on the submit button of a form, then pressing enter
> SUBMITS the form with parameters passed to the url, as if it were noajax,
and output is not displayed. ThoughAjax.Updater works fine if
> the submit button is clicked! This is an Firefox only problem. The
> link to the script ishttp://sillypoints.com/sel_prot.cgi. You can
> verify the problem by bringing the focus on any submit button and then
> pressing enter.
>
> The code is as follows:
>
> <script type="text/javascript">
>
> Event.observe(window,''load'',function(e)
> {
>
>
Event.observe(document.forms[''form_one''],''submit'',handleSubmit);
> });
>
> function handleSubmit(evt)
> {
> var frm = Event.element(evt);
> var elements = frm.elements;
>
> newAjax.Updater({
> success:
> ''team'',
> failure:
> ''team''
>
> },
> ''players.cgi'', {
> method:
''POST'',
> asynchronous: true,
> evalScripts: true,
> parameters: {
> category:
> elements[''category''].value ,
> country:
> elements[''country''].value}
> });
>
> Event.stop(evt);
> }
>
> Ajax.Responders.register({
> onCreate: function() {
> if($(''loading'')
&&Ajax.activeRequestCount>0)
>
Effect.Appear(''loading'',
> {duration:0.5,queue:''end''});
> },
> onComplete: function() {
> if($(''loading'')
&&Ajax.activeRequestCount==0)
>
Effect.Fade(''loading'',
> {duration:0.5,queue:''end''});
> }
> });
>
> </script>
>
> </head>
>
> <body style="font-family:verdana;
font-size:10px">
> <br><br><form id="form_one"
name="form_one">
> SHOW<select name="category" class=sel>
> <option value="all">All
Players</option>
> <option
value="Batsman">Batsmen</option>
> <option
value="Bowler">Bowlers</option>
>
> <option value="Wk">Wicket
Keepers</option>
> </select>
>
> FROM<select name="country" class=sel>
> <option value="all">All
Countries</option>
> <option
value="australia">Australia</option><option
> value="bangladesh">Bangladesh</option><option
> value="bermuda">Bermuda</
> option><option
value="canada">Canada</option><option
> value="england">England</option><option
value="india">India</
> option><option
value="ireland">Ireland</option><option
> value="kenya">Kenya</option><option
value="netherlands">Netherlands</
> option><option
value="newzealand">Newzealand</option><option
> value="pakistan">Pakistan</option><option
value="scotland">Scotland</
> option><option
value="southafrica">Southafrica</option><option
> value="srilanka">Srilanka</option><option
value="windies">Windies</
> option><option value="zimbabwe">Zimbabwe</option>
>
> </select><input type=submit value=GO class=btngo
/>
> </form>
> <br><br>
> <table width=100% height=100% border=0>
> <tr>
> <td valign=top width=40% height=100%>
> <div id="team"
style="width:
> 400px;float:left;"></div>
> </td>
> <td valign=top width=20% height=100%>
>
> <span
id=''loading''
> style="display:none"><img src=ajax-loader.gif /
>
> ></span>
>
> </td>
> <td valign=top width=40% height=100%>
> <div id="players"
style="width:
> 400px;float:right;"></div>
> </td>
> </tr>
> </table>
>
> Where am I going wrong?
>
> Thanks,
> Naveen
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---