0

I am currently working on a small web application which includes a calendar displaying its entries. When the page gets loaded, the calendar gets generated through PHP.

On the same page, there is a form which allows one to edit the entries. The command to change gets sent by AJAX, and then the calendar has to be reloaded in some way.

What I am wondering about currently is the following:

I have two possibilities of updating the Calendar through AJAX.

  • One is to send the Calendar's HTML Markup anew, whether it means reloading the entire calendar or the element of the calendar entry.
    This is probably not optimal, since it requires quite a bit of (raw) data sent through the AJAX call.
    On the other side, all it requires is for me to call the same PHP function which generates the markup again, return that and then replace the DOM Element on the clientside, so neccesary work is roughly 5 lines of code.
    This is the way I am currently using since it feels "easier".
  • The other is to send the Data of the new Calendar entry JSON encoded, and then make the neccesary changes through a javascript function into the existing markup.
    This also feels not optimal, since I would have to use a lot knowledge of the markup twice: Once in the PHP code and once in the JS Code. I can see this redundant code causing problems as soon as the markup would change in any way.
    It also feels like a more 'complicated' solution, which includes easily 4-5 as much code considering I have to manipulate a good amount of fields (roughly 10+).
    On the other hand, a lot less data gets transmitted since only the content gets sent.

Which is the better solution? Am I missing a third (or even fourth) option?

Improve this question

2 Answers 2

Reset to default
1

The second option doesn't necessarily need to involve redundancy in your code.

Your position is that it would do because you're rendering the calendar HTML in PHP on initial page load, and you want to avoid duplicating that logic in Javascript.

The way to avoid that is to put the calendar rendering entirely Javascript, and always send the calendar data as JSON from your PHP code.

On initial page load, this would mean that the PHP program supplies an initial set of data for the calendar, which is then populated by a Javascript initialisation function (eg $(document).ready() if you're using jQuery).

This solution means that your code uses a consistent Javascript-based rendering in all cases.

Of course, your first solution also means a consistent codebase doing the rendering, so both options work just fine from that angle. So if that's the criteria, then there's very little to pick between them. Obviously if you have option one coded up already, then that's a clear winner over option two, unless you have a good cause to switch to Javascript. But other criteria that might come into play could include the possibility of rendering something else using the same JSON object, using it to populate an existing third-party Javascript date control, or providing it as an API for third parties. For these cases, JSON is a clear winner, because it provides more flexibility.

So I guess it depends on you, and what's important to you. But I guess the main point I'm making is that both options are possible without duplicating code.

Hope that helps.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

One pitfall of choosing the 2nd Javascript used for rendering solution could be seen in the fact that there is not a calender dispaly for users with Javascript disabled. The Calenders HTML code generated by PHP might (with disabled Javascript) at least be displayed. Surely an update AJAX-Style is not possible in neither case. Still the first solution might be a better Fallback
0

I would say it depends on the traffic on your site. If this site has heavy traffic the later option would minimize the amount of bandwidth, and that can save you a lot over the course of a day.

If bandwidth is not a worry then go with the simplest solution which I would believe is your current solution. This also could be the optimal solution if you don't have lots of control of the php function or the layout, such is the case if you are only working wht css and js.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.