Get text from checkbox

JavaScript
1

Hi i’m using gravity form plugin and i’ve manageed to pass the value of a checkbox option to another field using the following javascript code.

<script>

var checkboxHandler = {
  
    //Change these IDs to match your form
    checkboxFieldId: 'input_1_1',  //checkbox container ID
    outputFieldId:   'input_1_2',    //hidden field to capture values
     
    checkboxField: null,
    outputField: null,
     
    /*
    Listen to Checkboxes
    ---------------------- */
    init: function() {
     
        this.outputField = document.getElementById(this.outputFieldId);
         
        if( typeof this.outputField === 'undefined' || !this.outputField ) {
            console.error('Missing output field ' + this.outputFieldId);
            return;
        }
         
        this.checkboxField = document.getElementById(this.checkboxFieldId);
        if(typeof this.checkboxField === 'undefined' || !this.checkboxField) {
            console.error('Missing checkbox field ' + this.checkboxFieldId);
            return;
        }
          
        jQuery(this.checkboxField).on(
            'change',
            'input[type=checkbox]',
            {
                checkbox: this.checkboxField,
                output:   this.outputField
            },
            this.setValues
        );
    },
     
     
    /*
    Set text (or hidden) field to list of checkbox values
    ----------------------------------- */
    setValues: function(ev) {
     
        var fields = ev.data;
        var valueString = '';
         
        jQuery(fields.checkbox).find('input:checked').each( function(i){
            valueString += this.value + ', ';
        });
         
        fields.output.value = valueString.replace(/, $/, '');
    }
};
 
jQuery().ready( checkboxHandler.init() );

</script>

Is it possible to pass the text for each option instead of the values? Many thanks

2

Checkboxes don’t have a text attribute. Do you mean the text of the associated <label> element?

If so, it’d help to see a bare bones example (on JSFiddle for example) demonstrating your problem.

3

Hi @James_Hibbard thanks for your answer yes sorry I meant label

4

Ok. Can you provide a runnable code sample, so that we can recreate the problem.

5

Hi how can i recreate it if is runnuning in wordpress?

6

Shouldn’t be hard :slight_smile:

Take a sample of the HTML and paste it into JSFiddle. In the worst case you can find this by inspecting the page source in your browser.

Add just enough JavaScript to recreate the problem you are facing.

Post the link to the Fiddle here.

It might also help (now and in the future) to read this: http://www.sscce.org/

1 Like
7

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.