Hello,

I have an issue with javascript, I want to hide the Submit button which I have renamed as "Save"

The code works fine on the forms without the CSS, however due to pagination I have following CSS to show Save (Submit button) on all pages:

/* Show the Submit button on all pages */
.Submit {
  display: initial !important;
}

The following JS works fine when above CSS is disabled:

$(document).ready(function() {

//Call to function for hiding submit button when ReadOnly user log's on
    checkDisplayNameValue(); 
  
  
  // Get the active page
  $('.cf-pagination-tabs').click(function() {

    $('.active-page input').val($('.cf-pagination-tabs li.active').index());
  });

// Find the Read input fields, this is a hidden field where the value is DisplayName
    var fieldValue = $('#Field492').find('#Field492 input');
    console.log("DisplayName fields found: ", fieldValue.length);
  
  
  	//var fieldValue = $('.Read').val(); // Get the value of Field40
    var fieldValue = $('#Field492').val(); // Get the value of Field40
    toggleSubmitButton(fieldValue); // Call the function to show/hide the submit button based on the value
}


// Function to toggle the Submit button based on the field value
function toggleSubmitButton(fieldValue) {
    var $submit = $('.Submit'); // Find the submit button
    if (fieldValue === "ReadOnly") {
        $submit.hide();  // Hide the submit button if value is "ReadOnly"
        console.log("Submit button hidden because Field40 is ReadOnly.");
    } else {
        $submit.show();  // Show the submit button if value is anything else
        console.log("Submit button shown.");
    }
}

Please help as this is really stopping me from getting the solution working...

Many thanks in advance,

S