CCv5 and CFv5 in the same page

bcouvin 17 Dec, 2015
Hello,

I would like to know if there is any solution to have CCv5 and CFv5 in the same page.
My use case is: when I click on the listing item in CCv5, I can fill data into the CFv5 form which is positionned just below the listing and submit it.

The form is not the one which is used to build the listing.

The solution based on a modal window is not the best one for my case, because I need to use in parallel different tools in my web page. I prefer not to leave the current page.

I saw some considerations in the forum, but no real explicite description.
So, If I used 2 plugins CCv5 and CFv5 in an article, how could I pass the values from a selected row of my listing to my form?

Thank in advance,
Bertrand
GreyHead 18 Dec, 2015
Answer
Hi Bertrand,

I think you can do this by placing the form in a module under the listing then writing JavaScript to transfer focus to the form when you click a link. The script would then probably need to do an Ajax call to get the data to populate the form (though I guess it could also pull it from the listing if all the data is there and well enough identified.

Bob
bcouvin 18 Dec, 2015
Hi Bob,

If I understood what you meant, as I am not familiar with different features in CCv5, please let me know if I am wrong about my understanding on different steps to achieve my goal:

1- Front List > Settings > Column List > add "_Edit_:Edit"

2- Front List > Actions > Action > From Event > Null ; Front List > Actions > Action > From Event > Code. This Code field should be in Javascript with Ajax Call and php code for processing.

3- Questions on this step:
[list]
(a)-How could I get the ID of the row I just selected and how to do that? Do you have an example for this?
(b)-How to tell CFv5 (handled by a module) that this form is for this ID? I think that if I got the ID of the selected row, I can process this step.
[/list]
I was looking an example in this forum, but I did not find it.

Thanks in advance for your advice.

Bertrand
GreyHead 18 Dec, 2015
Hi Bertrand,

The id of the current row is usually in the $row data - typically as id or cf_id. If you use the built in edit or view links then CC adds it to the link as e,g, &gcb=999

Bob
bcouvin 19 Dec, 2015
Hi Bob,

The View and Edit links open a form in the current window. Is there a possibility to keep this listing when I click on the row?

Bertrand
GreyHead 20 Dec, 2015
HI Bertrand,

Probably you could manually build a link with a target set to new window. But note that you'd need to refresh the listing somehow to show any changes.

Bob
bcouvin 20 Dec, 2015
Hi Bob,

I just set up CCv5 and CFv5 in the same page, and CFv5 as a module.

I have changed a little bit my initial method. In CCv5, I add for each row a button. And when I click on the button, this has to send to server the id of the row. The php code runs its processes and sends back values in CFv5.

I made a small test to get a text file and send back to CFv5. That's work fine.
To make this test more complicated, I want to send the ID value when I select the row. My php code has to send back the id value in CFv5 cell.

My issue is that if I send the ID value (the row id) via parameter, php progra, the value is always the last one.

Here is my configuration:
Front List>Settings>Columns List> SelectRow:ProjectID
Front List>Settings>HTML>SelectRow:<input type="button" id="button_PTO_{PTO.id}" onclick="CallAjax()" value="{PTO.id}">
PTO is my Model, and PTO.id is the ID of my row. My button has the ID value, and each button has id related to the row (button_PTO_1, button_PTO_2, button_PTO_3...)

Here is my js script:

function CallAjax()
{ 
  var xhr=XMLHttpRequest()();
  xhr.open("POST", "myphp.php",true);
  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  xhr.onreadystatechange=function()
  { 
    if(xhr.readyState == 4)
    {
      document.getElementById("YourText").innerHTML= xhr.responseText;	
    } 
  }; 
  xhr.send("ID="+ {PTO.id});
}
</script>


This script is just after the line <input type="button" id="button_PTO_{PTO.id}" onclick="CallAjax()" value="{PTO.id}"> without line break.
This script writes back the results of myphp.php code in the "YourText" cell id which belongs to CFv5.

Here is my php code:

<?php
echo $_POST['ID'];
?>


My pb is that if I had 4 rows, the value of $_POST['ID'] is 4, even I selected the first row.

Do you have an idea what's wrong with that?

Thanks for you help.

Bertrand
GreyHead 21 Dec, 2015
1 Likes
Hi Bertrand,

Please see my reply to your other post with a very similar question.

Bob
This topic is locked and no more replies can be posted.