easyui dialog 表單提交,彈框初始化賦值,dialog實現


//定義彈框html
<div id="delete" class="easyui-dialog" title="Delete" data-options="closed: true" style="width: 400px; height: 280px;"> <form method="post" class="easyui-form" > <div class="notice">You are deleting a comment now!</div> <div class="delreason"> <input type="radio" checked="true" name="delReason" value="unhealthy" />unhealthy <input type="radio" name="delReason" value="other" />other </div> <input type="hidden" name="itemId" id="itemId" value=""/> <div class="head"> <div><span class="bold">Marks</span></div> </div> <textarea class="textarea" name="delComment" id="delComment"></textarea> <div class="center"> <input onclick="fnSubmit('delete','your request url')" type="button" value="submit"/> </div> </form> </div>  

設置一個按鈕

<button class="r-button" id="deletebtn">Delete</button>

對應的js操作,初始化彈框以及提交表單

$('#deletebtn').click(function (e) {
        e.preventDefault();
        $('#delete_publicity').dialog({
            onOpen:function() {
                 //AAA參數可以為外界變量
                $('#itemId').val(AAA);
                $('#del_post').val('-1');
                $('#deleteMarks').val('');
            }
           //也可以在此處設定初始值,而免於在html中設定了
            //title: 'My Dialog',
            //width: 400,
            //height: 200,
            //closed: false,
            //cache: false,
            //href: 'get_content.php',
            //modal: true
        });
        $('#delete_publicity').dialog('open');
         showModalMask('.modal-mask');
        $('#delete_publicity').window('center');
    });    

  提交表單操作

function fnSubmit(id,url) {
        if(id=='delete_reply'){
//注意,easyui表單提交實際上是利用jquery的serialize方法將表單數據轉化為query string的形式append到url地址上
            var submitPar = $('#'+id+' form').serialize();
            submitPar = submitPar.toString();
            var delReason = submitPar.substring(submitPar.indexOf('=')+1,submitPar.indexOf('&'));
            var delComment = submitPar.substring(submitPar.lastIndexOf('=')+1,submitPar.length);
            delComment = delComment.trim();
//根據easyui 表單提交的方式,若存在文本框在form內,且輸入有空格時 將會將空格對應的轉化為+號,具體可參見easyui表單提交部分
            if(delReason == 'other' && (delComment==''||/^[\+]+$/.test(delComment))){
                $.messager.alert('Notice','Please enter the reason for the deletion');
            }else{
                ajaxRequest(id,url);
            }
        }else{
            ajaxRequest(id,url);
        }
        function ajaxRequest(id,url){
            $('#'+id+' form').form('submit',{
                url:url,
                onSubmit:function(){
                    //return $(this).form('validate');
                },
                success:function(data){
                    if(data){
                        data = JSON.parse(data);
                    }
                    if(data.code==200){
                        $('#'+id).dialog('close');
                        $.messager.alert('Notice',data.message);
                            *****
                          
                        }else{
                           *********
                        }

                    }else{
                        $.messager.alert('Notice','submit Fail.');
                    }

                }
            });
        }
    }        

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM