94 lines
2.5 KiB
Plaintext
94 lines
2.5 KiB
Plaintext
|
<%= form_with(model: vendor, local: true) do |form| %>
|
||
|
|
<% if vendor.errors.any? %>
|
||
|
|
<div id="error_explanation">
|
||
|
|
<h2><%= pluralize(vendor.errors.count, "error") %> prohibited this vendor from being saved:</h2>
|
||
|
|
|
||
|
|
<ul>
|
||
|
|
<% vendor.errors.full_messages.each do |message| %>
|
||
|
|
<li><%= message %></li>
|
||
|
|
<% end %>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :name %>
|
||
|
|
<%= form.text_field :name %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :address %>
|
||
|
|
<%= form.text_area :address, rows: 1, class: 'auto-expand' %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :phone %>
|
||
|
|
<%= form.telephone_field :phone, id: 'phone-field' %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :email %>
|
||
|
|
<%= form.email_field :email, id: 'email-field', required: true %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :dba, 'DBA' %>
|
||
|
|
<%= form.text_field :dba %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :tin, 'TIN' %>
|
||
|
|
<%= form.text_field :tin, maxlength: 9 %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="field">
|
||
|
|
<%= form.label :contact %>
|
||
|
|
<%= form.text_field :contact %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="actions">
|
||
|
|
<%= form.submit %>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
|
||
|
|
|
||
|
|
<%# This is to correct phone number entry %>
|
||
|
|
<script>
|
||
|
|
document.addEventListener("DOMContentLoaded", function() {
|
||
|
|
const phoneField = document.getElementById('phone-field');
|
||
|
|
|
||
|
|
phoneField.addEventListener('input', function() {
|
||
|
|
let input = phoneField.value.replace(/\D/g, ''); // Remove non-numeric characters
|
||
|
|
const inputLength = input.length;
|
||
|
|
|
||
|
|
if (inputLength > 3 && inputLength <= 6) {
|
||
|
|
input = `(${input.slice(0, 3)}) ${input.slice(3)}`;
|
||
|
|
} else if (inputLength > 6) {
|
||
|
|
input = `(${input.slice(0, 3)}) ${input.slice(3, 6)}-${input.slice(6, 10)}`;
|
||
|
|
}
|
||
|
|
|
||
|
|
phoneField.value = input;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<%# This is for auto resizing the address field %>
|
||
|
|
<script>
|
||
|
|
document.addEventListener("DOMContentLoaded", function() {
|
||
|
|
const textareas = document.querySelectorAll('.auto-expand');
|
||
|
|
|
||
|
|
const resizeTextarea = function(el) {
|
||
|
|
el.style.height = 'auto';
|
||
|
|
el.style.height = (el.scrollHeight) + 'px';
|
||
|
|
}
|
||
|
|
|
||
|
|
textareas.forEach(textarea => {
|
||
|
|
textarea.addEventListener('input', function() {
|
||
|
|
resizeTextarea(textarea);
|
||
|
|
});
|
||
|
|
|
||
|
|
// Initial resize
|
||
|
|
resizeTextarea(textarea);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|