Pierminator Pierminator - 1 year ago 45
Ajax Question

Is better use view or include of php to use a popup in Codeigniter?

I'm a newbie with Codeigniter, my question is:
I have a bootstrap page with a button, clicking in this button, from javascript I do an ajax call to retrieve some data from db. These data should be shown in a div of popup. My approach until now is including a page(php) with the popup's html in the main page using "include" of php, from javascript with an ajax call put the data in the div and show using $('#myPopup').modal('show'), but I'm not sure if is the best approach. Another approach can be create a view with the html of popup, from javascript I do an ajax call to a method in my controller that retrieve data from db and load the view, the problem of this approach is that in section of success of ajax call I have html of entire popup, so if I put it before the body, every time I press button it adds a new popup at the end of the page.

jQuery.ajax({
type: "POST",
url: "controller/get_informations",
success: function(res)
{
if (res)
{
// with second approach in res I have code of entire html

$('#popConfiguration').modal('show');
}
},
error: function(xhr, status, error) {
alert(xhr.responseText);
}
});


What is best approach, supposing that in future I can have other 7-8 popup ? I think that put all popup in the main page is not the best
Thanks

Answer Source

It all depends. How often do you have to open modals (and call the server)? Who is the target of your site? how much traffic do you expect?

I.e. If your target is the whole world and you expect a lot of traffic or a lot of modals being opened, then optimizing these things may be crucial. In that sense, asking the server to provide you with the template style every time is a waste of resources. Otherwise, it may be harmless.

I see three options:

OPTION 1

  1. Templates loaded on page load
  2. AJaX fetches a JSON
  3. Update values on template and show

OPTION 2

  1. Templates loaded on modal show
  2. AJaX fetches HTML
  3. Update modal and show

OPTION 3

  1. Templates loaded first time a modal shows (storing the template as a variable)
  2. AJaX fetches JSON
  3. Update values on template and show

The first two options are the ones you mention. The third option is a hybrid that uses two different AJaX for content and template fetching. The template is being fetched the first time the user opens a modal and stored in a variable for later use. The content is returned as JSON from the server and is used to update the template before showing it to the user.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download