Ken Johnson
1316e75171
Update modal content to Bootstrap 5 styling and API: - Replace Bootstrap 2 modal-header structure with Bootstrap 5 - Update close button from 'close' class to 'btn-close' - Replace 'data-dismiss' with 'data-bs-dismiss' - Modernize form classes: control-group → mb-3, span12 → form-control - Update form labels to use 'form-label' class - Add 'form-select' class to select dropdown - Update JavaScript to use Bootstrap 5 Modal.getInstance() API - Add preventDefault() to button click handlers The modal now properly loads and displays in Bootstrap 5 with modern form styling and correct modal dismissal behavior. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
95 lines
3.0 KiB
Plaintext
Executable File
95 lines
3.0 KiB
Plaintext
Executable File
<!-- Begin Modal -->
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="myModalLabel1">
|
|
Account Settings
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<%= form_for @user, :html => {:id => "account_edit"} do |f| %>
|
|
<div class="mb-3">
|
|
<%= f.label :email, nil, {:class => "form-label"}%>
|
|
<%= f.text_field :email, {:class => "form-control"}%>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<%= f.label :first_name, nil, {:class => "form-label"}%>
|
|
<%= f.text_field :first_name, {:class => "form-control"} %>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<%= f.label :last_name, nil, {:class => "form-label"}%>
|
|
<%= f.text_field :last_name, {:class => "form-control"} %>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<%= f.label :password, nil, {:class => "form-label"}%>
|
|
<%= f.password_field :password, {:class => "form-control", :placeholder => "Enter Password"}%>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<%= f.label :password_confirmation, nil, {:class => "form-label"}%>
|
|
<%= f.password_field :password_confirmation, {:class => "form-control", :placeholder => "Enter Password"} %>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<%= f.label :admin, nil, {:class => "form-label"}%>
|
|
<%= f.select(:admin, @admin_select, {}, {:class => "form-select"}) %>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<%= link_to "Delete", "#", {:id => "delete_button", :class => "btn btn-danger"} %>
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
|
<%= f.submit "Submit", {:id => 'submit_button', :class => "btn btn-primary"} %>
|
|
</div>
|
|
<% end %>
|
|
<!-- End Modal -->
|
|
|
|
<%= javascript_include_tag ('validation.js')%>
|
|
|
|
<script type="text/javascript">
|
|
|
|
$('#submit_button').click(function(e) {
|
|
e.preventDefault();
|
|
var valuesToSubmit = $("#account_edit").serialize();
|
|
var modalElement = document.getElementById('editAcct');
|
|
var modal = bootstrap.Modal.getInstance(modalElement);
|
|
modal.hide();
|
|
|
|
$.ajax({
|
|
url: "/admin/" + <%= @user.id %> + "/update_user.json",
|
|
data: valuesToSubmit,
|
|
type: "POST",
|
|
success: function(response) {
|
|
$('#success').show(500).delay(1500).fadeOut();
|
|
loadTable();
|
|
},
|
|
error: function(event) {
|
|
$('#failure').show(500).delay(1500).fadeOut();
|
|
}
|
|
});
|
|
|
|
});
|
|
|
|
$('#delete_button').click(function(e) {
|
|
e.preventDefault();
|
|
var modalElement = document.getElementById('editAcct');
|
|
var modal = bootstrap.Modal.getInstance(modalElement);
|
|
modal.hide();
|
|
|
|
$.ajax({
|
|
url: "/admin/" + <%= params[:admin_id] %> + "/delete_user.json",
|
|
type: "POST",
|
|
success: function(response) {
|
|
$('#success').show(500).delay(1500).fadeOut();
|
|
loadTable();
|
|
},
|
|
error: function(event) {
|
|
$('#failure').show(500).delay(1500).fadeOut();
|
|
}
|
|
});
|
|
|
|
});
|
|
|
|
</script>
|