Javascript to set value of textbox when Checkbox is clicked

  • 10 February 2016
  • 5 replies
  • 65 views

Badge +5

Is there a way to set value of text box when a check box is selected?

I am trying to enter the value 1 into a single line text box when a checkbox is selected and then save the form.

Dont have experience with Javascript, so any help will be great.

Thanks


5 replies

Userlevel 7
Badge +11

Hi Abhi,

Open the settings for the Checkbox and expand the Formatting section.  For the control CSS class, set it to cssCheckbox.

For the Textbox, do the same, but set the control CSS class to cssTextbox.  We are going to use these, to find the controls using JavaScript.

Next, open the Form Settings and expand the Custom JavaScript section.  Add the following:

NWF$(document).ready(function()

{

// find the Checkbox control and the Textbox control

  var myCheckbox = NWF$('.cssCheckbox').find("input[type='checkbox']");

  var myTextbox = NWF$('.cssTextbox');

  // add an event handler, when the checkbox is checked or unchecked

  myCheckbox.change(function()

  {

     if(NWF$(this).is(":checked"))

    {

        myTextbox.val('data');

    }

    else

    {

        myTextbox.val('');

    }

  });

});

Hope this helps.

Vadim

Badge +5

Hi Vadim

Thanks for this but it did not work.

I am trying to populate the value of a text box to interger (1, 2 etc) when checkbox is ticked on runtime.

My Scenario: User check the checkbox and as soon as it is checked....Textbox shows value 1 and then we can save the form and it saves value 1 to text box.

Hope I am making sense

Thanks

Userlevel 7
Badge +11

Hi Abhi,

so are you saying that the JavaScript above is way off or is it simply not putting the correct text into the text box?

Vadim

Userlevel 2
Badge +11

Hi Abhi,

Are the field's appearance settings  Visible and Enabled set to Yes? If not visible, the textbox is not available in Javascript and if visible but not Enabled, it will show the value, but not actually save it on submit. At least that's my experience.

My requirement is the same, however I prefer to have some fields not shown on the form...... Which can be accomplished by using a Hide formatting rule with a condition that is always is true.

Userlevel 6
Badge +12

Thanks Rhia Wieclawek‌ for pointing this one out!

We got the .click() working but this approach works just as well (maybe better happy.png)!

Reply