Tell me more ×
Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. It's 100% free, no registration required.
up vote 2 down vote favorite

I made an application in EXTJS, but my technical architect and project manager say we don't want big file, so removed the EXTJS and made in object oriented PHP and JavaScript code, mixing HTML with PHP.

But I don't want to mix HTML and PHP because of bad coding structure and bad coding practice.

What should i do?

share|improve this question
1  
You need to (a) put a decent question at the top of the post and (b) use proper punctuation (capital letters, and the like). – Frank Shearar Mar 25 '11 at 9:21
Have you found your answer? If yes, you should select which answer solved you problem. – Steven Mar 29 '11 at 19:12

5 Answers

up vote 2 down vote accepted

You will always have to mix HTML and PHP. Otherwise, how will you fetch dynamic data?

This is how I do it. Let's assume this is index.php file:

<?php
  include_once('some.file.php'); // Here you have general functions, classes etc. 
  $result = getSomeResult();
?>

<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js?ver=1.4.3" type="text/javascript"></script>
  <script src="js/some_js_script.js"  type="text/javascript"></script>
</head>
<body>
  Let's output some data gotten from PHP: <br />
  <? echo $result;?>
</body>
</html>

Now, let's assume the result data is a text box with a button. Clicking this button, you trigger a JSON or EXTJS call. This call will load some more data based on the parameters you pass in. We call this file java.js:

jQuery('#button').click(function(){
        jQuery.post("http://yoursite.com/include/jquery.php", { var1: 'some value', var2 : 'some more value'},
        function(data)
        {
            jQuery('#text_box').html("new content: " + data);
        },"json");  
});

And as Evan says, load libraries from Google rather than from local server. This will speed up loading time.

You should also have a look at Wordpress if you are in need of using a CMS / templates.

share|improve this answer
up vote 2 down vote

It seems that you're looking for template engines, which enables you to have separate PHP and HTML, being able to modify one without modifying another.

share|improve this answer
up vote 1 down vote

You could make the php separately and just require xxxxx.php and only thread your HTML with a few function calls here and there 

<html>
<head>....</head>
<body>
  some text<hr>
  <? callPosts(); ?>
  <hr>more text
</body>
</html>

It really isn't too bad to mix in a bit of PHP especially on simpler sites. You could check out NOLOH, it is fairly lightweight. Then you wont even mess with HTML and they can probably still get the result they want.

share|improve this answer
up vote 1 down vote

Use the Google Libraries API to load ExtJS

You don't need to host libraries like ExtJS or jQuery anymore because Google will for you.

The benefit of this are:

  • Lots of sites use this service so, when your page requests the library chances are that it's already in the webcache on the clients computer anyway

  • Because the library is hosted on a domain other than the one your site is on, the browser will allocate another more download slots (IE has a 2 slot max per domain if I remember). This means that you get virtually no degraded performance during page loads (except overall bandwidth usage) when you use libraries like ExtJS and jQuery.

  • You no longer need to host the library on your servers (which defeats your architects argument)

Chances are... if your technical lead is worried about the added size of extjs he probably doesn't know much about optimizing website for performance as using Google Libraries to host common APIs for web development is a pretty common. Any competent webapp architect should know about it by now.

Update:

For directions on how to use the API, read this first.

share|improve this answer
i included this in script tag ajax.googleapis.com/ajax/libs/ext-core/3.1.0/ext-core.js but the error is ocming showing that Ext is not defined – WebDev Mar 25 '11 at 9:13
It's not quite that simple. You need to sign up for a key first (it's free, they just use it to track for errors), then you need to load the Google Libraries API with, "<script type="text/javascript" src="google.com/jsapi?key=INSERT-YOUR-KEY"></…; then you load the library with "google.load("ext-core", "3.1.0");" within the <script> block. Follow the link in my update for more detailed instructions. – Evan Plaice Mar 25 '11 at 9:21
can't i do it on my local server ? – WebDev Mar 25 '11 at 9:22
@Rahul You'll need an internet connection to use it but otherwise, yes you can use it on your local server. – Evan Plaice Mar 25 '11 at 9:23
then for key what the url i need to give ? – WebDev Mar 25 '11 at 9:24
show 14 more comments
up vote 0 down vote

ExtJS, jQuery, Javascript code etc should be in their own files. What I do is create HTML with a template package like Smarty. Data gets passed between PHP and ExtJS via ajax class sending data normally in JSON format (though You can use XML if you like).

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.