onclick setting value for input in nested forms

Question

I am trying to set is_deleted to true on clicking remove. I am partially done with it but when I click on remove it just set the all nested departments to is_deleted true. Here is my parent form:

    .h3 Process Step
    = f.fields_for :departments do |d|
      %div.fields
        = render 'department_fields', :f => d
    %div.fields
      = link_to_add_fields "Add Department", f, :departments

Here is my nested_form
%div.fields#department_fields
  = f.input :title
  = f.text_field :is_deleted, id: "is_deleted", class: "is_deleted"
  .remove_department remove

Here is my javascript:

:javascript
  $(document).on('click', '.remove_department', function () {
    $('.is_deleted').val('1');
  })

Here is my generated html:

<div class="col-sm-2 col-md-offset-1" style="outline: 1px solid black;">
                  <div class="h3">Process Step</div>
                  <div class="fields">
                    <div class="fields" id="department_fields">
                      <div class="form-group string required dealership_departments_title"><label class="string required control-label" for="dealership_departments_attributes_0_title"><abbr title="required">*</abbr> Title</label><input class="string required form-control" id="dealership_departments_attributes_0_title" name="dealership[departments_attributes][0][title]" type="text" value="test"></div>
                      <input class="is_deleted" id="is_deleted" name="dealership[departments_attributes][0][is_deleted]" type="text" value="1">
                      <div class="remove_department">remove</div>
                    </div>
                    <script>
                      $(document).on('click', '.remove_department', function () {
                        //e.stopPropagation();
                       //alert($('.is_deleted').val());
                        $('.is_deleted').val('1');
                        //$(this).parent().hide();
                      })
                    </script>
                  </div>
                  <input id="dealership_departments_attributes_0_id" name="dealership[departments_attributes][0][id]" type="hidden" value="7"><div class="fields">
                    <div class="fields" id="department_fields">
                      <div class="form-group string required dealership_departments_title"><label class="string required control-label" for="dealership_departments_attributes_1_title"><abbr title="required">*</abbr> Title</label><input class="string required form-control" id="dealership_departments_attributes_1_title" name="dealership[departments_attributes][1][title]" type="text" value="Check In"></div>
                      <input class="is_deleted" id="is_deleted" name="dealership[departments_attributes][1][is_deleted]" type="text">
                      <div class="remove_department">remove</div>
                    </div>
                    <script>
                      $(document).on('click', '.remove_department', function () {
                        //e.stopPropagation();
                       //alert($('.is_deleted').val());
                        $('.is_deleted').val('1');
                        //$(this).parent().hide();
                      })
                    </script>
                  </div>

What I want to is set value of is_deleted to true on clicking "remove" related to that field

Trip · Accepted Answer · 2014-05-28 16:48:20Z

2

This :

:javascript
  $(document).on('click', '.remove_department', function () {
    // change this - > $('.is_deleted').val('1'); to ->
   $(this).siblings('.is_deleted').val('1');
  })

answered May 28, 2014 at 16:48

Trip

27.2k48 gold badges164 silver badges282 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

MrYoshiji Over a year ago

Your answer is exactly what @G.B needs, +1 and I remove my answer

Abdul Baig · Accepted Answer · 2014-05-28 18:16:58Z

0

I just solved it my self.

  $('.remove_department').on('click', function(event) {
    $(this).prev().val('1');
  })

answered May 28, 2014 at 18:16

Abdul Baig

3,7413 gold badges23 silver badges48 bronze badges

1 Comment

Trip Over a year ago

This works, but it more strictly depends on the presence of your html being exactly where it is. To each his own, but I like a little flexibility. In any case, good job!

Collectives™ on Stack Overflow

onclick setting value for input in nested forms

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related