Xml_javascript pagination-XML/RSS Tutorial-php.cn

Home

Backend Development

XML/RSS Tutorial

Xml_javascript pagination

黄舟

Feb 28, 2017 pm 04:52 PM

Xml_javascript paging

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

<!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>
    <title>龙的传人--Xml_javascript分页</title>
     
</head>
<body onload="getxmlDoc()">
<script language="Javascript" type="text/javascript">
var xmlDoc;
var nodeIndex;
var pageIndex;
var pageSize=13;
var lastPage;   //最后一页
var overSize    //最后一页的记录数
function getxmlDoc()
{
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    var currNode;
    xmlDoc.async=false;
    xmlDoc.load("myTest.xml");
    if(xmlDoc.parseError.errorCode!=0)
    {
        var myErr=xmlDoc.parseError;
        alert("出错！"+myErr.reason);
    }
    getRecordCount();
    onFirst();
     
}
function getRecordCount()
{
    var personNode= xmlDoc.selectNodes("/Root")[0];
    var recordCount=personNode.childNodes.length;
    var pageCount=Math.ceil(recordCount/pageSize);
    document.getElementById("txtPageCount").value=pageCount;
    document.getElementById("txtRecordCount").value=recordCount;
    overSize=recordCount%pageSize;
    if(overSize>0)
    {
        lastPage=recordCount-overSize;
    }
    else
    {
        lastPage=recordCount-pageSize;
    }
     
}
function getPageRecord(pageIndex,pageSize)
{
     clearRow("myTable");    
    var personNode= xmlDoc.selectNodes("/Root")[0];
    var currNode=personNode.childNodes[pageIndex];
    for(var i=pageIndex;i<pageIndex+pageSize;i++)
    {
        var arr=new Array();
        var nNode= xmlDoc.selectSingleNode("Root/Person["+i+"]") ;
        arr[0]=nNode.getAttribute("Id");    //序号
        arr[1]=nNode.childNodes[0].text;    //工号
        arr[2]=nNode.childNodes[1].text;    //姓名
        arr[3]=nNode.childNodes[2].text;    //性别
        arr[4]=nNode.childNodes[3].text;    //部门
        arr[5]=nNode.childNodes[4].text;    //职位
        arr[6]=nNode.childNodes[5].text;    //地址
         
//        arr[0]=personNode.childNodes[i].getAttribute("Id");    //序号
//        arr[1]=personNode.childNodes[i].childNodes[0].text;    //工号
//        arr[2]=personNode.childNodes[i].childNodes[1].text;    //姓名
//        arr[3]=personNode.childNodes[i].childNodes[2].text;    //性别
//        arr[4]=personNode.childNodes[i].childNodes[3].text;    //部门
//        arr[5]=personNode.childNodes[i].childNodes[4].text;    //职位
//        arr[6]=personNode.childNodes[i].childNodes[5].text;    //地址
        addRow(i+1,"myTable",arr);
    }    
}
function onFirst()
{
    pageIndex=0;
    var currIndex=pageIndex;
    getPageRecord(currIndex,pageSize) 
    pageIndex=currIndex ;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
    document.getElementById("txtCurrPageRecord").value=pageSize;
}
function onPRev()
{
    var currIndex=pageIndex;
    currIndex-=pageSize;
    getPageRecord(currIndex,pageSize)
    pageIndex=currIndex;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
    document.getElementById("txtCurrPageRecord").value=pageSize;
    
}
function onNext()
{    
    var currIndex=pageIndex;
    currIndex+=pageSize;
    getPageRecord(currIndex,pageSize)
    pageIndex=currIndex;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
    document.getElementById("txtCurrPageRecord").value=pageSize;
     
}
function onLast()
{
    if(overSize>0)
    {
        getPageRecord(lastPage,overSize)
        document.getElementById("txtCurrPageRecord").value=overSize;
    }
    else
    {
        getPageRecord(lastPage,pageSize)
        document.getElementById("txtCurrPageRecord").value=pageSize;
    }    
    pageIndex=lastPage;
    document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
}
function toPage()
{    
    var index=document.getElementById("txtCurrPage").value
    var currIndex=(index-1)*pageSize;      
    if(event.keyCode==13)
    {
         getPageRecord(currIndex,pageSize);
    }
    pageIndex=currIndex;
}
function addRow(i,dataGridId,arr)
{
 var row=document.createElement("tr");
 var cell=createCellWidthText(i);  
  row.appendChild(cell);
 for(var j=0;j<arr.length;j++)
 {
  cell=createCellWidthText(arr[j]);
  row.appendChild(cell);
 } 
 document.getElementById(dataGridId).firstChild.appendChild(row);
}
function createCellWidthText(text)
{
 var cell = document.createElement("td");
 var textNode = document.createTextNode(text);
 cell.appendChild(textNode);
 return cell; 
}
function clearRow(obj)
{
 var table=document.getElementById(obj);
 var nodeTbody=table.firstChild
 var length=nodeTbody.childNodes.length;  
 for(var i=length-1;i>0;i--)
 {
  nodeTbody.removeChild(nodeTbody.childNodes[i]);   
 }
}
</script>
    <form id="form1" runat="server">
    <div>
        <table align="center" style="border-right: #0033ff thin solid; border-top: #0033ff thin solid;
            border-left: #0033ff thin solid; width: 650px; border-bottom: #0033ff thin solid">
            <tr>
                <td>
                    共<input id="txtPageCount" name="txtPageCount" style="width: 33px; 
                    color: #0000ff; border-top-style: none; border-right-style: none; 
                    border-left-style: none; background-color: transparent; border-bottom-style: none;" type="text"   onkeydown="toPage()"/>页/
                    <input id="txtRecordCount" name="txtRecordCount" style="width: 46px; 
                    color: #3300ff; border-top-style: none; border-right-style: none; 
                    border-left-style: none; background-color: transparent; border-bottom-style: none;" type="text"   onkeydown="toPage()"/>条记录
                    <input id="btnFirst" type="button" value="首页"  onclick="onFirst()"/>
                    <input id="btnPrev" type="button" value="上一页"  onclick="onPrev()"/>
                    <input id="btnNext" type="button" value="下一页"  onclick="onNext()"/>
                    <input id="btnLast" type="button" value="尾页"  onclick="onLast()"/>
                    第<input id="txtCurrPage" name="txtCurrPage" style="width: 46px; color: #ff3333;" type="text"   onkeydown="toPage()"/>
                    页(当前页<input id="txtCurrPageRecord" name="txtCurrPageRecord" style="width: 22px; 
                    color: #ff3333; border-top-style: none; border-right-style: none;
                     border-left-style: none; background-color: white; border-bottom-style: none;" type="text"   onkeydown="toPage()"/>条记录）</td>
            </tr>
            <tr>
                <td>
                     <table width="100%" id="myTable">
                        <tr style="background-color:Yellow">
                            <td style="width: 34px; height: 21px;">
                                Id</td>
                            <td style="width: 34px; height: 21px;">
                                序号</td>
                            <td style="width: 42px; height: 21px;">
                                工号</td>
                            <td style="width: 36px; height: 21px;">
                                姓名</td>
                            <td style="width: 39px; height: 21px;">
                                性别</td>
                            <td style="width: 43px; height: 21px;">
                                部门</td>
                            <td style="width: 50px; height: 21px;">
                                职位</td>
                            <td style="width: 100px; height: 21px;">
                                地址</td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
     
    </div>
    </form>
</body>
</html>

Copy after login

The above is the content of Xml_javascript paging. For more related content, please pay attention to the PHP Chinese website (www.php.cn)!

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress images for free

Clothoff.io

AI clothes remover

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Assassin's Creed Shadows: Seashell Riddle Solution

4 weeks ago By DDD

What's New in Windows 11 KB5054979 & How to Fix Update Issues

3 weeks ago By DDD

Where to find the Crane Control Keycard in Atomfall

4 weeks ago By DDD

Roblox: Dead Rails - How To Complete Every Challenge

1 months ago By DDD

How to fix KB5055523 fails to install in Windows 11?

2 weeks ago By DDD

Hot Tools

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Where is the login entrance for gmail email?

7719

Java Tutorial

1641

CakePHP Tutorial

1396

Laravel Tutorial

1289

PHP Tutorial

1233

Related knowledge

Can I open an XML file using PowerPoint? Feb 19, 2024 pm 09:06 PM

Can XML files be opened with PPT? XML, Extensible Markup Language (Extensible Markup Language), is a universal markup language that is widely used in data exchange and data storage. Compared with HTML, XML is more flexible and can define its own tags and data structures, making the storage and exchange of data more convenient and unified. PPT, or PowerPoint, is a software developed by Microsoft for creating presentations. It provides a comprehensive way of

Simple JavaScript Tutorial: How to Get HTTP Status Code Jan 05, 2024 pm 06:08 PM

JavaScript tutorial: How to get HTTP status code, specific code examples are required. Preface: In web development, data interaction with the server is often involved. When communicating with the server, we often need to obtain the returned HTTP status code to determine whether the operation is successful, and perform corresponding processing based on different status codes. This article will teach you how to use JavaScript to obtain HTTP status codes and provide some practical code examples. Using XMLHttpRequest

Detailed explanation of the principle of MyBatis paging plug-in Feb 22, 2024 pm 03:42 PM

MyBatis is an excellent persistence layer framework. It supports database operations based on XML and annotations. It is simple and easy to use. It also provides a rich plug-in mechanism. Among them, the paging plug-in is one of the more frequently used plug-ins. This article will delve into the principles of the MyBatis paging plug-in and illustrate it with specific code examples. 1. Paging plug-in principle MyBatis itself does not provide native paging function, but you can use plug-ins to implement paging queries. The principle of paging plug-in is mainly to intercept MyBatis

How to use PHP functions to process XML data? May 05, 2024 am 09:15 AM

Use PHPXML functions to process XML data: Parse XML data: simplexml_load_file() and simplexml_load_string() load XML files or strings. Access XML data: Use the properties and methods of the SimpleXML object to obtain element names, attribute values, and subelements. Modify XML data: add new elements and attributes using the addChild() and addAttribute() methods. Serialized XML data: The asXML() method converts a SimpleXML object into an XML string. Practical example: parse product feed XML, extract product information, transform and store it into a database.

Best way to implement array pagination in PHP May 04, 2024 pm 02:39 PM

There are two most common ways to paginate PHP arrays: using the array_slice() function: calculate the number of elements to skip, and then extract the specified range of elements. Use built-in iterators: implement the Iterator interface, and the rewind(), key(), current(), next(), and valid() methods are used to traverse elements within the specified range.

How to get HTTP status code in JavaScript the easy way Jan 05, 2024 pm 01:37 PM

Introduction to the method of obtaining HTTP status code in JavaScript: In front-end development, we often need to deal with the interaction with the back-end interface, and HTTP status code is a very important part of it. Understanding and obtaining HTTP status codes helps us better handle the data returned by the interface. This article will introduce how to use JavaScript to obtain HTTP status codes and provide specific code examples. 1. What is HTTP status code? HTTP status code means that when the browser initiates a request to the server, the service

How do you parse and process HTML/XML in PHP? Feb 07, 2025 am 11:57 AM

This tutorial demonstrates how to efficiently process XML documents using PHP. XML (eXtensible Markup Language) is a versatile text-based markup language designed for both human readability and machine parsing. It's commonly used for data storage an

Comparison of Java libraries for XML parsing: Finding the best solution Mar 09, 2024 am 09:10 AM

Introduction XML (Extensible Markup Language) is a popular format for storing and transmitting data. Parsing XML in Java is a necessary task for many applications, from data exchange to document processing. To parse XML efficiently, developers can use various Java libraries. This article will compare some of the most popular XML parsing libraries, focusing on their features, functionality, and performance to help developers make an informed choice. DOM (Document Object Model) parsing library JavaXMLDOMAPI: a standard DOM implementation provided by Oracle. It provides an object model that allows developers to access and manipulate XML documents. DocumentBuilderFactoryfactory=D

See all articles