表單提交前顯示確認窗口

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

成都網(wǎng)站設計、成都網(wǎng)站制作的開發(fā),更需要了解用戶,從用戶角度來建設網(wǎng)站,獲得較好的用戶體驗。成都創(chuàng)新互聯(lián)多年互聯(lián)網(wǎng)經(jīng)驗,見的多,溝通容易、能幫助客戶提出的運營建議。作為成都一家網(wǎng)絡公司,打造的就是網(wǎng)站建設產(chǎn)品直銷的概念。選擇成都創(chuàng)新互聯(lián),不只是建站,我們把建站作為產(chǎn)品,不斷的更新、完善,讓每位來訪用戶感受到浩方產(chǎn)品的價值服務。

<link class="include" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="http://static.naughtycolt.com/js/jquery.validate.min.js"></script>

<!-- 系統(tǒng)公告發(fā)布刪除查詢頁面-->

<link class="include" rel="stylesheet" type="text/css" />

<div  class="row">

<div  id = "gm_query_title">系統(tǒng)公告</div>

<div   id = "gm_query">

<div class="col-md-6 col-md-offset-3">

<form class="form-inline" role="form" action="" method="post" id="send_form" >

{% csrf_token %}

<input type="text" class="form-control" name="radio" id="radio" placeholder="系統(tǒng)公告內容" ><select class="form-control" name = "server_name" id="server_name">

{% if server_dict %}

{% for k in server_dict %}

<option>` k`</option>

{% endfor %}

{% endif %}

</select>

</form>

<!--按鈕寫在form外防止 form自動提交   提交時  submit() id 要寫 對應表單的id -->

<button id="send">發(fā)布</button><button id="query">查詢</button>

</div>

<div  id = "gm_query_list">

<table class="table table-condensed">

{% if radios %}

   <th class="success" >ID</th>

<th class="warning" >`show_server_name`</th>

{% for r in radios %}

<tr>

<td class="success" >` forloop`.`counter `</td>

<td class="warning" >` r `</td>

</tr>

{% endfor %}

{% endif %}

</table>

</div>

<!--彈出確認窗口-->

<div id="radio_confirm" title="系統(tǒng)公告">  

<table class="table table-condensed">

<tr>

<td  class="info" >服務器名</td>

<td  class="danger">操作</td>

<td  class="warning">內容</td>

</tr>

<tr>

<td  id= "td_server" class="success" ></td>

<td  id="td_op" class="danger"></td>      

<td  id="td_content" class="warning"></td>

</tr>                

</table>

</div>

</div>

<script>

$( "#send,#query" ).button({ icons: { primary: "ui-icon-search"} });

$( "#radio_confirm" ).dialog({

 autoOpen: false,

     show: {

       effect: "blind",

       duration: 1000

     },

     hide: {

       effect: "explode",

       duration: 1000

     },

    // height:200,

 modal: true,

 buttons: {

      "確定": function() {

$("#radio_confirm").dialog("close");

$('#send_form').submit();

          },

       "取消": function() {

$("#radio_confirm").dialog("close");

$("#send_form")[0].reset();

 }

 }

});

$( "#send" ).click(function() {

 $("#send_form").validate({

rules: {

radio: "required"

},

messages: {

radio: "公告內容不能為空"

}

});

 $("#td_op").html("發(fā)布");

 $("#td_server").html($("#server_name").val());

 $("#td_content").html($("#radio").val());

 $("#radio_confirm").dialog( "open" );

});

$( "#query" ).click(function() {

$("#send_form").submit();

});

</script>  

網(wǎng)站名稱:表單提交前顯示確認窗口
地址分享:http://bm7419.com/article36/gosepg.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供做網(wǎng)站靜態(tài)網(wǎng)站、外貿(mào)網(wǎng)站建設網(wǎng)站建設、品牌網(wǎng)站建設企業(yè)網(wǎng)站制作

廣告

聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

小程序開發(fā)