Hello,
I uploaded the updated version:
http://www.27lamps.com/Beta/List/List.html#remove
There is only two problems:
1. The value of the select is not being added.
2. If i have multiple chekboxes on the same group I would like to add
only the values of ones selected.
The ideal would be to have the following format:
Name. Country. 1st CheckBox selected, 2st CheckBox selected, ...
This way I can understand that each dot separates an input and a comma
separates the selected values of a check box group.
How can I do this?
Thanks,
Miguel
On Oct 22, 2:45 am, shapper <[EMAIL PROTECTED]> wrote:
> Hi,
>
> I will try it. Sorry, but I am no expert with JQuery and I am just
> trying to pull this off.
>
> I understand that a plugin should have many more options but my
> intention is to have this plugin so I can use across my projects and
> with time improve it.
> It would be easier to make this without being a plugin? I am not
> really sure how the code would change ...
>
> I was looking for such a plugin but I wasn't able to find any ... I
> think this is really useful.
>
> Just select the inputs, the button, the list and the format as the
> inputs values would be displayed. Then use something like:
> <li>Book Type. Book Name. Values of selected CheckBoxes separated by
> commas<input type="hidden" name="myList" value="Book Type. Book Name.
> Values of selected CheckBoxes separated by commas" /><a
> href="#remove"class="remove">Remove Item</a></li>
>
> Then I use the hidden inputs to read the info on the server after the
> form is submitted, parse the info and insert it into the database
> along with the other form info.
>
> Does this makes any sense?
>
> Yes, I could use Ajax but the form has a lot more information and
> these list info should be only saved into the database if the user
> submits the register form itself.
> So if i send this info through ajax there will no where to save it
> since the user didn't register yet.
>
> Is this what you meant?
>
> Thank You,
> Miguel
>
> On Oct 22, 1:45 am, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > Install the Firebug extension for Firefox so you can debug your code
> > easily:www.getfirebug.com
>
> > I don't mean it's not good for a plug-in, I mean it's a very specific
> > behaviour. To be useful to a large number of people it would need to
> > be very flexible and customizable.
>
> > On your test page, you forgot to close the function and you're not
> > using it the right way. As it is you should have used:
>
> > $('form').createList('#MyList') // form is the form from where you are
> > getting the values, you pass createList() the list ID
>
> > I changed it to act from the elements themselves, here is a new one:
>
> > $(document).ready(function() {
>
> > $.fn.createList = function(opt){
> > var origin = this.eq(0).parents('form');
> > var $fields = this;
> > $(opt.button,origin).bind('click',function(){
> > str = [];
> > $fields.each(function(){
> > str.push($(this).val());
> > });
> > str = str.join(',');
> > $('<li></li>').appendTo(opt.list).append(str).append(' <a
> > href="#remove" class="remove">Remove Item</a>');
> > return false;
> > });
> > }
>
> > });
>
> > The way you use this is the following:
>
> > $('input.name,input.country,input.newsletter').createList({ list:
> > '#MyList', button: 'input.sendToList' })
>
> > First you select the form inputs that you want to get the values from,
> > then you call createList and pass an object specifying a selector for
> > the list and for the button you want to use, they can be any selector
> > (ID,class,etc). The code is quite self-explanatory.
>
> > You could also send this data directly to the server via Ajax, there
> > is no need to put it in a list just for that.
>
> > cheers,
> > Ricardo
>
> > On Oct 21, 9:07 pm, shapper <[EMAIL PROTECTED]> wrote:
>
> > > Hi,
>
> > > I tried to follow your tips but I might be doing something
> > > wrong:http://www.27lamps.com/Beta/List/List.html
>
> > > A few questions:
> > > 1. Why isn't this good for a plugin?
> > > I fell this is really useful in forms for selecting multiple
> > > items, add them to the a list and then read that list from server
> > > side.
>
> > > 2. Can't I specify the ID's of the form inputs I want to take the info
> > > from?
> > > My form has 10 inputs and 2 buttons: One should submit the form.
> > > The other should only add the contents of the 3 selected inputs to the
> > > list.
>
> > > Thank You,
> > > Miguel
>
> > > On Oct 16, 9:47 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > This is quite specific to made into an actual plug-in, but here it
> > > > goes:
>
> > > > $.fn.createList = function(list){
> > > > var origin = this;
> > > > $(':submit',origin).bind('click',function(){
> > > > str = [];
> > > > console.log($('input,select,checkbox:checked',origin));
> > > >
> > > > $('.name,.country,.newsletter:checked',origin).each(function(){
> > > > str.push($(this).val());
> > > > });
> > > > str = str.join(',');
> > > > $('<li></li>').appendTo(list).append(str).append(' <a
> > > > href="#remove"
> > > > class="remove">Remove Item</a>');
> > > > return false;
> > > > });
>
> > > > };
>
> > > > <form>
> > > > <input class="name"/>
> > > > <select class="country">
> > > > <option value="France">France</option>
> > > > <option value="Portugal">Portugal</option>
> > > > <option value="UK">UK</option>
> > > > <option value="US">US</option>
> > > > </select>
> > > > <input type="checkbox" value="Newsletter" class="newsletter"
> > > > name="newsletter"/>
> > > > <input type="submit" value="Add to List"/>
> > > > </form>
>
> > > > 1. you were binding the 'remove buttons' everytime you ran the
> > > > function, keep the livequery call outside the function so it only runs
> > > > once
> > > > 2. your HTML was missing IDs, I made them into classes so you don't
> > > > need to pass IDs everytime
> > > > 3. 'this' inside your appendTo() was refering to the button, not the
> > > > form
>
> > > > only tested on FF3, works alright.
>
> > > > - ricardo
>
> > > > On Oct 16, 8:39 am, shapper <[EMAIL PROTECTED]> wrote:
>
> > > > > Hi,
>
> > > > > I added a live example to:http://www.27lamps.com/Beta/List/List.html
>
> > > > > It is not working. Could someone, please, help me with this?
>
> > > > > I am trying to create something similar to what is used in wordpress
> > > > > to add tags to a post but getting the values from multiple form
> > > > > inputs.
>
> > > > > Thanks,
> > > > > Miguel
>
> > > > > On Oct 16, 5:58 am, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > > > > If the ids are supplied in '#id,#otherid,#otherid' format, you could
> > > > > > do:
>
> > > > > > var str = new String;
> > > > > > $(options.formids).each(function(){
> > > > > > str += $(this).val();
> > > > > > str += ',';});
>
> > > > > > $('<li/>').appendTo(options.listid).text(str);
>
> > > > > > - ricardo
>
> > > > > > On Oct 15, 9:49 pm, shapper <[EMAIL PROTECTED]> wrote:
>
> > > > > > > Hello,
>
> > > > > > > I am trying to create my first JQuery plugin that does the
> > > > > > > following:
>
> > > > > > > On a form, when a button is pressed, a few form elements values
> > > > > > > are
> > > > > > > used to create a string (CSV format).
> > > > > > > This string is added to an ordered list and with a remove button
> > > > > > > to
> > > > > > > remove it from the list.
>
> > > > > > > Could someone, please, help me making this work. What I have is:
>
> > > > > > > (function($) {
> > > > > > > $.fn.AddToList = function(options) {
>
> > > > > > > var defaults = {
> > > > > > > formids: "input1, select1, input2",
> > > > > > > buttonId: "submit",
> > > > > > > listId: "items"
> > > > > > > };
> > > > > > > var options = $.extend(defaults, options);
>
> > > > > > > return this.each(function() {
>
> > > > > > > $('.Remove')
> > > > > > > .livequery('click', function(event) {
> > > > > > > $(this).parent().remove();
> > > > > > > });
>
> > > > > > > $(options.buttonId).bind('click', function() {
>
> > > > > > > $(options.listID).append("<li>??????</li>");
>
> > > > > > > });
>
> > > > > > > });
> > > > > > > };
>
> > > > > > > })(jQuery);
>
> > > > > > > I created three parameters:
>
> > > > > > > formids: The ids of the form elements from where the content
> > > > > > > should
> > > > > > > be taken
> > > > > > > buttonId: The id of the button that triggers the adding of the
> > > > > > > form
> > > > > > > element values to the list
> > > > > > > listId: The listid where the items should be added.
>
> > > > > > > I am using LiveQuery to add the remove action to the button
> > > > > > > adding a
> > > > > > > class of Remove to all buttons.
>
> > > > > > > Thanks,
> > > > > > > Miguel
