Help with AJAX and routing

[HarryB]

Hello everybody,

I am trying to both learn to use F3 and, eventually, to convert and existing application to use F3.

I have a form in which a dropdown list triggers an 'on change' event.  The event action code looks like this:

$(function() {

  $('#inits').change(function() {

var sel_play = $(this).val();

alert('You picked: ' + sel_play);

$.ajax({

type: 'GET',

       url: '/member/geteclectic',

dataType: 'json',

data: 'thePlayer=' + sel_play,

etc...

When a selection is made the 'You picked' alert is displayed correctly but the url is not accessed.  If I access the route url manually the code there runs.

I have tried just about every alternative in the presentation of the url that I can think of as I feel that this has to be the source of the problem.

Any suggestions will be greatly appreciated.

Harry

[dcs...@gmail.com]

Have you defined your route in F3 using the ajax directive? See below: 

https://fatfreeframework.com/3.6/routing-engine#AJAXandSynchronousRequests

--
-- You've received this message because you are subscribed to the Google Groups group. To post to this group, send an email to f3-fra...@googlegroups.com. To unsubscribe from this group, send an email to f3-framework...@googlegroups.com. For more options, visit this group at https://groups.google.com/d/forum/f3-framework?hl=en
---
You received this message because you are subscribed to the Google Groups "Fat-Free Framework" group.
To unsubscribe from this group and stop receiving emails from it, send an email to f3-framework...@googlegroups.com.
To post to this group, send email to f3-fra...@googlegroups.com.
Visit this group at https://groups.google.com/group/f3-framework.
To view this discussion on the web visit https://groups.google.com/d/msgid/f3-framework/17850e16-b53c-4920-bebe-ccc8a21e985f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[HarryB]

Hi there,

No I hadn't but I made the edit and it made no difference to the result.

This is the form of my route just in case I haven't read the  manual correctly:

GET /member/geteclectic [ajax] = MemberController->geteclectic

Thanks for your assistance so far.

Harry

PS.  Adding that also trashed the manual call to the route.  H

PPS.  That's probably because the manual call is not an AJAX call.  However further consideration of the documentation seems to suggest that the extra [ajax] notation is only required if you want to have a different action depending on the type of call.  Correct me if I am wrong.  H

[ikkez]

open the dev tools in your browser and see what's url is requested from the server while making the ajax call. I'll help to find wrong paths and such issues.

[HarryB]

Hi ikkez,

http://localfatfree/member/geteclectic?thePlayer=HUNM

This is the path that is passed. which would seem to be correct.  The intention is that thePlayer code being passed will be used for a WHERE clause in a mySQL query.  I have a 'trap' set at the start the target code block but nothing eventuates.  If I call the code block directly '.../member/geteclectic'  the trap works just fine.

Does this help?

Harry

[dcs...@gmail.com]

This may be more of a juery issue. How are you handling the return data? I would try writing to the console log and see what you are actually getting back. That would help narrow it down to server vs client issue.

On Sun, Jun 24, 2018, 12:16 AM HarryB via Fat-Free Framework <f3-framework+APn2wQcNpcB9OLPbMlp...@googlegroups.com> wrote:

Hi there,

No I hadn't but I made the edit and it made no difference to the result.

This is the form of my route just in case I haven't read the  manual correctly:

GET /member/geteclectic [ajax] = MemberController->geteclectic

Thanks for your assistance so far.

Harry

On Sunday, 24 June 2018 12:12:38 UTC+10, HarryB wrote:

Hello everybody,

I am trying to both learn to use F3 and, eventually, to convert and existing application to use F3.

I have a form in which a dropdown list triggers an 'on change' event.  The event action code looks like this:

$(function() {

  $('#inits').change(function() {

var sel_play = $(this).val();

alert('You picked: ' + sel_play);

$.ajax({

type: 'GET',

       url: '/member/geteclectic',

dataType: 'json',

data: 'thePlayer=' + sel_play,

etc...

When a selection is made the 'You picked' alert is displayed correctly but the url is not accessed.  If I access the route url manually the code there runs.

I have tried just about every alternative in the presentation of the url that I can think of as I feel that this has to be the source of the problem.

Any suggestions will be greatly appreciated.

Harry

--
-- You've received this message because you are subscribed to the Google Groups group. To post to this group, send an email to f3-fra...@googlegroups.com. To unsubscribe from this group, send an email to f3-framework...@googlegroups.com. For more options, visit this group at https://groups.google.com/d/forum/f3-framework?hl=en
---
You received this message because you are subscribed to the Google Groups "Fat-Free Framework" group.
To unsubscribe from this group and stop receiving emails from it, send an email to f3-framework...@googlegroups.com.
To post to this group, send email to f3-fra...@googlegroups.com.
Visit this group at https://groups.google.com/group/f3-framework.

To view this discussion on the web visit https://groups.google.com/d/msgid/f3-framework/477f661a-ee01-478a-bd9e-959f70a62da2%40googlegroups.com.

[Nuwanda]

What's happening in your javascript console? Errors?

What does the $.ajax .fail method show?

Remove AJAX from the route definition. What do you get now?

Reset. Go back to a very simple request and response. Call a route that echoes a string. Then try to get that via ajax. That'll probably reveal where you're going wrong.

[HarryB]

Hello Nuwanda and everybody,

Just to let you know I have made some progress.  Part of the problem was down to an oversight of mine when I translated the form from its previous incarnation into the F3 environment and i neglected to add the form name parameter and so the jquery was not knowing where to go.  Thanks to ikkez for alerting me to other areas to investigate in the developers tools.

So, I am now seeing the JSON object but for some reason it is surrounded by square brackets viz.

[{"1st":"4","2nd":"5","3rd":"4","4th":"3","5th":"3","6th":"5","7th":"3","8th":"4","9th":"3","10th":"4","11th":"4","12th":"3","13th":"3","14th":"3","15th":"2","16th":"3","17th":"3","18th":"3"}]

This is throwing a curve ball at the data processing in the success function.  Any ideas on where these might be coming from?

Thanks again for your assistance so far.

Harry

[bcosca]

Without any idea about how MemberController->geteclectic sends its output, we can only imagine that it sends an array, i.e. json_decode($var,true).

Solution: drop the 2nd arg.

[HarryB]

Hi guys,

Sorry to be so dense.

Here is the code for geteclectic:

public function geteclectic()

{

$inits = $_GET['thePlayer'];

$test = new Member($this->db);

$this->f3->set('eclecs',$test->getEclectic($inits));

$data = $this->f3->get('eclecs');

$json = array();

foreach ($data as $row){

$item = array();

foreach ($row as $key => $value){

$item[$key] = $value;

}

array_push ($json, $item);

}

echo json_encode($json);

exit;

}

I have tried it as it stands and also without the foreach loop and substituting $data in the json_encode but to no avail.

Not sure whether this is relevant but, in the original source application mySQL query, the fetch included PDO::FETCH_OBJECT directive.

harry

[HarryB]

Hello everybody,

I finally realised that the code I was using before the json_encode was simply reproducing the original array and that is why both methods were producing the same result.  As the query only produces a single row from the mySQL table all I needed to do was convert the multidimensional array (with only one record) into a simple associative array and, hey presto, the json object was fine and the success function worked as expected.

Now to press on with the other 'problems'.  You may very well hear from me again but perhaps I will have to start another thread.

Thank you for your suggestions.  They have helped to prod me in the right direction and hopefully I can be a little more self-reliant from now on.

Regards

Harry

On Sunday, 24 June 2018 12:12:38 UTC+10, HarryB wrote: