Koha-community/Koha
15
7
Fork 0
Code Issues Releases Wiki Activity

Bug 34831: Add input types "tel", "email" and "url" to vendor edit form

Browse source 
This patch updates the vendor edit form so that phone, email, and url
fields have an input type corresponding to the field's content.

To test, apply the patch and go to Acquisitions.

- Create or edit a vendor.
- In the form, check that each field looks correct:
  - Company details ->
    - Phone
    - Fax
    - Website
  - Contact details
    - Phone
    - Alternative phone
    - Fax
    - Email
  - Interfaces
    - URI
    - Account email

In a desktop browser the inputs won't display any differently, but if
you test the patch in a sandbox you can try it in a mobile device
browser to confirm that the onscreen keyboard changes based on the type
of input.

Signed-off-by: Émily-Rose Francoeur <emily-rose.francoeur@inLibro.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This commit is contained in:
Owen Leonard 2023-09-19 12:10:48 +00:00 committed by Tomas Cohen Arazi
parent 0566556cb0
commit 474d6c7462
Signed by: tomascohen
GPG key ID: 0A272EA1B2F3C15F
1 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
koha-tmpl/intranet-tmpl/prog/en/modules/acqui/supplier.tt
View file

@ -12,13 +12,13 @@
<li><label for="contact_position[% contact.id | html %]">Position: </label>
<input type="text" size="40" id="contact_position[% contact.id | html %]" name="contact_position" value="[% contact.position | html %]" /></li>
<li><label for="contact_phone[% contact.id | html %]">Phone: </label>
<input type="text" size="20" id="contact_phone[% contact.id | html %]" name="contact_phone" value="[% contact.phone | html %]" /> </li>
<input type="tel" size="20" id="contact_phone[% contact.id | html %]" name="contact_phone" value="[% contact.phone | html %]" /> </li>
<li><label for="contact_altphone[% contact.id | html %]">Alternative phone: </label>
<input type="text" size="20" id="contact_altphone[% contact.id | html %]" name="contact_altphone" value="[% contact.altphone | html %]" /></li>
<input type="tel" size="20" id="contact_altphone[% contact.id | html %]" name="contact_altphone" value="[% contact.altphone | html %]" /></li>
<li><label for="contact_fax[% contact.id | html %]">Fax: </label>
<input type="text" size="20" id="contact_fax[% contact.id | html %]" name="contact_fax" value="[% contact.fax | html %]" /></li>
<input type="tel" size="20" id="contact_fax[% contact.id | html %]" name="contact_fax" value="[% contact.fax | html %]" /></li>
<li><label for="contact_email[% contact.id | html %]">Email: </label>
<input type="text" size="40" id="contact_email[% contact.id | html %]" name="contact_email" value="[% contact.email | html %]" class="email" /></li>
<input type="email" size="40" id="contact_email[% contact.id | html %]" name="contact_email" value="[% contact.email | html %]" class="email" /></li>
<li><label for="contact_notes[% contact.id | html %]">Notes: </label>
<textarea id="contact_notes[% contact.id | html %]" name="contact_notes" cols="40" rows="4">[% contact.notes | html %]</textarea></li>
</ol>
@ -221,11 +221,11 @@ div.rows { padding: 1rem; }
<li><label for="physical">Physical address: </label>
<textarea id="physical" name="physical" cols="40" rows="3">[% address1 | html %][% address2 | html %][% address3 | html %][% address4 | html %]</textarea></li>
<li><label for="company_phone">Phone: </label>
<input type="text" size="20" id="company_phone" name="company_phone" value="[% phone | html %]" /></li>
<input type="tel" size="20" id="company_phone" name="company_phone" value="[% phone | html %]" /></li>
<li><label for="company_fax">Fax: </label>
<input type="text" size="20" id="company_fax" name="company_fax" value="[% fax | html %]" /></li>
<input type="tel" size="20" id="company_fax" name="company_fax" value="[% fax | html %]" /></li>
<li><label for="website">Website: </label>
<input type="text" size="40" id="website" name="website" value="[% url | html %]" class="url" /></li>
<input type="url" size="40" id="website" name="website" value="[% url | html %]" class="url" /></li>
<li><label for="accountnumber">Account number: </label>
<input type="text" size="40" id="accountnumber" name="accountnumber" value="[% accountnumber | html %]" /></li>
<li>
@ -644,19 +644,19 @@ div.rows { padding: 1rem; }
n.append(`<input type="hidden" name="interface_counter" value="${i}" />`);
let ol = $('<ol class="interface-form"></ol>');
let attributes = [
{ label: _("Name:"), name: 'name', node: 'input' },
{ label: _("Type:"), name: 'type', node: 'av_select', av_cat: 'VENDOR_INTERFACE_TYPE' },
{ label: _("URI:"), name: 'uri', node: 'input' },
{ label: _("Login:"), name: 'login', node: 'input' },
{ label: _("Password:"), name: 'password', node: 'input' },
{ label: _("Account email:"), name: 'account_email', node: 'input' },
{ label: _("Notes:"), name: 'notes', node: 'textarea' }
{ label: _("Name:"), name: 'name', type: 'text', node: 'input' },
{ label: _("Type:"), name: 'type', type: 'select', node: 'av_select', av_cat: 'VENDOR_INTERFACE_TYPE' },
{ label: _("URI:"), name: 'uri', type: 'url', node: 'input' },
{ label: _("Login:"), name: 'login', type: 'text', node: 'input' },
{ label: _("Password:"), name: 'password', type: 'text', node: 'input' },
{ label: _("Account email:"), name: 'account_email', type: 'email', node: 'input' },
{ label: _("Notes:"), name: 'notes', type: 'textarea', node: 'textarea' }
];
attributes.forEach((attribute, ii) => {
let li = $('<li></li>');
li.append(`<label for="interface_${attribute.name}_${i}">${attribute.label}</label>`);
if( attribute.node == 'input' ) {
li.append(`<input type="text" size="40" id="interface_${attribute.name}_${i}" name="interface_${attribute.name}_${i}" value="${interface[attribute.name]}" />`);
li.append(`<input type="${attribute.type}" size="40" id="interface_${attribute.name}_${i}" name="interface_${attribute.name}_${i}" value="${interface[attribute.name]}" />`);
} else if ( attribute.node == 'textarea' ) {
li.append(`<textarea cols="40" rows="3" id="interface_${attribute.name}_${i}" name="interface_${attribute.name}_${i}">${interface[attribute.name]}</textarea>`);
} else if ( attribute.node == 'av_select' ) {