我有一个用户记录表,点击“编辑”按钮会弹出一个jquery对话框。对于每个记录编辑,应该使用该记录值填充对话框表单。 我已设法将这些记录值存储在jquery变量中,并使用它来填充表单。
输入[= text]元素工作正常,即输入值使用相应的记录值正确填充。但是当涉及下拉元素[使用select2]时,先前记录中的值将保留在下一个对话框中。
我尝试清除下拉元素,但结果与预期不符。
这是我试过的:
$('a.leave_request_edit').click(function(e)
{
e.preventDefault();
var empName = $(this).closest('tr').attr('data-empName');
var reason = $(this).closest('tr').attr('data-reason').trim();
var leaveFromFormatted = $(this).closest('tr').attr('data-leaveFromFormatted').trim();
var leaveToFormatted = $(this).closest('tr').attr('data-leaveToFormatted').trim();
var leaveTypeId = $(this).closest('tr').attr('data-leaveTypeId').trim();
var userLeaveStatus = $(this).closest('tr').attr('data-leaveStatus').trim();
var empID = $(this).closest('tr').attr('data-empID').trim();
var issuedDateOld = $(this).closest('tr').attr('data-issuedDate').trim();
$('#updateMainDialog').dialog
({
resizable: false,
draggable: false,
height: 220,
width: 400,
modal: true,
buttons: {
"Edit Request" : function()
{
$(this).dialog('close');
$('#leave_modal_edit').show();
$('#leave_description_edit').val(reason);
$('#leave_date_from_edit').val(leaveFromFormatted);
$('#leave_date_to_edit').val(leaveToFormatted);
$('#leave_type_edit option[value = '+leaveTypeId+']').attr('selected', 'selected').trigger('change');
$('#request-holder').hide();
$('#dialog').dialog(
{
resizable: false,
draggable: false,
height: 430,
width: 451,
modal: true,
title: 'Leave Request By' + empName,
buttons:{
"Update Request": function(){
var id = leave_id;
var teamSelectionEdit = $('#team_selection_edit').val();
var previousLeaveStatus = userLeaveStatus;
var leaveDescriptionEdit = $('#leave_description_edit').val();
var leaveTypeEdit = $('#leave_type_edit').val();
var leaveFromEdit = $('#leave_date_from_edit').val();
var leaveToEdit = $('#leave_date_to_edit').val();
var userID = empID;
var issued_date = $('#issued_date').val();
if($('#leave_modal_edit').valid())
{
$('#request-holder').show();
$.ajax({
url: "leave/request/edit",
data:
{
id: id,
user_id: empID,
leave_type: leaveTypeEdit,
leave_type_old: leaveTypeId,
issued_date: issued_date,
issued_date_old: issuedDateOld,
leave_from: leaveFromEdit,
leave_from_old: leaveFromFormatted,
leave_to: leaveToEdit,
leave_to_old: leaveToFormatted,
team_selection: teamSelectionEdit,
leave_description: leaveDescriptionEdit,
leave_description_old: reason,
leave_status: previousLeaveStatus,
employeeName: empName,
edit: true
},
type: 'POST',
cache: false,
success: function(data, resp)
{
$('#request-holder').hide();
console.log(data);
// return;
var json = data, obj = JSON && JSON.parse(json) || $.parseJSON(json);
if(obj.status == 'error')
{
alert('error');
return false;
}
$('#updateMainDialog').dialog('close');
location.reload(true);
},
error: function(data, resp)
{
console.log(data);
}
}); // ajax
}
},
"Cancel": function()
{
// $('#team_selection_edit').select2('val','');
// $('#leave_type_edit').select2('val','');
$(this).dialog('close');
}
}
});
},
// and rest of it...
以下是记录的显示方式,如果有帮助
<tr
id="<?php echo $leaveRecord['id']; ?>"
data-reason = "<?php echo $leaveRecord['leave_description'];?>"
data-leaveFromFormatted = "<?php echo Utility::dateFormatter($leaveRecord['leave_from']); ?>"
data-leaveToFormatted = "<?php echo Utility::dateFormatter($leaveRecord['leave_to']); ?>">
<td><?php echo $leaveRecord['leave_from']; ?></td>
<td><?php echo $leaveRecord['leave_to']; ?></td>
<td><?php echo $leaveRecord['leave_description']; ?></td>
<td><?php echo $username->status; ?></td>
<td>
<a href="#" class="btn btn-danger square-btn-adjust leave_request_delete" "><i class="fa fa-trash-o"></i></a>
<a href="#" class='btn btn-primary square-btn-adjust leave_request_edit'><i class="fa fa-pencil-square-o"></i></a>
</td>
</tr>
这是我的对话框:
<div id="dialog" style="display: none;">
<div class="col-md-12">
<form class="form-horizontal" method="post" role="form" id="leave_modal_edit">
<div class="col-md-12" id="request-holder">
<p>Processing request, please wait ...</p>
</div>
<div class="form-group">
<label for="teamselection" class="col-sm-4 control-label">Team :
</label>
<div class="col-sm-8">
<select name="team_selection" class="select2-container form-control" id="team_selection_edit">
<option></option>
<?php foreach ($Teams as $TeamNew):?>
<option value="<?php echo $TeamNew->id; ?>"><?php echo $TeamNew->title; ?></option>
<?php endforeach; ?>
</select>
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-4 control-label">Leave Range :</label>
<div class="col-sm-8">
<div class="input-group">
<div class="input-group-addon" style="padding-right: 7px; padding-left:5px">From
</div>
<input type="text" placeholder="Start Date" id = "leave_date_from_edit" class="form-control dateField required" name="leave_date_from" datatype="date">
</div>
<div class="input-group">
<div class="input-group-addon" style="padding-right: 20px">To
</div>
<input type="text" placeholder="End Date"
id="leave_date_to_edit" class="form-control dateField required" name="leave_date_to" datatype="date">
</div>
</div>
</div>
<div class="form-group">
<label for="leavetype" class="col-sm-4 control-label">Leave Type :</label>
<div class="col-sm-8">
<select name="leave_type" class="select2-container form-control" id="leave_type_edit">
<option></option>
<?php foreach ($LeaveTypes as $LeaveTypeNew):?>
<option value="<?php echo $LeaveTypeNew->id; ?>"><?php echo $LeaveTypeNew->title; ?></option>
<?php endforeach; ?>
</select>
</div>
</div>
<div class="form-group">
<label for="leave_description" class="col-sm-4 control-label">Reason :</label>
<div class="col-sm-8">
<textarea rows="4" cols="40" class="form-control required" id="leave_description_edit" placeholder="Reason for the leave"></textarea>
</div>
</div>
<input type="hidden" name="issued_date" value="<?php echo $currentDate; ?>" id="issued_date">
<input type="hidden" name="edit" value="true" id="edit">
</form>
</div>
我只需保留属于jquery中记录的那些值。 这一切都很漫长而无聊......但是请任何帮助表示赞赏..谢谢:)。