Results 1 to 1 of 1

Thread: Plugin: Ext.ux.form.SubmitFalse for Checkbox submission

  1. #1
    Sencha User
    Join Date
    Sep 2010
    Posts
    13
    Vote Rating
    0
      0  

    Default Plugin: Ext.ux.form.SubmitFalse for Checkbox submission

    Been coding in ExtJS for a few years now, but just recently found myself at a company who actually encourages participation with a community.

    As many of you are probably already aware, the base HTML checkbox will only submit values when checked and submits nothing when unchecked. Sometimes you just want it to submit checked or not. Currently the best solution for this in Ext is the xcheckbox extension, but if you don't want to go all the way to a new checkbox and don't mind the old and ugly checkbox, this is a quick little plugin I threw together to handle the hidden field methodology.

    tl;dr: this plugin will allow your checkboxes to submit no matter what their checked state.

    Code:
    Ext.ns('Ext.ux.form');
    
    Ext.ux.form.SubmitFalse = Ext.extend(function(config){
        Ext.apply(this, config);
    },
    {
        uncheckedValue: 'off',
        
        init:function(component){
            var originalSetValue = component.setValue;
            var negValue = this.uncheckedValue;
    
            var buildInputElement = function(el, name){
                return Ext.DomHelper.insertAfter(el, {
                    tag: 'input',
                    type: 'hidden',
                    value: negValue.toString(),
                    name: name
                }, true);
            };
    
            Ext.apply(component, {
                setValue: function(){
                    originalSetValue.apply(this, arguments);
                    if (this.checked) {
                        if (this.uncheckedHiddenElement != null) {
                            this.uncheckedHiddenElement.remove();
                            this.uncheckedHiddenElement = null;
                        }
                    }
                    else {
                        this.uncheckedHiddenElement = buildInputElement(this.el, this.getName());
                    }
                }
            });
        }
    });
    usage:
    Code:
    {xtype: 'checkbox', boxLabel: 'Example', name: 'examp', inputValue: '1', plugins:[new Ext.ux.form.SubmitFalse({uncheckedValue: '0'})]}
    methodology shamelessly borrowed from:
    http://www.openboxdev.com/?p=213

    I make no claims on the code, nor offer any support if it doesn't work (though if you ask nice, I might try to help).


    Edit: Looks like in ext 3.3, checkbox.setValue is always called after render, so we can reduce this down to a single function override. (note: in Ext 3.2 an earlier, I believe you will need to override onRender with the same logic.)
    Last edited by kayakyakr; 15 Oct 2010 at 6:13 AM. Reason: fixed an issue with 3.3

Similar Threads

  1. Ext.ajax.request form submission.
    By arunns in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 21 Jun 2010, 4:37 PM
  2. How to cancel a form submission from EXT
    By cmilley2000 in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 1 Mar 2010, 8:27 PM
  3. Ext.form extension to prepare checkboxes and dates in form for submission
    By Keith Chadwick in forum Ext 3.x: User Extensions and Plugins
    Replies: 0
    Last Post: 6 Jan 2010, 1:19 PM
  4. Normal submission of an Ext Form (FormPanel)
    By Sierra in forum Community Discussion
    Replies: 2
    Last Post: 19 Jan 2008, 12:20 PM
  5. ASP/Ext Form Submission
    By tpattison in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 25 Apr 2007, 6:30 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •