We Keep Coding

Create "simple" pagination for PHP, foreach loop

I'm pretty new with the "dynamics" programming, but I really love it and now I need to improve my PHP web page.
Actually I have an PHP array, and I'm building "standard" html output inside a foreach cycle to build my page.
As you can see from the screenshot the actual result it's a page with a lot of <div class="ui-content">, there is a way, to simple create pagination where I'm able to show only six DIV entry per page, and create the menu to switch between page?
I think, the best solution is build something using advanced "dynamics" technics like AJAX call, but I'm totally new with this kind of programming.
Another possibilities is to use some pure java script at runtime to make the pagination, but I think this is not the best solution concerning the performance.

You Can try with simple Jquery Pagination, which is simple one to implement, but it loads the complete data and then paginate, in other approch like AJAX which request server each time you change the page.
Simple pagination jquery example easily available online. for example :
http://flaviusmatis.github.io/simplePagination.js/#page-2

How to let 2 html pages communicate

i'm new to web tecnologies, and i'm trying to make some stuff work. I have 2 similar html pages, with the same table on them.
I have to make sure that every data inserted in the first table (editable) is replicated in the same cell of the second table (of the other HTML page).
HTML code I used is really simple, I've added some style with CSS and 3 functions with JS (add, delete and modify row). I have to replicate these changes to rows too.
I'm a bit confused, I think I have to manage this thing with a server application, maybe in php, but i don't know how to start.
I've searched this site, but I didnt find anything useful, for now.
How can I approach this problem? I want to learn these things, I am not asking you for having working code and easily solve the problem...
Thanks to everybody in advance.

You need to store the data somewhere (database, local storage, cookie, file, etc.), and read it when page loads.
The most common way is to store the data in database.
When your page loads, get the data from the database and build the table.
This is a good place you can start learning how to work with MySql database: http://www.w3schools.com/php/php_mysql_intro.asp

Angular JS library will be a simple solution to your problem.

Is it good to return html code to jquery?

I'm working on a project where it has a number of pages. Each page displays 10 rows where the layout that is using for each page is different. Until now I had the html code of each row in a javascript code and based on the page's url I was using the appropriate html code (if statement). The if statement is inside into a loop which is looping based on the number of rows. The results of the rows are coming from an ajax method. Now I want somehow to separate it so it can be more easily for me to maintain it, basically to remove the html code from the javascript and keep each row's html code into a different file.
Note: the Ajax is in a given time, is sending automatically requests to the php file for any new rows.
One solution which I came out is that I can use the php to create a variable with the html code .
Second solution is to create an array of each record with the html code and then pass it to jquery to print it.
Both solutions I don't know if are good solutions and can help me to maintain the project in the future.

You might consider a template library such as handlebars to help with templating. Frameworks such as AngularJS and Ember also excel at solving these kinds of problems.
Your Web Services API should be returning JSON though, not HTML fragments. Let the client build the DOM, and let the server focus on data.

You should return structured data (see JSON for example) to your AJAX request. This way, you can support multiple interfaces (e.g., a website, an application): each interface will get only the data, and will handle the rendering as it needs.
In your example, you ask for data via an AJAX request, your server responds with a JSON-structured response. JQuery reads it and converts it to javascript array thanks to jQuery.getJSON. With your array, you loop through each element and insert html elements into the webpage.

You have two options:
If your HTML templates is not changing frequently, the best way is to define html templates in your HTML structure using some java script template library (eg. Handlebars) and fill it with data from your AJAX (JSON) requests.
If your HTML templates change frequently or depends on some conditions (data) in row, you should create PHP partial views which generate proper html structure already filled with data.
For many rows it is better idea to create whole table server side to reduce requests.

Mysql take a long time to load

I have a website that mirror the hacked websites
From the day of starting everything is cool till it's being bigger
I have 2,197 records in MySQL DB
Every time I want to load this page http://red-zone.org/archive/ 2,197 have to be shown.
The cause that i'm using JavaScript for pagination and the JavaScript will work just after loading all the records
I don't like to use PHP for pagination
Does there's any other solution ?

I think the best way to use paging with big data is using Server-side processing with ajax/java script.
If you want a cool example you can look into datatables:
https://datatables.net/examples/data_sources/server_side.html
Of you can make your own javascript, but i see your already using datatables try the server side processing it will resolve your issue.

HTML that's both server-side and javascript generated - how to combine?

I'm usually a creative gal, but right now I just can't find any good solution. There's HTML (say form rows or table rows) that's both generated javascript-based and server-sided, it's exactly the same in both cases. It's generated server-sided when you open the page (and it has to stay server-sided for Google) and it's generated by AJAX, to show live updates or to extend the form by new, empty rows.
Problem is: The HTML generation routines are existing twice now, and you know DRY (don't repeat yourself), aye? Each time something's changed I have to edit 2 places and this just doesn't fit my idea of good software.
What's your best strategy to combine the javascript-based and server-sided HTML generation?
PS: Server-sided language is always different (PHP, RoR, C++).
PPS: Please don't give me an answer for Node.JS, I could figure that out on my own ;-)

Here's the Ruby on Rails solution:
Every model has its own partial. For example, if you have models Post and Comment, you would have _post.html.erb and _comment.html.erb
When you call "render #post" or "render #comment", RoR will look at the type of the object and decide which partial to use.
This means that you can redner out an object in the same way in many different views.
I.e. in a normal response or in an AJAX response you'd always just call "render #post"
Edit:
If you would like to render things in JS without connecting to the server (e.g. you get your data from a different server or whatever), you can make a JS template with the method I mentioned, send it to the client and then have the client render new objects using that template.
See this like for a JS templating plugin: http://api.jquery.com/category/plugins/templates/

Make a server handler to generate the HTML. Call that code from the server when you open the page, and when you need to do a live update, do an AJAX request to that handler so you don't have to repeat the code in the client.

What's your best strategy to combine the javascript-based and server-sided HTML generation?
If you want to stay DRY, don't try to combine them. Stick with generating the HTML only on the server (clearly the preferable option for SEO), or only on the client.

Make a page which generates the HTML on the server and returns it, e.g.:
http://example.com/serverstuff/generaterows?x=0&y=foo
If you need it on the server, access that link, or call the subroutine that accessing the link calls. If you need it on the client, access that link with AJAX, which will end up calling the same server code.
Or am I missing something? (I'm not sure what you mean by "generated by AJAX").
I don't see another solution if you have two different languages. Either you have a PHP/RoR/whatever to JavaScript compiler (so you have source written in one language and automatically generated in the others), or you have one generate output that the other reads in.

Load the page without any rows/data.
And then run your Ajax routines to fetch the data first time on page load
and then subsequently fetch updates/new records as and when required/as decided by your code.