• 一个js编写全选、弹出对话框、ajax-json的案例


       js功能有:全选、弹出对话框、使用json传输ajax数据;不想在写多余的文字了,直接上代码:

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%@taglib prefix="c" uri="http://java.sun.com/jstl/core"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>yk test</title>
    <link rel="stylesheet" type="text/css" href="http://www.huimg.cn/app/baikesurvey/css/baikeSurveyCSS.css" />
    <script type="text/javascript" src="http://www.huimg.cn/lib/jquery-1.7.min.js"></script>
    <script src="http://www.huimg.cn/lib/jquery.dialog-0.8.min.js?

    10131624" type="text/javascript"></script> <script src="/admin/js/weiboWidget.js" type="text/javascript"></script> </head> <body> <h3 style="text-align: center;">test操作</h3> <div class="search-s"> <form action="/weiboWidget.do?action=show" method="post"> 名称:<input type="text" name="docTitle" id="docTitle" value="${docTitle }" />    UID:<input type="text" name="uid" id="uid" value="${uid }" />    <input type="submit" class="btn-b" value="查询" />    <input type="button" class="btn-b" value="重置" onclick="resetData()" /> </form> </div>     <b>信息列表</b>    <input type="button" class="btn-b" value="删除" onclick="deleteData()" />    <input type="button" class="btn-b" value="加入" onclick="openAddWin()" /> </br> </br> <div class="slist"> <table> <tr> <th width="80" align="center"><input type="checkbox" id="checkAll" onclick="selectAll()" /> <b>全选</b></th> <th width="100" align="center">词条名</th> <th width="100" align="center">UID</th> <th width="140" align="center">操作</th> </tr> <c:if test="${count > 0 }"> <c:forEach var="model" items="${weibos}"> <tr> <td bgcolor="#ffffff" align="center"><input type="checkbox" name="id_list" value="${model.ID };${model.OBJECT_ID }" /></td> <td align="center"><a href="http://www.baike.com/wiki/${model.OBJECT_ID }" target="_blank">${model.OBJECT_ID }</a></td> <td align="center">${model.PARAM_VALUE}</td> <td align="center"><a href="#" onclick="javascript:openEditWin('${model.ID}');">编辑</a> </td> </tr> </c:forEach> </c:if> <c:if test="${count < 1 }"> <tr> <td align="center" nowrap="nowrap" colspan="11"><font style='font-weight:bolder;' color='red'>暂无相关数据</font></td> </tr> </c:if> </table> </br> <div class="page-navi">共计 ${count} 条</div> <c:if test="${pagePanel != null}"> <div class="page-navi">${pagePanel}</div> </c:if> </div> <!-- 弹出窗体 --> <div class="hudong_dialog bluebox" id="dialog_weibo" style="display: none; position: absolute; z-index: 2030; 440px; border: 5px solid rgb(102, 102, 102); left: 270px; top: 131px;"> <h2 id="win_Title" class="title" style="cursor: move;">加入操作</h2> <input id="win_action" type="hidden" name="action" value="add" /> <input id="win_id" type="hidden" name="id" /> <div class="content" > <table style="height: 150px;border: 0;"> <tr> <td>名称:</td> <td><input type="text" id="win_docTitle" name="docTitle" /></td> </tr> <tr> <td>UID:</td> <td><input type="text" id="win_uid" name="uid" /></td> </tr> <tr> <td> </td> </tr> </table> </div> <div class="button"> <input type="button" class="ok" name="ok" onclick="save()" value="确定"> <input type="button" class="cancel" name="cancel" onclick="closeWin()" value="取消"> </div> <img class="close" style="" onclick="closeWin()"> </div> </body> </html>


    /**
     * 全选
     * 
     */
    function selectAll() {
    	var selectall = document.getElementById("checkAll");
    	var checkboxid = document.getElementsByName("id_list");
    	if (selectall.checked == true) {
    		for ( var i = 0; i < checkboxid.length; i++) {
    			checkboxid[i].checked = true;
    		}
    	} else {
    		for ( var i = 0; i < checkboxid.length; i++) {
    			checkboxid[i].checked = false;
    		}
    	}
    }
    
    /**
     * 批量删除操作
     * 
     */
    function deleteData() {
    	var idList = document.getElementsByName("id_list");
    	var ids = "";
    	var docTitles = "";
    	// 检查是否选择内容
    	for (i = 0; i < idList.length; i++) {
    		if (idList[i].checked) {
    			var temp = idList[i].value.split(";");
    			ids += temp[0] + ",";
    			docTitles += temp[1] + ",";
    		}
    	}
    	if (ids == "") {
    		alert("请选择纪录!

    "); } else { $.post("/weiboWidget.do?

    action=delete&" + new Date(), { 'ids' : ids, 'docTitles' : docTitles }, function(data) { window.location.href = "/weiboWidget.do?action=show"; return false; }); } } /** * 关闭窗体同一时候清空from表单内容 */ function closeWin() { // 初始化编辑表单 $("#win_action").val(""); // 设置编辑ID $("#win_id").val(""); // 设置名称 $("#win_docTitle").val(""); // 设置uid $("#win_uid").val(""); $("#dialog_weibo").hide(); } /** * 保存加入或编辑的数据 */ function save() { // 保存前验证 var docTitle = $("#win_docTitle").val(); var uid = $("#win_uid").val(); if (docTitle != "" && uid != "") { $.ajax({ dataType : 'json', type : 'POST', url : '/weiboWidget.do', data : { 'action' : $("#win_action").val(), 'id' : $("#win_id").val(), 'docTitle' : $("#win_docTitle").val(), 'uid' : $("#win_uid").val(), }, success : function(data) { if (data.flag == 1) { alert(data.msg); window.location.href = "/weiboWidget.do?action=show"; } else { alert(data.msg); } return false; }, error : function() { alert("因为网络问题,保存数据失败。"); return false; } }); } else { alert("名称和id不能为空。"); return false; } } /** * 验证窗体是否已打开 * * @param operType * @returns {Boolean} */ function checkingIsOpenWin(operType) { var deiplay = $("#dialog_weibo").css("display"); if ("block" == deiplay) { if ("addOper" == operType) { alert("加入窗体已打开!

    "); } else if ("editOper" == operType) { alert("编辑窗体已打开!"); } return false; } return true; } // 打开加入窗体 function openAddWin() { if (checkingIsOpenWin("addOper")) { $('#win_Title').text('加入'); $("#win_action").val('add'); $("#win_docTitle").val(""); $("#win_uid").val(""); $("#dialog_weibo").show(); } return false; } // 打开编辑窗体 function openEditWin(id) { if (checkingIsOpenWin("editOper")) { $.ajax({ dataType : "json", type : "POST", url : "/weiboWidget.do?

    action=ajaxLoadWeibo", data : { 'id' : id }, success : function(data) { if (data.flag == 1) { // 初始化编辑表单 $("#win_action").val('modify'); $('#win_Title').text('编辑'); $("#win_id").val(data.id); $("#win_docTitle").val(data.docTitle); $("#win_uid").val(data.uid); // 显示编辑窗体 $("#dialog_weibo").show(); } else { alert(data.msg); } return false; }, error : function() { alert("因为网络问题,临时无法改动操作,请稍后再试。"); return false; } }); } return false; } /** * 重置搜索输入 */ function resetData() { $("#docTitle").val(""); $("#uid").val(""); }


    转载请指明出处:http://blog.csdn.net/yangkai_hudong

  • 相关阅读:
    《DSP using MATLAB》 示例 Example 9.12
    《DSP using MATLAB》示例 Example 9.11
    《DSP using MATLAB》示例 Example 9.10
    《DSP using MATLAB》示例Example 9.9
    《DSP using MATLAB》示例 Example 9.8
    《DSP using MATLAB》示例Example 9.7
    《DSP using MATLAB》示例 Example 9.6
    《DSP using MATLAB》示例Example 9.5
    《DSP using MATLAB》示例 Example 9.4
    (转载)【C++11新特性】 nullptr关键字
  • 原文地址:https://www.cnblogs.com/mengfanrong/p/5237236.html
Copyright © 2020-2023  润新知