鍍金池/ 問答/HTML/ Jquery confirm.js 獲取不到窗口里組件最新的值

Jquery confirm.js 獲取不到窗口里組件最新的值

問題描述:
小弟使用的是 JQ 的confirm.js 彈出框插件。但是彈出框里面的組件的值,被改變,就沒辦法獲取到最新的值。。。

代碼:

彈出框的內(nèi)容

<div id="updateDialog" hidden>
    <form method="post">
        <div class="form-group">
            <label for="updateUser">賬號</label>
            <input id="updateUser" type="text" class="form-control">
        </div>
        <div class="form-group">
            <label for="updatePassword">密碼</label>
            <input id="updatePassword" type="password" class="form-control" autofocus="autofocus">
        </div>
        <div class="form-group">
            <label for="updateLoginName">登錄姓名</label>
            <input id="updateLoginName" type="text" class="form-control">
        </div>
    </form>
</div>

點(diǎn)擊 a標(biāo)簽,執(zhí)行方法updateAction(node)

 // 編輯 彈窗
        function updateAction(node) {
            $(node).tooltip('hide');
            var rows = $('#createTable').bootstrapTable('getSelections');  // 獲取選取的行
            if(rows.length != 1) {
                $.confirm({
                    title : false,
                    content : '請選擇一條記錄',
                    autoClose : 'cancel|3000',
                    backgroundDismiss : true,
                    buttons : {
                        cancel :{
                            text : '取消',
                            btnClass : 'btn btn-primary'
                        }
                    }
                });
            }else {
                //先判斷有無權(quán)限
                var url = getRootPath() + "/edit";
                console.log("url  " + url);
                $.get(url,function(result){
                    var jsonResult = JSON.parse(result);
                    console.log("state "+jsonResult.state);
//                    var jsonResult = eval("("+result+")");
                    if(401 == jsonResult.state) {
                        $.confirm({
                            title : false,
                            content : jsonResult.result,
                            backgroundDismiss : true,
                            buttons : {
                                confirm :{
                                    text : '確定',
                                    btnClass : 'btn btn-primary',
                                }
                            }
                        });
                    }else if(200 == jsonResult.state) {
                        var temp = $('#createTable').bootstrapTable('getSelections');
                        var userVal = temp[0].userName;
                        var loginNameVal = temp[0].loginName;
                        var  varUrl = getRootPath() + "/updateUser";
                        $('#updateUser').attr("value",userVal).attr("disabled",true);
                        $('#updateLoginName').attr("value",loginNameVal);
                        $.confirm({
                            type: 'blue',
                            animationSpeed: 300,
                            title: '編輯用戶',
                            content: $('#updateDialog').html(),
                            buttons: {
                                confirm: {
                                    text: '保存',
                                    btnClass: 'btn btn-primary',
                                    action: function () {
//                                        var varUrl = getRootPath() + "/updateUser";
//                                        var passwordTemp = $('#updatePassword').val();
//                                        var loginNameTemp = $('#updateLoginName').val();
//                                        var jsonTemp = {'userName': userVal,'password': passwordTemp, 'loginName' : loginNameTemp};
                                        $('#updatePassword').next().html("");
                                        $('#updateLoginName').next().html("");
                                        console.log("密碼  " + $('#updatePassword').attr('value'));
                                        console.log("登錄姓名 " +$('#updateLoginName').val());
                                        if($('#updatePassword').val() == '' || $.trim($('#updatePassword').val()) == '') {
                                            $.dialog({
                                                title : '非法輸入!',
                                                content : '密碼不能為空',
                                            });
                                            return false;
                                        }
                                        if($('#updateLoginName').val() == '' || $.trim($('#updateLoginName').val()) == '') {
                                            $.dialog({
                                                title : '非法輸入!',
                                                content : '登錄姓名不能為空',
                                            });
                                            return false;
                                        }
                                        if($.trim($('#updateLoginName').val()).length > 20) {
                                            $.dialog({
                                                title : '非法輸入!',
                                                content : '長度最長為20',
                                            });
                                            return false;
                                        }
                                        return false;
                                    }
                                },
                                cancel: {
                                    text: '取消',
                                    btnClass: 'btn btn-primary'
                                }
                            },
                            onClose : function () {
                                console.log("密碼  " + $('#updatePassword').attr('value'));
                                console.log("登錄姓名 " +$('#updateLoginName').val());
                            }
                        });
                    }
                });
            }
        }

使用#('#updatePassword').val() .沒辦法獲取到更改后的值。。 獲取到的值都是 undefined。
改變#('#updateLoginName') 里面的值,也沒辦法獲取到更改后的值

回答
編輯回答
兔寶寶

你是不是在關(guān)閉了彈出框才去獲取$('#updatePassword').val()的?嘗試輸出$('#updatePassword').length,看看能不能獲取到元素。如果能獲取到,那就看看頁面里是不是有多個(gè)id為updatePassword的標(biāo)簽

2017年10月23日 22:18
編輯回答
法克魷

因?yàn)檫^程展示不完整,只能假設(shè)判斷

  1. 可能彈出框關(guān)閉后你的js程序才去獲取,所以獲取不到值
  2. 是所有的值都不能獲取還是只有updatePassword不能獲???如果僅是updatePassword不能獲取,看是否頁面內(nèi)定義了多個(gè)updatePassword。
2018年1月13日 03:14
編輯回答
咕嚕嚕

我已經(jīng)找到答案了。
首先感謝2個(gè)回答者。
原因其實(shí)就是:
confirm.js 的彈出窗體。會獲取你之前定義的窗體內(nèi)容,然后把我自己定義的內(nèi)容包裹進(jìn)confirm.js。其實(shí)也是有2個(gè) id 為 updatePassword。 一個(gè)是我自己定義的,一個(gè)是被包裹到confirm.js 里面的。也就是說把$('#updatePassword').val() 換成。this.$content.find('#updateLoginName').val() 。 即可找到被改變的值。

2017年7月2日 22:36