Prevent Multiline text box from clearing

Forms SharePoint Online
1

Hi Plumsail,

I have a checkbox which runs a function that shows, hides and clears a multiline text box field. When I click the checkbox, it always clears the field which contains text.

Is there a way to warn users and make them confirm a browser dialog before it hides and clears the multiline text box field?

I'm aware of the "Confirm()" method but I don't know how to prevent hiding and clearing a multiline text field.

function ShowHideSVHealthierLivesMLTF2(){
    
    if (FD_SVCheckboxes.value.indexOf("Healthy lives")>=0){
        //hide field
        $(FD_SV_HealthierLivesMLTF.$parent.$el).show();
    } else{
        $(FD_SV_HealthierLivesMLTF.$parent.$el).hide();
        FD_SV_HealthierLivesMLTF.clear();
    }
}

Thank you for your help!

2

Hi @Qman,

Could something like this work for you?

function ShowHideSVHealthierLivesMLTF2(){
    if (FD_SVCheckboxes.value.indexOf("Healthy lives")>=0){
        $(FD_SV_HealthierLivesMLTF.$parent.$el).show();
    } else{
        let clearAndHide = true;
        if (FD_SV_HealthierLivesMLTF.value) clearAndHide = window.confirm('Clear and hide field?'); // only prompt the user if there's something to clear
        
        if (clearAndHide) { // only clear the value if the user chose to
            $(FD_SV_HealthierLivesMLTF.$parent.$el).hide();
            FD_SV_HealthierLivesMLTF.clear();
        }
    }
}
3

Hi illia,

Your code has worked but I've noticed that if I click "Cancel" from the browser pop-up the option I selected in the checkbox is deselected.

How do I ensure it's not deselected?

4

@Qman,

The code clears the checkbox only when user clicks OK.
Please share the code you are using.

6

@Qman,

Please share the code you are using so I could test it.

7

This is the code snipper I'm using:

function ShowHideSVHealthierLivesMLTF2(){
    if (FD_SVCheckboxes.value.indexOf("Work with partners to help people live longer, healthier lives.")>=0){
        $(FD_SV_HealthierLivesMLTF.$parent.$el).show();
    } else{
        let clearAndHide = true;
        if (FD_SV_HealthierLivesMLTF.value) clearAndHide = window.confirm('Clear and hide field?'); // only prompt the user if there's something to clear
        
        if (clearAndHide) { // only clear the value if the user chose to
            $(FD_SV_HealthierLivesMLTF.$parent.$el).hide();
            FD_SV_HealthierLivesMLTF.clear();
        }
    }
}

//Calling ShowHideSVHealthierLivesMLTF function
FD_SVCheckboxes.$on('change',ShowHideSVHealthierLivesMLTF2);

FD_SVChecboxes is a choice field with multiple options enabled.
FD_SV_HealthierLivesMLTF is a Multiline Plain Text field.

8

@Qman,

Thank you!

You need to update the code like so:

let previousValue = FD_SVCheckboxes.value
let clearAndHide;

function ShowHideSVHealthierLivesMLTF2(){
    if (FD_SVCheckboxes.value.indexOf("Option 1")>=0){
        FD_SV_HealthierLivesMLTF.hidden = false;
        previousValue = FD_SVCheckboxes.value;
        console.log(previousValue)
    }
    
    if(previousValue.indexOf("Work with partners to help people live longer, healthier lives.")>=0 && FD_SVCheckboxes.value.indexOf("Option 1")<0) {
        //let clearAndHide = true;
            
            //clearAndHide = confirm('Clear and hide field?'); // only prompt the user if there's something to clear
        
        if (confirm('Clear and hide field?')) { // only clear the value if the user chose to
            FD_SV_HealthierLivesMLTF.hidden = true;
            FD_SV_HealthierLivesMLTF.clear();
            previousValue = FD_SVCheckboxes.value;
        }
        else {
            setTimeout(() => {FD_SVCheckboxes.value = previousValue}, 10)
        }
        }
}

//Calling ShowHideSVHealthierLivesMLTF function
FD_SVCheckboxes.$on('change',ShowHideSVHealthierLivesMLTF2);