My Blog List


Wednesday, November 22, 2023

How to customized Koha Patrons Membership Forms

 How to customized Koha Patrons Membership Forms 

The provided JavaScript code serves a range of functionalities within a Koha membership form, enhancing user experience and optimizing data entry. It includes features such as hiding alternate address and contact form elements to streamline the form's appearance. Additionally, the code sets default values for state and country fields, simplifying the submission process in koha.

Home > Administration > System preferences > IntranetUserJS 

// Hiding Alternate Address & Alternate Contact // 

document.addEventListener("DOMContentLoaded", function() {
    // Find the fieldsets with the classes "rows" and "memberentry_address"
    const addressFieldset = document.querySelector("#memberentry_address");
    const altAddressFieldset = document.querySelector("#memberentry_altaddress");

    // Find an array of label IDs and corresponding input IDs to hide
    const elementsToHide = [
        { labelId: "firstname", inputId: "firstname" },
        { labelId: "othernames", inputId: "othernames" },
        { labelId: "phonepro", inputId: "phonepro" },
        { labelId: "emailpro", inputId: "emailpro" },
        { labelId: "fax", inputId: "fax" },
        { labelId: "opacnote", inputId: "opacnote" }, // New element to hide
        { labelId: "borrowernotes", inputId: "borrowernotes" }, // New element to hide
        // Add more elements if needed
    ];

    // Hide the fieldsets and elements by setting their display property to "none"
    if (addressFieldset) {
        addressFieldset.style.display = "none";
    }
    if (altAddressFieldset) {
        altAddressFieldset.style.display = "none";
    }

    elementsToHide.forEach(element => {
        const label = document.querySelector(`label[for='${element.labelId}']`);
        const input = document.querySelector(`#${element.inputId}`);
        const hint = document.querySelector(`#${element.inputId} + .hint`); // Get associated hint element
        
        if (label) {
            label.style.display = "none";
        }
        if (input) {
            input.style.display = "none";
        }
        if (hint) {
            hint.style.display = "none"; // Hide associated hint
        }
    });
});

// Setting Default Values for State and Country // 

document.addEventListener('DOMContentLoaded', function() {
  // Get the state and country elements in the form
  var stateElement = document.getElementById('state'); // Replace 'state_field_id' with the actual ID of the state field
  var countryElement = document.getElementById('country'); // Replace 'country_field_id' with the actual ID of the country field
  
  // Set the default values for state and country
  stateElement.value = 'Odisha';
  countryElement.value = 'India';
});

// Copy Cardnumber as Username & "TS@123#" as Default Password //

$(document).ready(function () {
  if ($('#pat_memberentrygen').length > 0) {
    // Copy card number to userid
    $("#cardnumber").on("input", function () {
      var cardNum = this.value;
      $("#userid").val(cardNum);

      // Set password as "TS@123#"
      $("#password").val("TS@123#");

      // Set password2 as "TS@123#"
      $("#password2").val("TS@123#");
    });
  }
});

No comments:

Post a Comment