[Proto-Scripty] I want to use autocompleter in an array of input text fields (name[])
Hi,
I'm trying to have a multiple input text fields with a name name[]
so that I will be able to process them as an array with PHP and Insert
them in Mysql.
But as soon as I use the bracket, the autocompleter stops working. Is
there any way to go around it?
document.observe('dom:loaded', function() {
new Ajax.Autocompleter('name[]', 'name_suggestions','auto.php',{tokens:
[',']});
});
/script
Also, I want to make sure that the value that the user types into the
text field exists in my Mysql database. So the user can only write a
value that matches a value in the database. So when a value that
matches a value in the database is written, how can I catch that?
Should this happen in my auto.php file?
Thank you!
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Submit a form using enter
I whipped this together, tested and confirmed:
document.observe(dom:loaded, function () {
$('login_form').observe('keydown', function (e) {
if ( e.keyCode == 13 ) {
//event.findElement('form').submit();
alert($F('login_str'));
}
});
}, false);
the form i set up looks like:
form id=login_form
input type=text id=login_str
/form
On Wed, Dec 10, 2008 at 11:11 AM, Hector Virgen [EMAIL PROTECTED] wrote:
This is untested, but I would probably do something like this:
$$('form[name=login_form]').invoke('observe', 'keydown', function(event)
{
if (event.keyCode === 13) {
event.findElement('form').submit();
}
});
-Hector
On Wed, Dec 10, 2008 at 4:46 AM, Dave L [EMAIL PROTECTED] wrote:
Im not sure I understand. login_form is the id of the form that I am
trying to submit. and form_submit is the id of the actual submit
button. I tried the following:
document.form.login_form.onkeydown=if(event.keyCode==13)
{this.form.submit();return false;};
and also
$('login_form').form_submit.onkeydown=if(event.keyCode==13)
{this.form.submit();return false;};
but no go. Thanks for your input.
On Dec 10, 1:03 am, pradeep saraswati [EMAIL PROTECTED] wrote:
hai
u are using $('form_submit') does form_submit is the id of the
form
then it will surely does not gonna work in I.E
so you specify a name to the formand access the form
document.form.formname.onkeydown this will work in ie...
i too faced this issuejust try this u r problem will be solved
if u are too much particular in accessing form using $...then use $F and
never access form using the id
IE will never know..what you are doing...if you access form by id
Regards
spradeepkumar
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: dropOnEmpty:true causing flickering ?
Looking into the code a bit more, I believe the fix is the correct
solution for the onEmptyHover function.
As for the reason why there is flickering is because the onEmptyHover
was being toggled for Sortables even though there are items in the
list. And as an item is moving through a list, the onHover function
of the elements themselves are also toggled. So in essence 2 events
with different actions are being fired off subsequently nearly every
time the mouse moves in the list. In a picture the actions look like
this:
---
| onEmptyHover |
|---|
| | onHover | |
|---|
| |
---
Tobias' solution stops this dual events from happening and works as
the dropOnEmpty suggests. Good work!
On Nov 17, 5:22 am, gwineman [EMAIL PROTECTED] wrote:
Great Fix - I had the same problem - works perfect
On Nov 8, 8:05 am, Tobias Gassmann [EMAIL PROTECTED] wrote:
Hi,
I applied a quick and dirty hack to the onEmptyHover-function to get
rid of the flickering when using dropOnEmpty
-- onEmptyHover: function(element, dropon, overlap) {
(it's in the dragdrop.js-file)
There is an if-statement in this function which has to be altered:
the original line in Version 1.8.1 of scriptaculous reads:
-- if(!Element.isParent(dropon, element)) {
changing this line to
-- if((!Element.isParent(dropon, element))
(Element.empty(dropon))) {
turned the flickering off.
This can only be used, in case there are no other html-elements in the
empty Drop-On-Element. Otherwise it remains undroppable.
The reason for the flickering is (as far as I figured it out) the
Element.isParent(dropon,element) returning false, even when the
dragged item is still within it's original parent. By checking wether
the underlying Droppable is really empty (and therefore not the home-
droppable, where the dragged item came from), we can assure that the
onEmptyHover-Code is not executed falsely.
This is only a quick and dirty hack, I did not completely analyze the
scriptaculous-code, so it might not work for everyone.
bye!
Tobias
On Oct 10, 1:15 pm, Sumita [EMAIL PROTECTED] wrote:
Hi,
I have a horizontal sortable with three images arranged horizontally
in a div (images in a div tag). The moment I introduce
dropOnEmpty:true, and I try to drop an image from another sortable,
there is a flickering and the sortable is creates its own drop
position.
Can you suggest a solution??
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Behaviour.js/Event.Observe: how to make it work when it's in an Ajax.Updater-updated element?
Hey all! So. This has come up several times since I've been using Prototype/ Behaviour. I feel like it must have been covered before but I can't find it anywhere and I'm worried that I don't quite know what to search for: Say, for example, I have an unordered list. In my initial page, I have Behaviour rules set up, read from a separate JS file, which change the className when I mouseover, and change it back when I mouseout. This works fine. I have another element, a button, and when I click that button it triggers an Ajax.Update of my list, pulling contents from a PHP file. Also works fine. But now, my new updated list doesn't respond to the Behaviour rules. Were I to add, into the HTML, onmouseover and onmouseout attributes, it would work fine. But it is not registering the Behaviour. It does not seem to matter if the JS is loaded in the PHP page or not. I'm noticing that the Behaviour page is gone and there doesn't seem to be any reference to it at all on Ben Nolan's site. I know I could/ should be using Event.Observe but it doesn't seem to matter, though I'll admit my tinkering with Event.Observe was less than deft. Any ideas? Any help at all would be much appreciated. I'm just coming out of a brief flirtation with Dojo and I'm remembering how much I like Prototype/Script.aculo.us. It just makes more sense to me! ...Except for this one thing. Ian --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Scriptaculous 1.8.2 not loading library files
Hi George,
Thank you very much for your answer. Yes, it did help me a bit!
-
The problem is that I don't load those libraries directly, but using
the google.load() functionality. So my question was: where does
google.load() insert the scripts I call?
Thanks a lot!
On 10 dic, 14:53, George [EMAIL PROTECTED] wrote:
Hi There,
I use the google API loader, just above the closing body tag like
this:
script type=text/javascript src=http://ajax.googleapis.com/ajax/
libs/prototype/1.6.0.3/prototype.js/script
script type=text/javascript src=http://ajax.googleapis.com/ajax/
libs/scriptaculous/1.8.1/scriptaculous.js?
load=effects,dragdrop,builder/script
The javascript declarations for the Scriptaculous dependent files are
inserted directly under the original call in 1.8.1. I also noticed
that in 1.8.2 it only works if you have the declaration in the page
head.
At the moment, I'm sticking with 1.8.1 but to be honest, there's no
reason why I couldn't move the declarations to the head of the
document.
Sorry that's not an answer, but hopefully it helps a bit.
George
On Dec 9, 9:06 am, Alejo [EMAIL PROTECTED] wrote:
I'm sorry to re-open this thread, but no-one has told me anything
about it.
Does anyone use Google Ajax Loader API with Prototype Scriptaculous?
Have you got the same problem? How can I solve it?
Thank you in advance.
On 1 dic, 17:18, Alejo [EMAIL PROTECTED] wrote:
I also have the same problem, but I use Google Ajax API Loader, so I
don't know if the loader puts the javascript files in the head or
somewhere else. How can I solve this problem??
Thank you in advance.
On 1 dic, 09:27, joe.roback [EMAIL PROTECTED] wrote:
So, why can't your scripts be in the head? Do you know you can add
scripts to the head dynamically? Like this:
for example, pixelpost photoblog, you want to only load these in the
image_template.html, and have a header.html+footer.html defined, the
scripts will have to go in the body.
I also found issues with xhtml1.1 and the DOM. Had to use these
insteaad
function createElement(element) {
if (typeof document.createElementNS != 'undefined') {
return
document.createElementNS('http://www.w3.org/1999/xhtml',
element);
}
else if (typeof document.createElement != 'undefined') {
return document.createElement(element);
}
return false;
}
function setAttribute(element, name, value) {
if (typeof element.setAttributeNS != 'undefined') {
return
element.setAttributeNS('http://www.w3.org/1999/xhtml', name,
value);
}
else if (typeof element.setAttribute != 'undefined') {
return element.setAttribute(name, value);
}
return false;
}
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: I want to use autocompleter in an array of input text fields (name[])
On Dec 9, 11:31 pm, tumba [EMAIL PROTECTED] wrote:
Hi,
I'm trying to have a multiple input text fields with a name name[]
so that I will be able to process them as an array with PHP and Insert
them in Mysql.
But as soon as I use the bracket, the autocompleter stops working. Is
there any way to go around it?
document.observe('dom:loaded', function() {
new Ajax.Autocompleter('name[]', 'name_suggestions','auto.php',{tokens:
[',']});});
The first argument to Ajax.Autocompleter must be the object ID, not
its name: HTML id's must be unique in the document, and may not
contain '[' or ']'. The 'name' attribute (which is significant for a
form element) may be any character data, and is where some systems
treat '[]' specially.
I'm not certain but I think if you define your input element as
input type = text id = name name = name[] ...
and then
new Ajax.Autocomplete('name', ... )
it will work.
Also, I want to make sure that the value that the user types into the
text field exists in my Mysql database. So the user can only write a
value that matches a value in the database. So when a value that
matches a value in the database is written, how can I catch that?
Should this happen in my auto.php file?
Yes. The whole point of using an autocompleter is that your back-end
code should do the DB access and return only the values *in the
database* which match what the user has so far typed.
Colin
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] multiple elements with the same id
I have a table with 12 rows with an id of row. The following code
works great for the first row but not the following rows. How can I
make this work without creating both entries 12 times.
script type=text/javascript
Event.observe(window, 'load', function() {
$('row').observe( 'mouseover', function(event) { $('row').addClassName
('hover'); });
$('row').observe( 'mouseout', function(event) { $
('row').removeClassName('hover'); });
});
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: multiple elements with the same id
The distinction between id and class is that there should only be one
element per page with a particular id but you could have one or more
elements with the same class.
What you could do is find all the elements that have the class row and
then iterate to observe each with the following syntax:
$$('.row') gets all the elements. Then you can iterate on them. You
can call .size() and reference the collection at a particular index
with $$('.row')[i]. Then attach your observers to each one of those.
On Dec 11, 2:37 pm, Russell rkeith2...@gmail.com wrote:
I have a table with 12 rows with an id of row. The following code
works great for the first row but not the following rows. How can I
make this work without creating both entries 12 times.
script type=text/javascript
Event.observe(window, 'load', function() {
$('row').observe( 'mouseover', function(event) { $('row').addClassName
('hover'); });
$('row').observe( 'mouseout', function(event) { $
('row').removeClassName('hover'); });
});
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Creating an InPlaceCalendarEditor problem with Form.Element.Serializers
I've been trying to create a series of drop downs that extends the
inPlaceEditor class that is used in Scriptaculous and it keeps
throwing up on the prototype getValue function. This code was
originally for an older version of prototype and scriptaculous and was
posted as a rails patch back in 2006. The code will be below this
post.
It does appear as though the form never actually gets to the onSubmit
action which is probably why I'm having this problem. Any help,
ideas, or flat out alternative solutions would be appreciated. If you
need more information by all means let me know and I can deliver.
Error in Firebug:
Form.Element.Serializers[method] is not a function
getValue()(div)prototyp...223404303 (line 3524)
handleFormSubmission()(submit )controls...223063372 (line 622)
(?)()()prototyp...223404303 (line 208)
[Break on this error] return Form.Element.Serializers[method]
(element);
In HTML:
span id=unique_dateJanuary 1, 2008/span
script type='text/javascript'
new Ajax.InPlaceCalendarEditor(unique_date, #,
{ fieldPostCreation: false, value: '2008-01-01' } );
/script
Javascript Code:
Ajax.InPlaceCalendarEditor = Class.create();
Object.extend(Ajax.InPlaceCalendarEditor.prototype,
Ajax.InPlaceEditor.prototype);
Object.extend(Ajax.InPlaceCalendarEditor.prototype,
{
createSelectBox: function(collection, value)
{
var selectTag = document.createElement(select);
collection.each(function(e, i)
{
optionTag = document.createElement(option);
optionTag.value = (e instanceof Array) ? e[0] : e;
var optionName = (e instanceof Array) ? e[1] : e;
if (value == optionTag.value)
optionTag.selected = true;
optionTag.appendChild(document.createTextNode(optionName));
selectTag.appendChild(optionTag);
}.bind(this));
return selectTag;
},
createCheckBox: function(value)
{
var labelTag = document.createElement(label);
checkTag = document.createElement(input);
checkTag.type = checkbox;
checkTag.id = valueCheck;
checkTag.checked = value;
labelTag.appendChild(checkTag);
labelTag.appendChild(document.createTextNode(' never'));
return labelTag;
},
createEditField: function()
{
if (!this.cached_Div)
{
var parts = this.options.value.split('-');
var theDiv = document.createElement(div);
var days = new Array();
for (var i = 1; i = 31; i++)
days[days.length] = [(i 10) ? '0' + i : i, i];
theDiv.appendChild(this.createSelectBox(days,
parts[2]));
var months = [['01', 'January'],
['02',
'February'],
['03',
'March'],
['04',
'April'],
['05',
'May'],
['06',
'June'],
['07',
'July'],
['08',
'August'],
['09',
'September'],
['10',
'October'],
['11',
'November'],
['12',
'December']];
theDiv.appendChild(this.createSelectBox(months,
parts[1]));
var years = new Array();
for (var i = 2006; i = 2020; i++)
years[years.length] = [(i 10) ? '0' + i : i,
i];
theDiv.appendChild(this.createSelectBox(years,
parts[0]));
if (this.options.never)
theDiv.appendChild(this.createCheckBox(parts[0]
== ''));
this.cached_Div = theDiv;
}
//this.editField = this.cached_Div;
this._controls.editor = this.cached_Div;
if (this.options.loadTextURL)
this.loadExternalText();
//this.form.appendChild(this.editField);
this._form.appendChild(this._controls.editor);
