Alpha DevCon 2018
Results 1 to 5 of 5

Thread: Choice fields in grid with shared header

  1. #1
    Moderator Steve Wood's Avatar
    Real Name
    Steve Wood
    Join Date
    Nov 2003
    Location
    Bay Area, California
    Posts
    8,775

    Default Choice fields in grid with shared header

    How did I achieve this look where the five choice fields share a common header and are equally spaced in cells (obviously a table)? The layout is pretty easy, but how do I get each radio selection to feed back to the table upon Submit? This is in a web application in a Dialog component and using Data Binding.
    Attached Images Attached Images
    Steve Wood
    Join the ALPHA DEVELOPERS NETWORK
    There is no Cloud. It's just someone else's computer.
    Web - Mobile - Hosting - Products - Frameworks - Developer Resources
    AlphaToGo | IADN (100% Alpha Anywhere Websites)

  2. #2
    Moderator Peter.Greulich's Avatar
    Real Name
    Peter Greulich
    Join Date
    Apr 2000
    Location
    Boston, MA
    Posts
    11,501

    Default Re: Choice fields in grid with shared header

    Repeating section

  3. #3
    "Certified" Alphaholic kkfin's Avatar
    Real Name
    Kenneth
    Join Date
    Dec 2006
    Posts
    1,352

    Default Re: Choice fields in grid with shared header

    I don't use any components in my development with Alpha at the moment, but wanted to try this anyway.
    Here is my solution (without any style).

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript" src="javascript/A5jQuery.js"></script>
    <meta name="generator" content="Alpha Five HTML Editor Version 11 Build 3119-4055">
    <!-- must use in order to make XP Themes render -->
    <meta HTTP-EQUIV="MSThemeCompatible" content="Yes" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <title>Alpha1</title>
    <%a5
    jsarr = <<%a%
    one;0
    two;1
    three;2
    four;3
    five;4
    %a%
    dim answ as u
    answ.initialize("1;2","1","2",jsarr)
    dim req as P
    dim req.one as C = ""
    dim req.two as C = ""
    dim req.three as C = ""
    dim req.four as C = ""
    if variable_exists("request.variables.one") then
    req.one = request.variables.one
    end if
    if variable_exists("request.variables.two") then
    req.two = request.variables.two
    end if
    if variable_exists("request.variables.three") then
    req.three = request.variables.three
    end if
    if variable_exists("request.variables.four") then
    req.four = request.variables.four
    end if
    %>
    </head>
    <body>
    <%a5
    dim jstxt as C = <<%txt%
    <script type="text/javascript">
    jQuery(document).ready(function() {
    $('input:radio[name=one]:nth({answ.get(req.one)})').attr('checked',true);
    $('input:radio[name=two]:nth({answ.get(req.two)})').attr('checked',true);
    $('input:radio[name=three]:nth({answ.get(req.three)})').attr('checked',true);
    $('input:radio[name=four]:nth({answ.get(req.four)})').attr('checked',true);
    });
    </script>
    %txt%
    dim finaljs as P
    finaljs = compilestringtemplate(jstxt)
    response.write(finaljs.output())
    dim header[0] as P
    header[] = {"Question":"Question","None":"None","Minimal":"Minimal","Medium":"Medium","Heavy":"Heavy","Almost All":"Almost All"}
    dim row[0] as P
    row[] = {"rname":"one","Question":"Building Desktop \"Window GUI\" applications","None":"one","Minimal":"two","Medium":"three","Heavy":"four","Almost All":"five"}
    row[] = {"rname":"two","Question":"Building Web applications","None":"one","Minimal":"two","Medium":"three","Heavy":"four","Almost All":"five"}
    row[] = {"rname":"three","Question":"Building Mobile applications","None":"one","Minimal":"two","Medium":"three","Heavy":"four","Almost All":"five"}
    row[] = {"rname":"four","Question":"Providing Traing/Mentoring as an Alpha expert","None":"one","Minimal":"two","Medium":"three","Heavy":"four","Almost All":"five"}
    %>
    <form id="form1" method="POST" >
    <table width="90%" border="1" bordercolor="" bordercolorlight="" bordercolordark="" bgcolor="" cellpadding="0" cellspacing="0">
    <%a5
    dim htmlheader as C = <<%html%
    <tr>
    <td>{ds.data("Question")}</td>
    <td align="center">{ds.data("None")}</td>
    <td align="center">{ds.data("Minimal")}</td>
    <td align="center">{ds.data("Medium")}</td>
    <td align="center">{ds.data("Heavy")}</td>
    <td align="center">{ds.data("Almost All")}</td>
    </tr>
    <tr>
    %html%
    response.write(a5_mergedataintotemplate(htmlheader,header))
    dim htmlrows as C = <<%html%
    <td>{ds.data("Question")}</td>
    <td align="center"><input type="radio"  id="c1" name="{ds.data("rname")}" value="{urlencode(ds.data("None"))}"></td>
    <td align="center"><input type="radio"  id="c2" name="{ds.data("rname")}" value="{urlencode(ds.data("Minimal"))}"></td>
    <td align="center"><input type="radio"  id="c3" name="{ds.data("rname")}" value="{urlencode(ds.data("Medium"))}"></td>
    <td align="center"><input type="radio"  id="c4" name="{ds.data("rname")}" value="{urlencode(ds.data("Heavy"))}"></td>
    <td align="center"><input type="radio"  id="c5" name="{ds.data("rname")}" value="{urlencode(ds.data("Almost All"))}"></td>
    </tr>
    %html%
    response.write(a5_mergedataintotemplate(htmlrows,row))
    %>
    </table>
    <input id="alpha" type="submit" value="Submit"><input type="reset" value="Reset">
    </form>
    </body></html>
    Edit: This has been done v11 alpha 3119-4055 and those who wonder why row array has properties like "none":"one" and not "none":"1" this is because this syntax was not possible in this build.
    Last edited by kkfin; 12-21-2012 at 10:35 AM. Reason: added edit

  4. #4
    Moderator Steve Wood's Avatar
    Real Name
    Steve Wood
    Join Date
    Nov 2003
    Location
    Bay Area, California
    Posts
    8,775

    Default Re: Choice fields in grid with shared header

    Ken, does that actually save the form-entries to a database table?

    Alpha does not have the ability to use common header for multiple choice fields, like in my original post image. I wanted the dialog to save the results to table but wanted the common header rather than repeating the titles for each and every choice field. So I built a normal dialog with normal choice field, but made all of them hidden. Then I added a Free-form container with the same choice fields reorganized the way I wanted. I was happy to see that even though my choice fields were hidden, they took the user-entered value from the Free-form container, and applied the entry to the database. The dialog is attached.
    Attached Files Attached Files
    Steve Wood
    Join the ALPHA DEVELOPERS NETWORK
    There is no Cloud. It's just someone else's computer.
    Web - Mobile - Hosting - Products - Frameworks - Developer Resources
    AlphaToGo | IADN (100% Alpha Anywhere Websites)

  5. #5
    "Certified" Alphaholic kkfin's Avatar
    Real Name
    Kenneth
    Join Date
    Dec 2006
    Posts
    1,352

    Default Re: Choice fields in grid with shared header

    The form entries are posted back so they can saved easily. And you can reuse result afterwords to show situation in original table (like I do in post(back)).

Similar Threads

  1. Only allow one choice in lookup grid for date/time
    By gregincolumbus in forum Application Server Version 11 - Web/Browser Applications
    Replies: 3
    Last Post: 01-17-2013, 05:57 PM
  2. Is there a way to keep fields together in a container inside a report group header?
    By Delta Force in forum Application Server Version 11 - Web/Browser Applications
    Replies: 3
    Last Post: 12-06-2012, 03:42 PM
  3. Is lookup the right choice to select & fill fields with 2 fields
    By MikeData in forum Alpha Five Version 9 - Desktop Applications
    Replies: 13
    Last Post: 01-10-2009, 04:21 PM
  4. Find by Key now missing choice of fields
    By rweiss in forum Alpha Five Version 8
    Replies: 16
    Last Post: 11-05-2008, 10:11 AM
  5. Choice fields - Add to List option no different
    By Steve Wood in forum Web Application Server v7
    Replies: 1
    Last Post: 06-20-2006, 05:26 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •