[英]nested form fields are not deleting when i click on remove link, but the updating the fields and adding new fields is working(in ruby on rails)
i am having the models Approval
, Approver
. 我有模型Approval
, Approver
。 and the association between them is Approval
has many Approvers
. 他们之间的关联是Approval
有许多Approvers
。 here i am using the nested form. 在这里,我正在使用嵌套表格。 to create an Approval Process
along with their Approvers
. 创建一个Approval Process
与他们一起Approvers
。 here when i Add new Approvers in edit form its working Fine. 在这里,当我以编辑形式添加新的审批者时,其工作正常。 and when i change the existing values its changing properly in edit form. 当我更改现有值时,它会以编辑形式正确更改。 but when i delete these nested fields by clicking remove link the fields are getting dissappered. 但是,当我通过单击“删除”链接删除这些嵌套字段时,这些字段将消失。 upto here fine. 到这里为止。 after removing the fields when i click update, the fields are not getting deleted. 当我单击更新删除字段后,字段不会被删除。
<%= nested_form_for(@approval , html: {:class => 'form-inline'}) do |f| %>
<div class="col-md-7">
<div class="field">
<%= f.label :name, "Assign a name to this approval process." %></br>
<%= f.text_field :name,:class => 'form-control' %></br></br>
</div>
<div class="field">
<%= f.label :for, "This approval process will be be applicable to which claim form?" %>
<%=f.select :for, ["Regularize Attendance", "Leave Request", "Daily Expense Claim ", "Travel Expense Claim"], {:prompt=>"Select One"}, {:class => 'form-control' } %></br></br>
</div>
<div class="field">
<%= f.label :sequential, "Does this process involve sequential or non-sequential approvals?" %>
<%=f.select :sequential, ["Sequential", "Non-Sequential"], {:prompt=>"Select One"}, {:class => 'form-control' } %>
<br><br>
</div>
<%= f.fields_for :approvers do |approver| %>
<div class="field">
<%= approver.label :approver_type,"Approver" %>
<%= approver.select :approver_type, ["Role", "Specific User"], {}, {:class => 'form-control role_select', :onchange => "$.fn.myFunc(this);" } %></br></br>
</div>
<div class="field">
<%= approver.label :approver_value,"Role" %>
<%= approver.select :approver_value, [ "HR Manager", "Reporting Manager"], {}, {:class => 'form-control appr_select' } %>
<%= approver.text_field :approver_value, style: 'display:none',:class => 'form-control inpt_specific_user',:disabled => "true" %>
<%= approver.link_to_remove "Remove", :class=>"" %> </br></br>
</div>
<% end %>
<%= f.link_to_add "Add Approvers", :approvers,:class=>"" %></br>
</div>
<div class="col-md-7">
</br>
<%= f.submit "Save", :class=>"btn btn-primary" %>
</div>
<br>
<% end %>
here by default approver_type
field will show as role and accordingly iam showing the approver_value
field as dropdown(by hiding the approver_value
textbox). 默认情况下,此处的approver_type
字段将显示为角色,并且相应地,iam将approver_value
字段显示为下拉列表(通过隐藏approver_value
文本框)。 and when the user changes approver_type
to specific user then iam showing the approver_value
field as textbox to enter the specific person name(by hiding the approver_value
field dropdown).for this, this is the javascript i wrote: 当用户将approver_type
更改为特定用户时,iam将approver_value
字段显示为文本框,以输入特定的人名(通过隐藏approver_value
字段下拉列表)。为此,这是我编写的javascript:
$.fn.myFunc = function (button) {
alert("in actual");
var $nextDiv = $(button).closest('div.field') // get closest parent field
.next('div.field') // get next parent field
$nextDiv.find('label') // find label
.text(button.value);
if(button.value == 'Role'){
$nextDiv.find('select').show();
$nextDiv.find('select').removeAttr( "disabled" )
$nextDiv.find('input').hide();
$nextDiv.find('input').attr("disabled", "disabled");
}
if (button.value =="Specific User"){
$nextDiv.find('input').show();
$nextDiv.find('input').removeAttr( "disabled" )
$nextDiv.find('select').hide();
$nextDiv.find('select').attr("disabled", "disabled");
}
}
$( document ).ready(function() {
$("select.role_select").each(function(){
var $this = $(this);
var $nextDiv = $this.closest('div.field') // get closest parent field
.next('div.field') // get next parent field
alert("YYYYYYYYYYYYYYYYYYYYYYYY");
alert($this);
alert($this.val());
if($this.val() == 'Role'){
$nextDiv.find('select').show();
$nextDiv.find('select').removeAttr( "disabled" )
$nextDiv.find('input').hide();
$nextDiv.find('input').attr("disabled", "disabled");
}
if ($this.val() =="Specific User"){
$nextDiv.find('input').show();
$nextDiv.find('input').removeAttr( "disabled" )
$nextDiv.find('select').hide();
$nextDiv.find('select').attr("disabled", "disabled");
}
});
});
and when when i delete the fields which is having Approver_type
dropdown value as "specific user"
then the deletion is working fine. 当我删除具有Approver_type
下拉值的字段作为"specific user"
,删除工作正常。
this is the output in terminal: 这是终端中的输出:
Started PATCH "/approvals/fYtVHpl_3zqTskQtnmedWw%253D%253D" for 127.0.0.1 at 2015-09-02 12:24:09 +0530
Processing by ApprovalsController#update as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"/lQfQRUhE8jmhSitAMkDx+bWMKLZilP29PQXGI82YaY=", "approval"=>{"name"=>"attendance", "for"=>"Regularize Attendance", "sequential"=>"Non-Sequential", "approvers_attributes"=>{"0"=>{"approver_type"=>"Role", "approver_value"=>"Reporting Manager", "id"=>"13"}, "1"=>{"approver_type"=>"Specific User", "approver_value"=>"john", "_destroy"=>"1", "id"=>"14"}}}, "commit"=>"Save", "id"=>"fYtVHpl_3zqTskQtnmedWw%3D%3D"}
but when i delete the fields which is having Approver_type
dropdown value as "role"
then it is not deleting. 但是,当我删除具有Approver_type
下拉值作为"role"
的字段时,则不会删除。
Started PATCH "/approvals/fYtVHpl_3zqTskQtnmedWw%253D%253D" for 127.0.0.1 at 2015-09-02 12:32:15 +0530
Processing by ApprovalsController#update as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"/lQfQRUhE8jmhSitAMkDx+bWMKLZilP29PQXGI82YaY=", "approval"=>{"name"=>"attendance", "for"=>"Regularize Attendance", "sequential"=>"Non-Sequential", "approvers_attributes"=>{"0"=>{"approver_type"=>"Role", "approver_value"=>"Reporting Manager", "id"=>"13"}}}, "commit"=>"Save", "id"=>"fYtVHpl_3zqTskQtnmedWw%3D%3D"}
the destroy parameter is not sending in parameters when i delete the Approver dropdown fields which having the value as role. 当我删除以值作为角色的批准者下拉字段时,destroy参数未发送参数。
but in controller i whitelisted the params also. 但在控制器中,我也将这些参数列入了白名单。
def approval_params
# params.require(:approval).permit(:company_id, :name, :for, :sequential)
params.require(:approval).permit!
end
and the nested form is generating the following markup in edit form: 嵌套表单正在编辑表单中生成以下标记:
<form accept-charset="UTF-8" action="/approvals/fYtVHpl_3zqTskQtnmedWw%253D%253D" class="form-inline" id="edit_approval_4" method="post"><div style="display:none"><input name="utf8" type="hidden" value="✓" /><input name="_method" type="hidden" value="patch" /><input name="authenticity_token" type="hidden" value="/lQfQRUhE8jmhSitAMkDx+bWMKLZilP29PQXGI82YaY=" /></div>
<div class="col-md-7">
<div class="field">
<label for="approval_name">Assign a name to this approval process.</label></br>
<input class="form-control" id="approval_name" name="approval[name]" type="text" value="attendance" /></br></br>
</div>
<div class="field">
<label for="approval_for">This approval process will be be applicable to which claim form?</label>
<select class="form-control" id="approval_for" name="approval[for]"><option selected="selected" value="Regularize Attendance">Regularize Attendance</option>
<option value="Leave Request">Leave Request</option>
<option value="Daily Expense Claim ">Daily Expense Claim </option>
<option value="Travel Expense Claim">Travel Expense Claim</option></select></br></br>
</div>
<div class="field">
<label for="approval_sequential">Does this process involve sequential or non-sequential approvals?</label>
<select class="form-control" id="approval_sequential" name="approval[sequential]"><option value="Sequential">Sequential</option>
<option selected="selected" value="Non-Sequential">Non-Sequential</option></select>
<br><br>
</div>
<div class="fields">
<div class="field">
<label for="approval_approvers_attributes_0_approver_type">Approver</label>
<select class="form-control role_select" id="approval_approvers_attributes_0_approver_type" name="approval[approvers_attributes][0][approver_type]" onchange="$.fn.myFunc(this);"><option selected="selected" value="Role">Role</option>
<option value="Specific User">Specific User</option></select></br></br>
</div>
<div class="field">
<label for="approval_approvers_attributes_0_approver_value">Role</label>
<select class="form-control appr_select" id="approval_approvers_attributes_0_approver_value" name="approval[approvers_attributes][0][approver_value]"><option value="HR Manager">HR Manager</option>
<option selected="selected" value="Reporting Manager">Reporting Manager</option></select>
<input class="form-control inpt_specific_user" disabled="disabled" id="approval_approvers_attributes_0_approver_value" name="approval[approvers_attributes][0][approver_value]" style="display:none" type="text" value="Reporting Manager" />
<input id="approval_approvers_attributes_0__destroy" name="approval[approvers_attributes][0][_destroy]" type="hidden" value="false" /><a class=" remove_nested_fields" data-association="approvers" href="javascript:void(0)">Remove</a> </br></br>
</div>
<input id="approval_approvers_attributes_0_id" name="approval[approvers_attributes][0][id]" type="hidden" value="13" /></div><div class="fields">
<div class="field">
<label for="approval_approvers_attributes_1_approver_type">Approver</label>
<select class="form-control role_select" id="approval_approvers_attributes_1_approver_type" name="approval[approvers_attributes][1][approver_type]" onchange="$.fn.myFunc(this);"><option value="Role">Role</option>
<option selected="selected" value="Specific User">Specific User</option></select></br></br>
</div>
<div class="field">
<label for="approval_approvers_attributes_1_approver_value">Role</label>
<select class="form-control appr_select" id="approval_approvers_attributes_1_approver_value" name="approval[approvers_attributes][1][approver_value]"><option value="HR Manager">HR Manager</option>
<option value="Reporting Manager">Reporting Manager</option></select>
<input class="form-control inpt_specific_user" disabled="disabled" id="approval_approvers_attributes_1_approver_value" name="approval[approvers_attributes][1][approver_value]" style="display:none" type="text" value="john" />
<input id="approval_approvers_attributes_1__destroy" name="approval[approvers_attributes][1][_destroy]" type="hidden" value="false" /><a class=" remove_nested_fields" data-association="approvers" href="javascript:void(0)">Remove</a> </br></br>
</div>
<input id="approval_approvers_attributes_1_id" name="approval[approvers_attributes][1][id]" type="hidden" value="14" /></div> <a class=" add_nested_fields" data-association="approvers" data-blueprint-id="approvers_fields_blueprint" href="javascript:void(0)">Add Approvers</a></br>
</div>
<div class="col-md-7">
</br>
<input class="btn btn-primary" name="commit" type="submit" value="Save" />
</div>
<br>
<div data-blueprint="<div class="fields">
<div class="field">
<label for="approval_approvers_attributes_new_approvers_approver_type">Approver</label>
<select class="form-control role_select" id="approval_approvers_attributes_new_approvers_approver_type" name="approval[approvers_attributes][new_approvers][approver_type]" onchange="$.fn.myFunc(this);"><option value="Role">Role</option>
<option value="Specific User">Specific User</option></select></br></br>
</div>
<div class="field">
<label for="approval_approvers_attributes_new_approvers_approver_value">Role</label>
<select class="form-control appr_select" id="approval_approvers_attributes_new_approvers_approver_value" name="approval[approvers_attributes][new_approvers][approver_value]"><option value="HR Manager"quot;>HR Manager</option>
<option value="Reporting Manager">Reporting Manager</option></select>
<input class="form-control inpt_specific_user" disabled="disabled" id="approval_approvers_attributes_new_approvers_approver_value" name="approval[approvers_attributes][new_approvers][approver_value]" style="display:none" type="text" />
<input id="approval_approvers_attributes_new_approvers__destroy" name="approval[approvers_attributes][new_approvers][_destroy]" type="hidden" value="false" /><a class=" remove_nested_fields" data-association="approvers" href="javascript:void(0)">Remove</a> </br></br>
</div>
</div>" id="approvers_fields_blueprint" style="display: none"></div></form>
Try this 尝试这个
def approval_params
params.require(:approval).permit(:company_id, :name, :for, :sequential, approvers_attributes: [:id, :approver_type, :approver_value, :_destroy])
end
Hopefully it will work. 希望它会起作用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.