BootstrapValidator + PHP:从表格中以模态编辑数据

时间:2015-12-28 03:37:04

标签: javascript php jquery modal-dialog bootstrapvalidator

我有点迷失,因为我没有找到一个例子来指导我解决我的问题。

我在一个标签(联系人)中显示一些数据,每行显示一个按钮(编辑)和PHP代码。

当我点击按钮时,我打开模态并显示所选行的信息。

现在我想使用bootstrapvalidator验证表单,但验证没有看到我的模态,因为模式用联系人的ID标识,如下所示:id="myModal<?php echo $contact['id'];?>"

在我的jquery脚本中,我不知道如何识别此id中的模态。

具有重置密码功能模式的示例:

<td>
            <a class="btn btn-warning btn-sm" data-toggle="modal" data-target="#myModalR<?php echo $user['login']; ?>"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></a>
            <a id="del" class="btn btn-danger btn-sm"  onclick="deleteAccount('<?php echo $user['login']; ?>')" ><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>             

            <!-- Modal Mot de passe -->
            <div class="modal fade" id="myModalR<?php echo $user['login']; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel<?php echo $user['login']; ?>" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="myModalLabel<?php echo $user['login']; ?>">Login :&nbsp;<?php echo $user['login']; ?></h4>
                        </div>

                        <div class="modal-body">
                            <form id="resetPwd" method="post" class="form-horizontal">
                                <div class="form-group">
                                    <label class="col-md-3 control-label">Mot de passe*</label>
                                    <div class='col-md-8'>
                                        <input type="password" class="form-control" name="pwd" id="pwd1" 
                                            data-bv-identical="true"
                                            data-bv-identical-field="confirmPwd"
                                            data-bv-identical-message="Les mots de passe ne sont pas identiques">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-md-3 control-label">Confirmer le mot de passe*</label>
                                    <div class='col-md-8'>
                                        <input type="password" class="form-control" name="confirmPwd" id="pwd2"
                                            data-bv-identical="true"
                                            data-bv-identical-field="pwd"
                                            data-bv-identical-message="Les mots de passe ne sont pas identiques">
                                    </div>
                                </div>
                        </div>
                        <div class="modal-footer">  
                            <div class="form-group">
                                <label class="col-md-11 control-label" style="font-weight:normal" >(*) champs obligatoires</label>
                            </div>
                            <div class="form-group">
                                <div class="col-md-6 col-md-offset-5">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">Sortir</button>
                                    <button type="submit" class="btn btn-primary">Enregistrer</button>

                                </div>
                            </div>
                        </div>

                            </form>
                    </div>
                </div>
            </div>

Javascript:

$(function() {
    $('#resetPwd').bootstrapValidator({
        message: 'Cette valeur n\'est pas valide',
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },fields: {
            pwd: {
                validators: {
                    notEmpty: {
                        message: 'Champ requis'
                    }
                }
            },confirmPwd: {
                validators: {
                    notEmpty: {
                        message: 'Champ requis'
                    }
                }
            }
        }
    }).on('success.form.bv', function(e){
        e.preventDefault();

        $('#myModalR').modal('hide');

0 个答案:

没有答案