In the new / edit screen for an "item" I''d like to be able to
add/remove
"sub-items"
on pressing an add button below the "sub-items" a bit of a form shows
up
with the html looking something like:
<div id="uniqueid">
<!-- label etc here -->
<input type="text" id="sub_items[]"
name="sub_items[]" size="20"/>
<a href="#" onclick="new
Ajax.Updater(''uniqueid'', ''/items/hide'',
{asynchronous:true, evalScripts:true}); return false;" >delete</a>
</div>
The problem: making unique ids for these form elements, generate a random
number and hope for no collisions? store it somewhere? (this led me to all
kinds of questions about sessions)
Also: right now I''ve just got a action ''hide'' that
renders nothing that I
use to delete the form element.. is there a better practice?
Basically I''m wondering how they did the lists in Backpack ;-)
Thanks!
--
Kevin
http://kevin.is-a-geek.net
-------------- next part --------------
An HTML attachment was scrubbed...
URL:
http://wrath.rubyonrails.org/pipermail/rails/attachments/20060221/ef26866c/attachment.html
On Tue, Feb 21, 2006 at 01:11:22AM -0500, Kevin Davis wrote:
} In the new / edit screen for an "item" I''d like to be able
to add/remove
} "sub-items"
}
} on pressing an add button below the "sub-items" a bit of a form
shows up
} with the html looking something like:
}
} <div id="uniqueid">
} <!-- label etc here -->
} <input type="text" id="sub_items[]"
name="sub_items[]" size="20"/>
} <a href="#" onclick="new
Ajax.Updater(''uniqueid'', ''/items/hide'',
} {asynchronous:true, evalScripts:true}); return false;"
>delete</a>
} </div>
I recommend against using AJAX for this sort of thing. Yes, you want
JavaScript and DHTML, but not AJAX. The difference is that when adding and
removing items, the user is likely to be more comfortable not having the
changes committed until s/he hits the Update (or Submit, or whatever)
button. If you use AJAX you are effectively committing every add and remove
immediately.
} The problem: making unique ids for these form elements, generate a random
} number and hope for no collisions? store it somewhere? (this led me to all
} kinds of questions about sessions)
Use positive numbers for existing ids (probably already the case) and
negative numbers for newly created, and thus not yet committed, ids.
I''m
assuming these subitems are a has_many relationship (though it would work
just as well with habtm). In your controller, remove any missing positive
ids and create subitems for any negative ids.
} Also: right now I''ve just got a action ''hide'' that
renders nothing that I
} use to delete the form element.. is there a better practice?
Yes. Use JavaScript, not AJAX.
} Basically I''m wondering how they did the lists in Backpack ;-)
I have no idea. I''m talking about the right way to interact with a
user.
} Thanks!
} Kevin
--Greg
Thanks so much for responding,
I wasn''t planning on actually committing such information to the DB
before
the user had pressed submit on the larger form, but had rather planned on it
fetching sections of form from the server. While it does seem a bit much to
do a round trip just for a bit of form, if pieces of it depend on either the
information entered thus far, or lists of things I''d rather not
hardcode in
some script somewhere.
For example, I''d like to add one or many phone numbers to a contact
info
page. Pressing ''add another number'' would head back to the
server for a
rendered bit of a form with say a select containing possible types of phone
numbers. What would be the best way to structure this using Javascript? have
a seperate file for functions related to a given controller?
Thanks again for your help,
From: Gregory Seidman <gsslist+ror@anthropohedron.net >
Subject: Re: [Rails] AJAX sub-list
To: rails@lists.rubyonrails.org
Message-ID: < 20060221122810.GA24261@anthropohedron.net>
Content-Type: text/plain; charset=us-ascii
On Tue, Feb 21, 2006 at 01:11:22AM -0500, Kevin Davis wrote:
} In the new / edit screen for an "item" I''d like to be able
to add/remove
} "sub-items"
}
} on pressing an add button below the "sub-items" a bit of a form
shows up
} with the html looking something like:
}
} <div id="uniqueid">
} <!-- label etc here -->
} <input type="text" id="sub_items[]"
name="sub_items[]" size="20"/>
} <a href="#" onclick="new
Ajax.Updater(''uniqueid'', ''/items/hide'',
} {asynchronous:true, evalScripts:true}); return false;"
>delete</a>
} </div>
I recommend against using AJAX for this sort of thing. Yes, you want
JavaScript and DHTML, but not AJAX. The difference is that when adding and
removing items, the user is likely to be more comfortable not having the
changes committed until s/he hits the Update (or Submit, or whatever)
button. If you use AJAX you are effectively committing every add and remove
immediately.
} The problem: making unique ids for these form elements, generate a random
} number and hope for no collisions? store it somewhere? (this led me to all
} kinds of questions about sessions)
Use positive numbers for existing ids (probably already the case) and
negative numbers for newly created, and thus not yet committed, ids.
I''m
assuming these subitems are a has_many relationship (though it would work
just as well with habtm). In your controller, remove any missing positive
ids and create subitems for any negative ids.
} Also: right now I''ve just got a action ''hide'' that
renders nothing that I
} use to delete the form element.. is there a better practice?
Yes. Use JavaScript, not AJAX.
} Basically I''m wondering how they did the lists in Backpack ;-)
I have no idea. I''m talking about the right way to interact with a
user.
} Thanks!
} Kevin
--Greg
--
Kevin
http://kevin.is-a-geek.net
-------------- next part --------------
An HTML attachment was scrubbed...
URL:
http://wrath.rubyonrails.org/pipermail/rails/attachments/20060222/2e181406/attachment.html
On Tue, Feb 21, 2006 at 11:24:00PM -0500, Kevin Davis wrote:
} Thanks so much for responding,
}
} I wasn''t planning on actually committing such information to the DB
before
} the user had pressed submit on the larger form, but had rather planned on it
} fetching sections of form from the server. While it does seem a bit much to
} do a round trip just for a bit of form, if pieces of it depend on either the
} information entered thus far, or lists of things I''d rather not
hardcode in
} some script somewhere.
}
} For example, I''d like to add one or many phone numbers to a contact
info
} page. Pressing ''add another number'' would head back to the
server for a
} rendered bit of a form with say a select containing possible types of phone
} numbers. What would be the best way to structure this using Javascript? have
} a seperate file for functions related to a given controller?
Unless this is something that will be changing based on information the
client doesn''t (and shouldn''t) have and changes with each
operation, plain
JavaScript is a better choice than full AJAX. If you need to append a
particular scrap of HTML in place each time a button is clicked, but the
client has sufficient information to know what that scrap should be, just
go ahead and create it in JavaScript. If the particulars of that scrap need
to come from the server, but don''t change from click to click, put the
JavaScript code (or a reference to a helper method that generates it) in
the view''s .rhtml file.
Since I thought I pretty much explained that before, I''ll include an
example to help with the clarity of this post. Actually, I''ll use your
example. Suppose that you have a contact form that allows an arbitrarily
long list of phone numbers. Each number is identified with a tag, like Work
or Personal, and that list of tags comes from the database. Note that I am
using pseudocode here, and not encapsulating much because I want to show it
all in the .rhtml file:
<html><head><title><%= @contact.name %>: contact
info</title>
<script>
var phoneTypes = [
<% PhoneType.find_all.each { |t| %>
<%= "{ name : ''#{t.name}'', id : #{t.id} }," %>
<% } %>
null ];
function createPhoneSelect(newID) {
var phoneTypeList = new Select("phoneType["+newID+"]");
for (var i=0; i<phoneTypes.length; ++i)
phoneTypeList.addOption(new Option(phoneTypes[i].id,
phoneTypes[i].name));
return phoneTypeList;
}
// ...
</script>
</head><body>
<!-- ... -->
</body></html>
So there you have some JavaScript that creates the HTML form control for
the phone type from the data that is stored in the database. There is no
need for AJAX to populate that select list. Note, by the way, that the API
calls are probably wrong; I didn''t look anything up and I
don''t have either
the JavaScript or ActiveRecord APIs memorized.
} Thanks again for your help,
--Greg
} From: Gregory Seidman <gsslist+ror@anthropohedron.net >
} Subject: Re: [Rails] AJAX sub-list
} To: rails@lists.rubyonrails.org
} Message-ID: < 20060221122810.GA24261@anthropohedron.net>
} Content-Type: text/plain; charset=us-ascii
}
} On Tue, Feb 21, 2006 at 01:11:22AM -0500, Kevin Davis wrote:
} } In the new / edit screen for an "item" I''d like to be
able to add/remove
} } "sub-items"
} }
} } on pressing an add button below the "sub-items" a bit of a form
shows up
} } with the html looking something like:
} }
} } <div id="uniqueid">
} } <!-- label etc here -->
} } <input type="text" id="sub_items[]"
name="sub_items[]" size="20"/>
} } <a href="#" onclick="new
Ajax.Updater(''uniqueid'', ''/items/hide'',
} } {asynchronous:true, evalScripts:true}); return false;"
>delete</a>
} } </div>
}
} I recommend against using AJAX for this sort of thing. Yes, you want
} JavaScript and DHTML, but not AJAX. The difference is that when adding and
} removing items, the user is likely to be more comfortable not having the
} changes committed until s/he hits the Update (or Submit, or whatever)
} button. If you use AJAX you are effectively committing every add and remove
} immediately.
}
} } The problem: making unique ids for these form elements, generate a random
} } number and hope for no collisions? store it somewhere? (this led me to all
} } kinds of questions about sessions)
}
} Use positive numbers for existing ids (probably already the case) and
} negative numbers for newly created, and thus not yet committed, ids.
I''m
} assuming these subitems are a has_many relationship (though it would work
} just as well with habtm). In your controller, remove any missing positive
} ids and create subitems for any negative ids.
}
} } Also: right now I''ve just got a action ''hide''
that renders nothing that I
} } use to delete the form element.. is there a better practice?
}
} Yes. Use JavaScript, not AJAX.
}
} } Basically I''m wondering how they did the lists in Backpack ;-)
}
} I have no idea. I''m talking about the right way to interact with a
user.
}
} } Thanks!
} } Kevin
} --Greg
}
} --
} Kevin
} http://kevin.is-a-geek.net
} _______________________________________________
} Rails mailing list
} Rails@lists.rubyonrails.org
} http://lists.rubyonrails.org/mailman/listinfo/rails