Contact Form DB
[Plugin: Contact Form 7 to Database Extension] Leveraging Data (8 posts)

  1. pmagony
    Posted 5 years ago #


    First, hats off to the developer of this plugin. It's intelligently put together and extremely well documented. Kudos for going above and beyond.

    I'm wondering if someone can tell me how I can leverage the individual values of each row using CFDB-VALUE shortcode, to enhance the layout of my page?

    In short, I would like to move away from the standard table layout, and have specific data appear in predetermined DIVs of my choosing for styling purposes.

    The issue I am running into is the "repeating" (repeating rows) of the data. Here is the layout I am seeking, but I would like for the STORY_WRAP to be repeated rather than the value within div as is happening now. The goal is to have each DIV with the class STORY_WRAP represent one row of data from the DB table. Hope this makes sense!

    <div class="story_wrap">
        <div class="story_body">
           <p>[cfdb-value form="Personal Stories" show="your-name"] ([cfdb-value form="Personal Stories" show="your-condition"])</p>
           <div>[cfdb-value form="Personal Stories" show="your-story"]</div>

    Any insight is greatly appreciated.

  2. Michael Simpson
    Plugin Author

    Posted 5 years ago #

    I think the way to accomplish this is to use the [cfdb-json] tag to dump the data into a Javascript variable and include your own Javascript code to read that and create the HTML you want.

  3. pmagony
    Posted 5 years ago #

    Thanks Michael, do you have any links to point me to that may help to get me started? I have not worked with JSON.

  4. Michael Simpson
    Plugin Author

    Posted 5 years ago #

    JSON is just a simple way of describing data in a JavaScript object. If you know some Javascript you don't have to worry about this JSON thing. Read through the page on [cfdb-json] to show you what it outputs.

    You would want to do something like this:

    [cfdb-json var="mydata" form="Personal Stories" show="your-name,your-condition,your-story"]
    <script type="text/javascript" language="JavaScript">
        for(var i=0; i<mydata.length; i++) {
         document.write('<div class="story_wrap">');
         document.write('    <div class="story_body">');
         document.write('       <p>' + mydata[i]['your-name'] + ' (' +  mydata[i]['your-condition'] + ')</p>');
         document.write('       <div>' + mydata[i]['your-story']  + '</div>');
         document.write('     </div>');
  5. pmagony
    Posted 5 years ago #

    Thanks Brother, I got it to work. JSON is cool. Happy St. Patrick's Day to you.

    For other readers reading this thread, make sure you store your JavaScript in a .js file of its own and then call it in through the post/page. You can't dump the JS directly into the post/page.

  6. Michael Simpson
    Plugin Author

    Posted 5 years ago #

    I know you got this to work, but having thought about this, I created a new shortcode to do this without the javascript. It is available in version 1.8. [cfdb-html]

  7. pmagony
    Posted 5 years ago #


  8. pmagony
    Posted 5 years ago #

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Contact Form DB
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic