PDA

View Full Version : Touch, calling and including PHP.



lammie1971
24 Dec 2010, 10:28 AM
Hi, I am in the process of attempting to write my first Web App with JQTouch. As part of the App I need to query a MySQL database. This would then return a and append the necessary
with its output.

The output is generated via an echo statement that includes the link to the relevant content in the page.

At this point everyting works fine. The problem arises that handlers that are generated from the PHP page do not get activated and events such as the slide, cube etc do not work. All the links do is reload the page - resulting in the main menu being shown (first div).

Each item in the list should call a handler that is in the original HTML file.

If I hand-code the same code into the HTML file the code works fine but loading it from the PHP file results in the correct listing but no outputs, eg. wrong swipe, do not call the scripts. As this information is frequenlty updated it needs to be dynamic.

Can anyone help me? :-/

AndreaCammarata
25 Dec 2010, 5:13 AM
Could you provide additional details posting the code you are trying to use?
It's a little bit hard to help you if we are not able to see what are you missing ;)

lammie1971
26 Dec 2010, 7:03 AM
Hi thanks for taking the time to reply.

I have included the code I am trying to use and what happens at each stage.

Basically on the main page I have This Code:

1).

Basically from the main menu I have, this code:

<div id="home">
<div class="toolbar">
<h1>XYZ</h1>
</div>
<ul class="rounded">
<li class="forward blur1"><a href="#current">Players</a></li>
</ul>
</div>

When this is selected it invoke this callback.

$(function(){
$('#home .blur1').click(function(){

$.ajax({
type: "GET",
url: "scripts/players.php?id=1",

dataType: "html",

success:function(html){
$('#players').empty();
$('#players').prepend(html);
}
});

});
});

<!-- This div contains the results from the PHP Script -->

<div id="current">
<ul class="rounded" id="players">
<li class="forward blur3"></li>
</ul>
</div>

<!-- This div will show details of the person selected -->
<div id="profiles">
<div class="toolbar">
<h1>Player Profile</h1>
<a href="#" class="back">Back</a>
</div>
<ul id="output" class="rounded">loading ...</ul>
</div>



This is the PHP Code I call when the players option is called:





<?php do { ?>
<?php echo '<li class="forward" ><a href="#profiles">'. $row_players['playerForename'] . ' ' . $row_players['playerSurname'] . '</a></li>' ?>
<?php } while ($row_players = mysql_fetch_assoc($players)); ?>



This then populates the Current List.

From this list I want to be able to extract the players surname, before loading the profile of that player and moving on to the Profiles <div>

But here in lies my problem how do I invoke the call from this list and how should my PHP be ammended?

Many Thanks,
Paul.

AndreaCammarata
26 Dec 2010, 3:35 PM
If I correctly understand what are you trying to do you should edit your php code to make you return the players list in the something like:



<?php do { ?>
<?php echo '<li class="forward" ><a href="#profiles" onclick="loadPlayerProfile(" . $row_players['playerID'] . ")
;">'. $row_players['playerForename'] . ' ' . $row_players['playerSurname'] . '</a></li>' ?>
<?php } while ($row_players = mysql_fetch_assoc($players)); ?

Then in your html page you should add the "loadPlayerProfile" function:



...
function loadPlayerProfile(playerID){
$.ajax({
type: "GET",
url: "scripts/players.php?id=" + playerID,
dataType: "html",
success:function(html){
$('#players').empty();
$('#players').prepend(html);
}
}}}
...


This should able you to load the player profile by clicking on the link you generate from the php script.
Hope this helps.

lammie1971
27 Dec 2010, 4:47 AM
Thanks for the reply. I have tried it this morning and it works - a million thanks, especially at giving your time at this busy time.

One other thing I can't get my head around is how I would then get the id of a list item as each item in a list will have a separate numerical value that will in then import that person's profile.


<?php echo '<li class="forward" id="'. $row_players['playerID'] .'">
<a href="#profiles" onclick="loadPlayerProfile(' . $row_players['playerID'] .
');">'. $row_players['playerForename'] . ' ' . $row_players['playerSurname'] . '</a></li>' ?>

I know once I have that worked out I can develop the rest of the app without any problems (fingers crossed!).

Thanks again,
Paul.

AndreaCammarata
27 Dec 2010, 10:26 AM
No problem lammie, I'm glad to help ;).
About the new problem you are trying to solve, I'm not sure I have correctly understood what you are you trying to do.
Could you explain it with a little bit more details?

lammie1971
27 Dec 2010, 11:10 AM
Thanks for your reply, I have sorted the problem now. I was kind of trying to use a sledgehammer to crack a nut!

One other thing, in the code to call the id it uses onClick in the PHP Code:



<?php echo '<li class="forward" id="'. $row_players['playerID'] .'">
<a href="#profiles" onclick="loadPlayerProfile(' . $row_players['playerID'] .
');">'. $row_players['playerForename'] . ' ' . $row_players['playerSurname'] . '</a></li>' ?>

Is it ok to use the onclick event handler for iPhone webapps?

Thanks once again,
Lammie.

AndreaCammarata
27 Dec 2010, 11:21 AM
To be honest I think this is not the best approach to Sencha Touch.
The html / javascript you posted is too much, as to say...only simple javascript called from a php echo.
To take the best from Sencha framework you should use Sencha components like List, DataView, Carousels and much more.
I really suggest you to take a deep look at the online examples (http://dev.sencha.com/deploy/touch/examples/) to really understand what Sencha offers in terms of innovation and then you will decide what "development street" best fit to your needs.
I really suggest you to even take a look at the API docs (http://dev.sencha.com/deploy/touch/docs/), because that's the starting point where everyone starts to develop with Sencha Touch and Ext.

Hope this helps