Step by step to create a beautiful news list (no refresh paging, Content preview) The first step _ basic Application

No paging. So if the data volume is very large, the situation becomes very bad, often open a Web page will need a long time, greatly reducing the user's experience effect.
And pagination is also very pay attention to, different databases often correspond to different ways of paging. There is no discussion here. Here we will only use simple access as a database for a news listing without refreshing paging. No refresh means to use AJAX technology, of course, no refresh is not just Ajax, there are other ways to do without refreshing, such as all the data read out at once, and then according to the number of pages to display different content, this can only be achieved by JavaScript, but this is undoubtedly quench thirst, And there is no paging effect is the same, the same, just feel good.

To use Ajax to write yourself manually, or to use a framework, I prefer to use jquery to write Ajax, and VS2010 support for jquery is good. and paging, jquery already has a ready-made plugin for us to use.

Let's start with the beautiful news. The first step: Demand analysis

Whatever you are doing, be sure to know what your needs are, otherwise busy for a long time to find that this does not meet the demand, the results of a white busy.

Our demand is as follows:

1. Dynamic News Listings (this is simple)

2. You can read the news list in pagination (this is not difficult)

3. Can read a news list without refreshing paging (this is a bit difficult)

4. Can preview the content of the news (this is also a little bit difficult)

5. Friendly interface (this is necessary)

Here's what we need to talk about:

For 1, 2 and 5 do not explain, online can find a lot of information. On the 3rd and 4th to explain, in fact, if you know a little Ajax, these are pediatrics.

3.== read the news list without a refresh, click on the next page to trigger the event, invoke Ajax to find the next page of data in the database and return it, and then display it on the page.

4== to preview the content of the news, when you move the mouse over the connection to trigger the event, get the ID of the news and use Ajax to find the corresponding news content in the database, intercept part of the display in the Div, here is a place to note, that is, if the interception of the contents of the HTML tag should pay special attention to.

OK, after the demand analysis is done, start doing it. Prepare the following environments:

VS2010 +access +jquery

Development environment vs can also use 2008SP1, because this version of jquery has a smart hint, of course, you can use the other version, there is no smart hint effect.

The version of the Access database is 2003

jquery:1.3.2 above version

Of course, there are other documents need to use, this later said, first to preview the final effect bar: (Pagination is the part of the preview covered ...)

Note: The object of this article is primarily Ajax novice, or someone who has no contact at all, but wants to make things quickly using Ajax.