CODEWITHSUNDEEP
phpjqueryhtml
Leron
Leron

Reputation: 9886

Retrieving data with jQuery from .php file

I'm playing with some scripts, here is what I have:

<!doctype html>
<html>
<head>
    <title>Home page</title>
    <link rel="shortcut icon" href="/images/favicon.ico" />
    <link rel="icon" href="/images/favicon.ico" type="image/x-icon" />
            <link rel="stylesheet" href="/css/base.css" type="text/css" media="all" />
            <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" type="text/css" media="all" />
            <link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
            <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js" type="text/javascript"></script>
            <script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
            <script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/minified/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>


    <script type="text/javascript">
        function get() {
            $.post('data.php',
                function(output) {
                    $('#container').html(output).show();
            });
    </script>
</head>
<body>

    <script>
    $(function() {
        $( "#tabs" ).tabs();
    });
    </script>
<div class="demo">

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Статии</a></li>
        <li><a href="#tabs-2">Коментари</a></li>
        <li><a href="#tabs-3">Европа</a></li>
        <li><a href="#tabs-4">Свят</a></li>
    </ul>
    <div id="tabs-1">
        <a id="BB" onClick="get();">Тайният проект Бойко Борисов</a>

    </div>
    <div id="tabs-2">
        <p>Защо се изкупува земя от северозападна България</p>
    </div>
    <div id="tabs-3">
        <p>Бъдещето на Гърция</p>
    </div>
    <div id="tabs-4">
        <p>Мястото на САЩ е политиката на ЕС</p>
    </div>
</div>
<div id="container">

</div>
</body>
</html>

Later on I want to use the data.php file to connect to the database and extract data from there, but for now I just want to make it work for any data stored in data.php.

I use this script, where I think is the main problem:

<script type="text/javascript">             
    function get() {
        $.post('data.php',              
        function(output) {                          
            $('#container').html(output).show();                    
    });        
</script>

and I want to place the data in <div id="container></div>

The final idea is to load the links from the menu in the container div, which I try to do like this:

<div id="tabs-1">
    <a id="BB" onClick="get();">Тайният проект Бойко Борисов</a>

In data.php I have just an echo "Hello world"; but nothing shows up when I click the link. I guess there is more than 1 problem but any help is appreciated.

Thanks, Leron.

Upvotes: 0

Views: 2797

Answers (1)

littlealien
littlealien

Reputation: 429

you should close get() function scope.

  function get() {
            $.post('data.php',
                function(output) {
                    $('#container').html(output).show();
            });
  }

you have just forgotten curly bracket.

$.post("test.php", { name: "John", time: "2pm" }, function (data) {} );

you can send post data like this.

You wanna select tag or wannaa send some data?

$('#BB').click(function() { get(); });

you can bind function to like the code above.

Is this you want?

Upvotes: 2

Related Questions