Ext.ux.form.SuperBoxSelect as seen on facebook and hotmail

[ozum]

Another related issue:
When control is initialized as empty and posted, no parameter is included. However when an item is added and deleted then a parameter is included in post with an empty value.

Best regards,

[danh2000]

Another related issue:
When control is initialized as empty and posted, no parameter is included. However when an item is added and deleted then a parameter is included in post with an empty value.

Best regards,

I'll take a look at the disabled issue shortly.

Can you provide some more details about the above problem - how do you 'post' your data - are you using a BasicForm.submit call?

A testcase would be helpful.

Thanks.

[ozum]

Below is a simplified form code for testing purposes:

There are 2 fields: legalname (textfield), target (superboxselect)
When you push save button form will post with PUT method to http://localhost:3000/data/1

I observe PUT data with FireBug.

Step by step cases:

CASE 1:

1. Push save button without touching anything.
2. Form will put values:
   legalname=BikeCo

CASE 2:

1. Refresh form and select "Men" from superboxselect.
2. Push save.
3. Form will put values:
   legalname=BikeCo&target=5001

CASE 3:

1. Refresh form and select "Men" from superboxselect.
2. Then unselect "Men" from superboxselect by pressing one of the x buttons.
3. Push save.
4. Form will put values:
   legalname=BikeCo&target=

Case 1 and 3 should send same values, whereas case 3 sends an extra "target" parameter without any value.

I hope I clarified myself.

Thanks for your attention.

var onSuccessOrFail = function(form, action) {
    var formPanel = Ext.getCmp('myFormPanel');
    formPanel.el.unmask(); // 1
    var result = action.result;
    if (result.success) { // 2
        Ext.MessageBox.alert('Success', action.result.msg);
    } else {
        Ext.MessageBox.alert('Failure', action.result.msg);
    }
}

var submitHandler = function() {
    var formPanel = Ext.getCmp('myFormPanel');
    formPanel.el.mask('Please wait', 'x-mask-loading');

    formPanel.getForm().submit({
        method: 'PUT',
        url: 'http://localhost:3000/data/1',
        success: onSuccessOrFail,
        failure: onSuccessOrFail
    });
}

function deneme() {

    var form = new Ext.form.FormPanel({
        id: "myFormPanel",
        border: false,
        frame: true,
        items: [{
            xtype: 'tabpanel',
            baseCls: "x-plain",
            activeTab: 0,
            frame: false,
            border: true,
            deferredRender: false,
            defaults: {
                frame: false,
                layout: 'form',
                labelWidth: 80,
                defaultType: 'textfield',
                hideMode: 'offsets',
            },
            items: [{
                title: "Main",
                id: "i4",
                autoScroll: true,
                items: [{
                    xtype: 'fieldset',
                    layout: 'column',
                    id: "i3",
                    title: "Main",
                    border: true,
                    defaults: {
                        layout: 'form',
                        border: false,
                        xtype: 'panel',
                    },
                    items: [{
                        columnWidth: 1.000,
                        defaults: {
                            msgTarget: 'side',
                        },
                        items: [{
                            "disabled": false,
                            "value": "BikeCo",
                            "name": "legalname",
                            "xtype": "textfield",
                            "allowBlank": true,
                            "id": "i1",
                            "fieldLabel": "Legal Name"
                        },
                        {
                            "submitValue": true,
                            "disabled": false,
                            "store": [[5004, "A+ Consumers"], [5003, "Children"], [5005, "Home Owners"], [5001, "Men"], [5002, "Women"]],
                            "mode": "local",
                            "value": "",
                            "name": "target",
                            "xtype": "superboxselect",
                            "allowBlank": true,
                            "id": "i2",
                            "fieldLabel": "Target",
                            "resizable": true
                        }

                        ]
                    }

                    ]
                }

                ]
            }

            ]
        }],

        buttons: [{
            text: "Save",
            handler: submitHandler
        }]
    });

    var win = new Ext.Window({
        width: 720,
        height: 480,
        layout: "fit",
        modal: true,
        title: 'Contact',
        items: form
    });

    win.show();

[danh2000]

@ozum,

Thanks, there was a conflict with the forceFormValue config, which I've fixed. I've also rectified the disabled issue in all scenarios.

Thanks for your help, you'll see these fixes in the next version which I'll post soon.

[danh2000]

UPDATE 15/01/2009

Fixed regression that made transforming an HTML Select incompatible with Ext 2.x
Fixed issue with setValue being used prior to rendering.
Fix to prevent passing null to setValue from causing problems.
Fixed inconsistency regarding forceFormValue config and form submits.
Fix to prevent component submitting values when disabled.
Fix to ensure that minChars does not affect a values query.

New version attached to the first post

[danh2000]

UPDATE 15/01/2009 (part 2)

Fix to disable item listeners when component is disabled.

New version attached to the first post

[ozum]

Hello,

In last version (15/01/2010 Part 2), when superboxselect is disabled via initial configuration, whole form disappears.

Regards.

                        {
                            "submitValue": true,
                            "disabled": true,
                            "store": [[5004, "A+ Consumers"], [5003, "Children"], [5005, "Home Owners"], [5001, "Men"], [5002, "Women"]],
                            "mode": "local",
                            "value": "",
                            "name": "target",
                            "xtype": "superboxselect",
                            "allowBlank": true,
                            "id": "i2",
                            "fieldLabel": "Target",
                            "resizable": true
                        }

[danh2000]

@ozum,

It's an issue with the onDisable template method - I expected the hidden field to have been rendered before onDisable was called, but this isn't the case when you specify disabled as part of the config, therefore a JavaScript error is thrown.

I'll post an update soon.

[danh2000]

UPDATE 16/01/2009

Fixed bug when setting disabled in config.
Updated CSS to remove gray background from input when component is disabled.

New version attached to the first post

[danh2000]

UPDATE 16/01/2009 (Part 2)

Fixed to prevent extra empty hiddenName value from being posted.

@frederickd - I'd forgotten about this one until I saw you on the forum

New version attached to the first post