GabrielVa GabrielVa - 4 months ago 30
Javascript Question

Laravel Show Form Button on Textbox Value

Do any of you jquery/Laravel Pros know if it's possible to hide or show a submit button based on a textbox field value?

I have a Laravel (4.2) form that I'm working on and I want to hide the submit button until a textbox value reaches 0, then show the button so users can submit it.

I figured its a jquery script maybe, never done that before thus why I'm asking for help.

{{ HTML::col(3,3,3,3) }}
{{ Form::formGroup() }}
{{ Form::label('Remainder', 'Remainder Balance') }}
{{ Form::text('Remainder', $value , ['class' => 'form-control', 'data-fv-notempty' => 'false', 'readonly']) }}
{{ Form::closeFormGroup() }}
{{ HTML::closeCol() }}
{{ HTML::closeRow() }}


{{ HTML::row() }}
{{ HTML::col(12,12,12,12) }}
{{ Form::submit('Submit', array('class' => "btn btn-submit btn-lg")) }}
{{ HTML::closeCol() }}
{{ HTML::closeRow() }}
{{ Form::closeFormGroup() }}
{{ Form::close() }}


Thanks in advance everyone, I greatly appreciate it.

Answer

First you should give these things an id.

{{ Form::text('Remainder', $value , ['id' => 'remainder', 'class' => 'form-control', 'data-fv-notempty' => 'false', 'readonly']) }}

{{ Form::submit('Submit', array('id' => 'myFormSubmit', 'class' => "btn btn-submit btn-lg")) }}

$(document).ready(function() {
    $('#remainder').change(function() {
        if ($(this).val() == 0) {
            $('#myFormSubmit').show();
        } else {
            $('#myFormSubmit').hide();
        }
    });
});

If you are programatically changing the text box (your wording about it "reaching" 0 makes me suspect this might be the case), that change event won't fire so you will also need to do $('#remaidner').trigger('change');

Comments