我不知道该说些什么除了标题。在rails视图中,通过div循环呈现多个员工配置文件,并随同编辑按钮一起切换配置文件并编辑表单,填充所显示内容的输入字段值。但是在点击“保存”时,只会显示第一个实例,这些表单域将作为参数发送。当我点击其他配置文件上的“保存”时没有任何反应。尽管字段和表单正在为所有员工呈现。渲染个别多种形式提交按钮,但一审的唯一形式变量正在提交
<div class="container team-inner">
<%cleaners.each do |cleaner| %>
<div id="employee-div" class="row">
<div class="col-md-12 team-container">
<div class="row">
<div class="col-md-3 ">
<div class="img-container">
<%= image_tag('asset_emp2.png', class: '') %>
</div>
</div>
<div class="col-md-6 team-details">
<div class="toggle-field">
<div class="row grid">
<div class="col-md-6 left-grid">
<p>First Name:</p>
</div>
<div class="col-md-6 right-grid">
<p><%=cleaner["first_name"]%></p>
<input type="hidden" id="emp-id" value=<%=cleaner["id"]%>>
</div>
</div>
<div class="row grid">
<div class="col-md-6 left-grid">
<p>Last Name:</p>
</div>
<div class="col-md-6 right-grid">
<p><%=cleaner["last_name"]%></p>
</div>
</div>
<div class="row grid">
<div class="col-md-6 left-grid">
<p>Employee ID:</p>
</div>
<div class="col-md-6 right-grid">
<p><%=cleaner["employee_id"]%></p>
</div>
</div>
<div class="row grid">
<div class="col-md-6 left-grid">
<p>Date of Join:</p>
</div>
<div class="col-md-6 right-grid">
<p><%=cleaner["date_of_join"]%></p>
</div>
</div>
<div class="row grid">
<div class="col-md-6 left-grid">
<p>E-mail ID: </p>
</div>
<div class="col-md-6 right-grid">
<p><%=cleaner["email"]%></p>
</div>
</div>
<div class="row grid">
<div class="col-md-6 left-grid">
<p>Phone Number:</p>
</div>
<div class="col-md-6 right-grid">
<p><%=cleaner["phone_number"]%></p>
</div>
</div>
<!-- <div class="row grid">
<div class="col-md-6 left-grid">
<p>Number of jobs done:</p>
</div>
<div class="col-md-6 right-grid">
<p></p>
</div>
</div> -->
</div>
<form name="empEditForm" class="toggle-field" style="display: none;" >
<div class="form-group">
<label class="col-md-6">First Name:</label>
<div class="col-md-6">
<input type="text" name="emp-edit-first-name" id="emp-edit-first-name"
class="form-control" value=<%=cleaner["first_name"]%>>
<input type="hidden" id="emp-id" value=<%=cleaner["id"]%>>
</div>
</div>
<div class="form-group">
<label class="col-md-6">Last Name:</label>
<div class="col-md-6">
<input type="text" name="emp-edit-last-name" id="emp-edit-last-name" class="form-control" value=<%=cleaner["last_name"]%>>
</div>
</div>
<div class="form-group">
<label class="col-md-6">Employee ID:</label>
<div class="col-md-6">
<input type="text" name="emp-edit-employee-id" id="emp-edit-employee-id" class="form-control" value=<%=cleaner["employee_id"]%>>
</div>
</div>
<div class="form-group">
<label class="col-md-6">Date of Join:</label>
<div class="col-md-6">
<input type="text" name="emp-edit-date-of-join" id="emp-edit-date-of-join" class="form-control" value=<%=cleaner["date_of_join"]%>>
</div>
</div>
<div class="form-group">
<label class="col-md-6">Email ID: </label>
<div class="col-md-6">
<input type="text" name="emp-edit-email" id="emp-edit-first_name" class="form-control" value=<%=cleaner["email"]%>>
</div>
</div>
<div class="form-group">
<label class="col-md-6">Phone Number: </label>
<div class="col-md-6">
<input type="text" name="emp-edit-phone-number" id="emp-edit-phone-number" class="form-control" value=<%=cleaner["phone_number"]%>>
</div>
</div>
<!-- <div class="form-group">
<label class="col-md-6">Number of jobs done:</label>
<div class="col-md-6">
<input type="text" class="form-control" value="43">
</div>
</div> -->
</form>
<!-- <div class="row grid">
<div class="col-md-6 left-grid">
<p>Rating:</p>
</div>
<div class="col-md-6 right-grid">
<p>Rating: <span>4.8</span></p>
<p class="rating"><i class="glyphicon glyphicon-star rate"></i><i class="glyphicon glyphicon-star rate"></i><i class="glyphicon glyphicon-star rate"></i><i class="glyphicon glyphicon-star rate"></i><i class="glyphicon glyphicon-star"></i></p>
</div>
</div> -->
</div>
<div class="col-md-3 edit-link">
<a href="#" class="btn save toggle-field toggle-btn">Edit</a>
<a href="#" id="save-btn" style="display:none;" class="btn save toggle-field" >Save</a>
<a href="#" style="display:none;" class="btn cancel toggle-field toggle-btn">CANCEL</a>
</div>
</div>
</div>
</div>
<%end%>
这是我调用保存按钮的脚本。
$(document).ready(function(){
$("#save-btn").click(function(){
var token = localStorage.getItem("contractor_token").split(";");
var first_name = document.forms["empEditForm"]["emp-edit-first-name"].value;
var last_name = document.forms["empEditForm"]["emp-edit-last-name"].value;
var emp_id = document.forms["empEditForm"]["emp-edit-employee-id"].value;
var date_of_join = document.forms["empEditForm"]["emp-edit-date-of-join"].value;
var phone_number = document.forms["empEditForm"]["emp-edit-phone-number"].value;
var email = document.forms["empEditForm"]["emp-edit-email"].value
var id = document.forms["empEditForm"]["emp-id"].value
var jquery_selector = $('#emp-edit-email').val();
console.log("jquery_selector value shows undefined below");
console.log(jquery_selector);
data["id"] = id;
data["email"] = email;
data["first_name"] = first_name;
data["last_name"] = last_name;
data["phone_number"] = phone_number;
data["employee_id"] = emp_id;
data["date_of_join"] = date_of_join;
console.log(data);
$.ajax({url: base_url + api_version + "/contractors/contractor_edit_employee",
type: "POST",
headers:{"Content-Type":"application/json", "Authorization":"bearer "+token[0]},
data: JSON.stringify(data),
success: function(result){
//console.log(result);
location.reload();
}
});
});
});
更新:修正了这个问题设置name
场的形式,清洁ID本身的循环。
<form class="toggle-field" style="display: none;" name=<%=cleaner['id']%> >
然后我发送清理器ID作为功能参数点击保存按钮。
<a href="#" style="display:none;" class="btn save toggle-field" onclick="return contractorEditEmployee('<%=cleaner['id']%>');" >SAVE</a>
然后最后我能够通过访问带有清洁器id函数参数的表格名称来访问各个清洁器的细节。
function contractorEditEmployee(cleaner_id){
var first_name = document.forms[cleaner_id]["emp-edit-first-name"].value;
var last_name = document.forms[cleaner_id]["emp-edit-last-name"].value;
。 。 。
希望它可以帮助别人。感谢所有的帮助。
for的名称因为使用循环而重复。表单名称应该是唯一的,表单名称是'empEditForm'。 您可以使用唯一的编号创建唯一的名称,然后点击提交按钮获取表单的名称并使用它获取值 –
@PankajMakwana我认为这也是问题。你能链接我的任何来源? – Chet
更改名称的格式如下: '