CODEWITHSUNDEEP
phpjqueryhtml
B.A
B.A

Reputation: 29

How do I disabled button submit on change form (input fields) php

I would like to disabled a button that will submit my form if the fields aren't changed.

So if a change a field, I would like to be able to submit the form by enabling the button, but only if a change a field (minimum).

<?php $listeToitures = $db->query("SELECT * FROM i10_toit where i10_toit.N_NUME_IMME = $choixImmeuble");
                $toiture = $listeToitures->fetch() ?>
                <br><br><button class="btn btn-primary" type="button" data-target="#toitures" data-toggle="collapse" aria-expanded="false" aria-controls="MonCollapse"><i class="glyphicon glyphicon-chevron-right"></i> Toitures</button>
                <div id="toitures" class="collapse">
                <h3 class="page-header">Toitures <button type="submit" name="enregistrerParkingAmenagement" class="btn btn-default">Enregistrer</button></h3>
                <button class="btn btn-primary" type="button" data-target="#parking" data-toggle="collapse" aria-expanded="false" aria-controls="MonCollapse"><i class="glyphicon glyphicon-chevron-right"></i> Parking</button>
                <div id="parking" class="collapse">
                    <div class="col-xl-6 col-lg-6 col-sm-6 col-xs-6">
                        <div class="form-group">
                            <label for="toiture_c_etat_ferb">Etat ferblanterie :</label><br>
                            <select name="toiture_c_etat_ferb" id="toiture_c_etat_ferb" class="form-control">
                                <?php 
                                $cherche = chercheViews('VZ1085');
                                foreach ($cherche as $resultat){  
                                    $code = $resultat['C_CODE_SEQU'];?>
                                    <option value="<?php echo $code ?>"<?php if($toiture['C_ETAT_FERB']==$code) echo 'selected="selected"'; ?>><?php echo $resultat['L_DESC_CODE']; ?></option> 
                                <?php }?>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="toiture_c_type_ferb">Type de ferblanterie :</label><br>
                            <select name="toiture_c_type_ferb" id="toiture_c_type_ferb" class="form-control">
                                <?php 
                                $cherche = chercheViews('VZ1143');
                                foreach ($cherche as $resultat){  
                                    $code = $resultat['C_CODE_SEQU'];?>
                                    <option value="<?php echo $code ?>"<?php if($toiture['C_TYPE_FERB']==$code) echo 'selected="selected"'; ?>><?php echo $resultat['L_DESC_CODE']; ?></option> 
                                <?php }?>
                            </select>
                            <br><br><br><br><br><br><br><br>
                        </div>
                    </div>
                    <label for="chaufferie_l_toit_comm">Commentaire :</label><br>
                    <textarea  name="chaufferie_l_toit_comm" class="form-control" id="chaufferie_l_faca_comm"><?php echo $toiture['L_TOIT_COMM'];?></textarea>  
                </div>                  
            </div>
        </div>
        </form>
        <script>
$(function() {

    var form_original_data = $("#myform").serialize(); 

    $("#enregistrerFacadesToitures").click(function() {
        if ($("#myform").serialize() != form_original_data) {
            <button type="submit" name="enregistrerFacadesToitures" class="btn btn-default">Enregistrer</button>
            }
    });

});
</script>
    </div>
</section>

Sorry for my english.

Upvotes: 1

Views: 208

Answers (2)

Mohamed-Yousef
Mohamed-Yousef

Reputation: 24001

you can use prop('disabled' , true) and prop('disabled' , false) for button .. like so

$("#enregistrerFacadesToitures").click(function() {
    if ($("#myform").serialize() !== form_original_data) {
       $('button[type="submit"][name="enregistrerFacadesToitures"]').prop('disabled' , true);
    }else{
       $('button[type="submit"][name="enregistrerFacadesToitures"]').prop('disabled' , false); 
    }
});

Upvotes: 2

Vinci321
Vinci321

Reputation: 11

give a default disabled property to the submit button DOM, then use jQuery to check if any changes happened in the form , if yes, then delete the disabled property of this submit button DOM, if not, then just keep it as disabled.

Upvotes: 1

Related Questions