Display form data on front end, with 'approved' flag

Bob, I'd like to use Chronoforms to make a Birth Announcement page. This would involve a table in the admin, with a 'display' checkbox for each row. If checked, that submission would appear on the public side of the site. Furthermore, I need to trigger different css styles (pink or blue) according to the selected gender in the form submission. Do you think it's worthwhile to do this with Chrono, or would I be better off with SobiPro?

Would ChronoConnectivity be able to provide the functionality I need?

Hi Greg R.,

You could create the listing with ChronoConnectivity and use a Checkbox or Binary (on/off) column to set the published status.

You could then use ChronoForms with the DB Multi-Record Loader to display one or a series of announcements using data read from the database table.

This needs a bit of coding but isn't too difficult to do in ChronoForms + ChronoConnectivity.

I don't know enough about SOBI to know what would be needed there.

Bob

Bob, I installed CC and made my test form. Getting a frontend view was no problem. The only issue is that if I use my status column to only show approved items in the frontend with the SQL (status = 1 in the where field) this also determines the admin view. How do I view all submissions in the admin, and only approved submissions in the frontend?

I didn't use a DB Multi-Record Loader at all yet. Is that the key?

Hi Greg,

I think I assumed that these were two separate listings, one for the admin and the other for the user. That's usually easier than trying to combine the two sets of requirements into one listing.

Bob

By a separate listing, do you mean a separate Connection in Chronoconnect?

Hi Greg,

Yes, or, if it's simple, a Data Displayer listing from the Db Multi-Record loader in a ChronoForm.

Bob

Bob, that's working, thanks! Now I have to format the displayed data on the front end, here are my questions:

How do I hide the # and CF_ID columns? - Edit, this is in a tab in the connection, found it.

Will submitted images display on the page? If not, can we add <img tags to make that happen? -Edit, this is in the body area wrapper for each record. I put <img src = htt//{babypic} and it worked.

Can I apply different CSS rules to each row based on one of the column values (gender:boy/girl)?

Can I template my own table layout for each row, so that the row is laid out more like an article or a member profile? -Edit, this is also in a tab, having to do with a body area for each record. I can put html in here wrapped around field names, which is good.

When I created a new table to update the fields, my submitted forms are only sending the field names instead of what I enter into them. How do I fix this? -Edit, I had to go into the form wizard, turn off data storage, turn it on again, and save the form. It's supposed to not be necessary with Chrono 4x, but it still had to be done.

So what I need now is a little bit of conditional php to do the following,

<span (if {gender} = Boy then class="blue" else class="pink"

echo "he" if {gender] = Boy else echo "she"

I'm assuming that the body field for each connection can handle php.

Hi Greg,

Yes the body box takes PHP. Something like this should do it:

<?php
if ( isset($row['gender']) && $row['gender'] == 'Boy' ) {
  $class = 'blue';
} else {
  $class = 'pink';
}
?>
. . . <span class='<?php echo $class; ?>' > . . . </span>

Bob

Fantastic, Bob! Here's what I have so far:

<div class="<?php
if ( isset($row['gender']) && $row['gender'] == '0' ) {
  echo 'blue';
} else {
  echo 'pink';
}
?>"><img src="components/com_chronoforms/uploads/birthannouncements/{babypic}" align="left" style="margin:12px;height:300px;" ><br>
<h1 style="font-family:Arial Black, Arial;font-size:32px;">{babyname}</h1><br>
 was born on {birthday} to <b>{bornto}</b>.  <?php
if ( isset($row['gender']) && $row['gender'] == '0' ) {
  echo 'He';
} else {
  echo 'She';
}
?> was {babyweight} and {babylength}
long. The proud grandparents are
{maternalgp} and {grandparentsp}.<br><br><i>{details}</i></div>

Two questions:

How do I get the image height dynamically and pass that height into the surrounding div, so that the following rows don't 'nest' or 'get stuck' with their upper left corners tucked behind each previous image?

Can we cause the image upload field to 'remember' its image location, so that if we edit the submissions on the back end, we don't have to re-upload the image every time? This would also be helpful on the front end if someone enters an incorrect captcha code.

Hi Greg,

I'd probably set a height for the row using CSS so that they all look even and then set max-height for the image. The browser should then re-size it to fit.

Or, another solution is to make a thumbnail image of the correct size when the picture is uploaded and use that in the table display.

Bob

Thanks Bob! Is there anything we can do to get the file upload field to remember the last uploaded file?

If it were possible, in the admin view to pass the path of the uploaded file into the field, that's what's important right now.

Hi Greg,

I'm sorry I don't understand the question?

A file upload input can never re-load the previous value because what is needed is a folder path on the User's machine and that information isn't ever available.

There is another thread (or maybe even a FAQ) somewhere here about making image records editable if that is what you need. You show a copy of the existing image with a 'delete this' checkbox and an empty file upload element to add a replacement image.

Bob

Bob, that sounds like exactly what I need. Can you help me find it?

Here it is: http://www.chronoengine.com/faqs/2666-how-can-i-edit-the-record-for-an-image.html

This should be just what I need, thanks again.