Page 1 of 1

How to disable a lookup button on client side?

Posted: Mon Apr 08, 2024 7:12 am
by onoboa

Hi everybody,

I have a validation in a selection field Client side, when the user select an record from the list, in the form another field with lookup button must be disabled.
the text field is disbled but the lookup button have still working.

How can i do for disbled the lookup button

this is my code

$(document).ready(function(){

   $("#x_cita").change(function() {
		console.log("Entró en Valdación de Cita");
		if ($("#x_cita").val() > 0){
			console.log("make readonly or disabled");
			//$('#sv_x_institucion').prop('readonly', true);
			$('#sv_x_institucion').prop('disabled', true);			
		}else{
			console.log("make enabled");
			$('#sv_x_institucion').prop('readonly', false);
			$('#r_fecha').focus();
		}
    });	

});

The webpage code for the control is this:

    </tr>
    <tr id="r_institucion">
        <td class="w-col-2"><span id="elh_consulta_institucion">Unidad Médica<i data-phrase="FieldRequiredIndicator" class="fas fa-asterisk ew-required" data-caption=""></i></span></td>
        <td >
<span id="el_consulta_institucion">
<span id="as_x_institucion" class="ew-auto-suggest">
    <div class="input-group flex-nowrap">
        <input type="text" class="form-control" name="sv_x_institucion" id="sv_x_institucion" value="" size="30" maxlength="11" placeholder="Unidad Médica" data-placeholder="Unidad Médica" class="form-control" aria-describedby="x_institucion_help">
        <div class="input-group-append">
            <button type="button" title="Buscar - Unidad Médica" onclick="ew.modalLookupShow({lnk:this,el:'x_institucion',m:0,n:10,srch:false});" class="ew-lookup-btn btn btn-default"><i class="fas fa-search ew-icon"></i></button>
        </div>
    </div>
</span>
<input type="hidden" is="selection-list" class="form-control" data-table="consulta" data-field="x_institucion" data-input="sv_x_institucion" data-page="1" data-type="text" data-multiple="0" data-lookup="1" data-value-separator=", " name="x_institucion" id="x_institucion" value="">
<div class="invalid-feedback">Entero incorrecto - Unidad Médica<br>Por favor ingrese el campo requerido - Unidad Médica</div>
<script>
loadjs.ready(["fconsultaadd"], function() {
    fconsultaadd.createAutoSuggest(Object.assign({"id":"x_institucion","forceSelect":true}, ew.vars.tables.consulta.fields.institucion.autoSuggestOptions));
});
</script>
<input type="hidden" id="p_x_institucion" name="p_x_institucion" value="f=EB3P2Yz3DghzNJug0lgzs3ivk4c."></span>
</td>

Thanks,

Omar


Re: How to disabled a lookup button on client side

Posted: Mon Apr 08, 2024 9:24 am
by mobhar

You should use Client side events for such case.


Re: How to disabled a lookup button on client side

Posted: Mon Apr 08, 2024 10:29 am
by arbei

You should add "disabled" attribute to the <button> also.


Re: How to disable a lookup button on client side?

Posted: Mon Apr 08, 2024 10:21 pm
by onoboa

Thanks but, how can i do for add the disabled attribute in this line

<button type="button" title="Buscar - Unidad Médica" onclick="ew.modalLookupShow({lnk:this,el:'x_institucion',m:0,n:10,srch:false});" class="ew-lookup-btn btn btn-default"><i class="fas fa-search ew-icon"></i></button>

From phpmaker setup field institucion.


Re: How to disable a lookup button on client side?

Posted: Mon Apr 08, 2024 10:24 pm
by onoboa

This code in Field Setup -> Select Tag -> Client side Events works fine with the text box

{ // keys = event types, values = handler functions
    "change": function(e) {
        if (this.value != "") {
            $(this).fields("institucion").disabled(true); // true as disabled, false as normal
        } else {
            $(this).fields("institucion").disabled(false); // true as disabled, false as normal
        }
    }
}

But the button of the Modal Lookup dialog is still enabled.


Re: How to disable a lookup button on client side?

Posted: Tue Apr 09, 2024 12:44 am
by mobhar

To disable the button, you may use:

$(".ew-lookup-btn").prop('disabled', true);