使用Javascript在PHP中选择选项时启用按钮

时间:2015-10-01 12:44:04

标签: javascript jquery

我尝试了其他主题的一些代码来解决我的问题,但我仍然没有设法得到我想要的东西..

当用户在选择选项中选择一个项目时,我需要一个按钮启用,当用户重新选择默认选择时,我需要禁用...

    <script text="text/javascript">

$(document).ready(function(){
    $('#select_resa').change(function(){
        var val = $('#select_resa').val();
        alert(val);

        if (val == '') {
            $('#supprimer_resa_button').attr('disabled', 'disabled');
        }else{
            $('#supprimer_resa_button').removeAttr('disabled');
        }
    });
});
</script>

<form method="post" action="modif_resa.php?" id="modif_resa">
    <h2>Modifier/Supprimer un reservation</h2>
    <?php if(isset($erreur)) echo '<p style="font-style:italic;font-size:0.8em;text-align:center;color:red;margin-bottom:5px;">'.$erreur.'</p>'; ?>



    <label for="salle"><strong>Choisissez une reservation</strong></label>

    <select id="select_resa" name="select_resa">
        <option value="" id="select" name="select">--Selectionnez--</option>
        <option value=""></option>
        <option value="2">salut</option>
        <?php
        if(!empty($liste_reservations)){
            for($i=0;$i<count($liste_reservations);$i++){
                echo '<option "title="'.$liste_reservations[$i]['RS_NOM'].'" value="'.$liste_reservations[$i]['RS_NOM'].'" '.(isset($SALLE) && $SALLE==$liste_reservations[$i]['RS_ID']?'selected="selected"':'').'>'.$liste_reservations[$i]['RS_NOM'].'</option>';
            }
        }
        ?>
   </select>

   <br/><br/>


    <label for="s_date"> Modifier la date de fin</label>
    <input type="text" value="<?php if(isset($RS_DATE)) echo $RS_DATE;?>" name="s_date" id="s_date"  maxlength="10" size="10"/>
    <a href="javascript:void(0);"   onclick="javascript:return CalendarDate('s_date');"><img src="/Libs/calendar/calendar_small.png" alt="Calendrier" style="vertical-align:middle; border:0;" title="Calendrier" /></a>
    <br/><br/> 

    <span class="valider">
    <input type="submit" name="valider" value="<?php echo TXT_VALIDER; ?>" />

    </span>

        <br/><br/>


    <div style="text-align:center; margin-top: 50px;">
    <input id="supprimer_resa_button" disabled="disabled" type="submit" name="supprimer_resa_button" style="font-size: 15px; width: auto; height:auto; font-weight:bold;" value="<?php echo TXT_SUPPRIMER_RESA; ?>" />
    </div>

</form>

我的提交按钮在任何情况下都可以启用... 我哪里错了?

3 个答案:

答案 0 :(得分:1)

你只需要使用:

$('#supprimer_resa_button').removeAttr('disabled');

而不是

$('#supprimer_resa_button').attr('disabled', '');

答案 1 :(得分:1)

请检查:

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

<script text="text/javascript">
$(document).ready(function(){
    $('#select_resa').change(function(){
        var val = $('#select_resa').val();

        if (val == '') {
            $('#supprimer_resa_button').attr('disabled', 'disabled');
        }else{
            $('#supprimer_resa_button').removeAttr('disabled');
        }
    });
});



</script>

<form method="post" action="modif_resa.php?" id="modif_resa">
    <h2>Modifier/Supprimer un reservation</h2>
    <?php if(isset($erreur)) echo '<p style="font-style:italic;font-size:0.8em;text-align:center;color:red;margin-bottom:5px;">'.$erreur.'</p>'; ?>



    <label for="salle"><strong>Choisissez une reservation</strong></label>

    <select id="select_resa" name="select_resa">
        <option value="" id="select" name="select">--Selectionnez--</option>
        <option value="1">abc</option>
        <option value="2">def</option>
        <option value="3">ghi</option>
        <?php
        if(!empty($liste_reservations)){
            for($i=0;$i<count($liste_reservations);$i++){
                echo '<option "title="'.$liste_reservations[$i]['RS_NOM'].'" value="'.$liste_reservations[$i]['RS_ID'].'" '.(isset($SALLE) && $SALLE==$liste_reservations[$i]['RS_ID']?'selected="selected"':'').'>'.$liste_reservations[$i]['RS_NOM'].'</option>';
            }
        }
        ?>
   </select>

   <br/><br/>


    <label for="s_date"> Modifier la date de fin</label>
    <input type="text" value="<?php if(isset($RS_DATE)) echo $RS_DATE;?>" name="s_date" id="s_date"  maxlength="10" size="10"/>
    <a href="javascript:void(0);"   onclick="javascript:return CalendarDate('s_date');"><img src="/Libs/calendar/calendar_small.png" alt="Calendrier" style="vertical-align:middle; border:0;" title="Calendrier" /></a>
    <br/><br/>

    <span class="valider">
    <input type="submit" name="valider" value="<?php echo TXT_VALIDER; ?>" />

    </span>

        <br/><br/>


    <div style="text-align:center; margin-top: 50px;">
    <input id="supprimer_resa_button" disabled="disabled" type="submit" name="supprimer_resa_button" style="font-size: 15px; width: auto; height:auto; font-weight:bold;" value="<?php echo TXT_SUPPRIMER_RESA; ?>" />
    </div>

</form>

答案 2 :(得分:0)

在最近的jQuery api中,你必须在布尔html属性上使用prop

$('#supprimer_resa_button').prop('disabled', false)

$('#supprimer_resa_button').prop('disabled', true)

attr仅包含可包含值的html属性。

在你的情况下,你也可以缩短一点:

function updateFormEnabled() {
    $('#supprimer_resa_button').prop('disabled', verifyAdSettings());
}