Alien-GvaScript

 view release on metacpan or  search on metacpan

doc/html/Grid.html  view on Meta::CPAN

<html>
<head>
  <script src="../../lib/Alien/GvaScript/lib/prototype.js"></script>
  <script src="../../lib/Alien/GvaScript/lib/GvaScript.js"></script>
  <link href="GvaScript_doc.css" rel="stylesheet" type="text/css">
  <script>
    document.observe('dom:loaded', function() { new GvaScript.TreeNavigator('TN_tree'); });
    function jumpto_href(event) {
      var label = event.controller.label(event.target);
      if (label && label.tagName == "A") {
        label.focus();
        return Event.stopNone;
      }
    }
  </script>
</head>
<body>
<div id='TN_tree'>
  <div class="TN_node">
   <h1 class="TN_label">Alien::GvaScript::Grid</h1>
   <div class="TN_content">
     <p><em>ChoiceList based Grid with Pagination
</em></p>
     <div class="TN_node"  onPing="jumpto_href">
       <h3 class="TN_label">Table of contents</h3>
       <div class="TN_content">
         <div class="TN_leaf">
  <a class="TN_label" href="#NAME">NAME</a>
  <div class="TN_content"></div>
</div>
<div class="TN_leaf">
  <a class="TN_label" href="#SYNOPSIS">SYNOPSIS</a>
  <div class="TN_content"></div>
</div>
<div class="TN_node">
  <a class="TN_label" href="#DESCRIPTION">DESCRIPTION</a>
  <div class="TN_content"><div class="TN_node">
  <a class="TN_label" href="#GvaScript_Grids">GvaScript.Grids</a>
  <div class="TN_content"><div class="TN_leaf">
  <a class="TN_label" href="#GvaScript_Grids_get_id_">GvaScript.Grids.get(id)</a>
  <div class="TN_content"></div>
</div>
</div>
</div>
</div>
</div>
<div class="TN_node">
  <a class="TN_label" href="#BEHAVIOUR">BEHAVIOUR</a>
  <div class="TN_content"><div class="TN_leaf">
  <a class="TN_label" href="#Grid_Navigation_Behaviour">Grid Navigation Behaviour</a>
  <div class="TN_content"></div>
</div>
</div>
</div>
<div class="TN_leaf">
  <a class="TN_label" href="#JSON_Datasource">JSON Datasource</a>
  <div class="TN_content"></div>
</div>
<div class="TN_node">
  <a class="TN_label" href="#CONSTRUCTOR">CONSTRUCTOR</a>
  <div class="TN_content"><div class="TN_leaf">
  <a class="TN_label" href="#id">id</a>
  <div class="TN_content"></div>
</div>
<div class="TN_leaf">

doc/html/Grid.html  view on Meta::CPAN

        {'fname': 'Mary',    'lname': 'Major',  'gender': 'f'},
        {'fname': 'Richard', 'lname': 'Miles',  'gender': 'm'}
    ], 
    'total'  : 15,
    'rights' : {
        can_create : 0,
        can_update : 1,
        can_delete : 0
    }
  }</pre>


    </div>
  </div>
  <div class="TN_node" id="HTML">
    <h3 class="TN_label">HTML</h3>
    <div class="TN_content">
      <pre>  &lt;div id="ex_container"&gt;
     
   &lt;div tabindex="0" id="ex_grid_list"&gt;
     &lt;table class="dmweb-grid"&gt;
       &lt;thead&gt;
         &lt;tr&gt;
           &lt;th class="grid-marker"&gt;&#xa0;&lt;/th&gt;
           &lt;th class="grid-header"&gt;Full Name&lt;/th&gt;
           &lt;th class="grid-header"&gt;Gender&lt;/th&gt;
        &lt;/tr&gt;
       &lt;/thead&gt;
       &lt;tbody&gt;
        &lt;tr id="ex_grid_list.CL_choice.0" class="CL_choiceItem liste_highlight"&gt;
           &lt;td class="grid-marker"&gt;&#xa0;&lt;/td&gt;
           &lt;td valign="top" class="grid-cell index_0"&gt;John Stiles&lt;/td&gt;
           &lt;td valign="top" class="grid-cell index_0 tcenter"&gt;m&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr id="ex_grid_list.CL_choice.1" class="CL_choiceItem"&gt;
           &lt;td class="grid-marker"&gt;&#xa0;&lt;/td&gt;
           &lt;td valign="top" class="grid-cell index_1"&gt;Mary Major&lt;/td&gt;
           &lt;td valign="top" class="grid-cell index_1 tcenter"&gt;f&lt;/td&gt;
        &lt;/tr&gt;
         &lt;tr id="ex_grid_list.CL_choice.3" class="CL_choiceItem"&gt;
           &lt;td class="grid-marker"&gt;&#xa0;&lt;/td&gt;
           &lt;td valign="top" class="grid-cell index_0"&gt;Richard Miles&lt;/td&gt;
           &lt;td valign="top" class="grid-cell index_0 tcenter"&gt;m&lt;/td&gt;
        &lt;/tr&gt;
      &lt;/tbody&gt;
    &lt;/table&gt;
   &lt;/div&gt;
  
   &lt;div id="ex_grid_toolbar" class="dmweb-grid-toolbar"&gt;
    &lt;div class="dmweb-paginatorbar"&gt;
      &lt;div title="Derni&#xe8;re page" class="last"&gt;&lt;/div&gt;
      &lt;div title="Page suivante" class="forward"&gt;&lt;/div&gt;
      &lt;div class="text"&gt;1 &#xe0; 3 de 15&lt;/div&gt;
      &lt;div title="Page pr&#xe9;c&#xe9;dente" class="back inactive"&gt;&lt;/div&gt;
      &lt;div title="Premi&#xe8;re page" class="first inactive"&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="dmweb-grid-actionsbar"&gt;
      &lt;span id="grid_id_btn_0" class="dmweb-btn-container"&gt;
        &lt;span class="left"/&gt;
        &lt;span class="center"&gt;
          &lt;button class="btn" style="width: auto;" type="button"&gt;Add&lt;/button&gt;
        &lt;/span&gt;
        &lt;span class="right"/&gt;
      &lt;/span&gt;
    &lt;/div&gt;
   &lt;/div&gt;
 
  &lt;/div&gt;</pre>


    </div>
  </div>
  <div class="TN_node" id="CSS">
    <h3 class="TN_label">CSS</h3>
    <div class="TN_content">
      <pre>  /* class given to grid list container when an AJAX request is being affected */
  .dmweb-loading {
    background:url(ajax_loading.gif) no-repeat center center;
    position:absolute;
    width:30px;height:30px;
    top:50%;left:50%;
  }

  /* grid toolbar */
  .dmweb-grid-toolbar {
    background:#C5CCE8 url(glass-bg-n.gif) repeat-x scroll left top;
    border:1px solid #A3BAD9;
    height:28px;
  }
  .dmweb-grid-actionsbar {float:left;}
  .dmweb-paginatorbar {float:right;width:250px;}
  .dmweb-paginatorbar div {width:16px;height:16px;cursor:pointer;float:right;}
  .dmweb-paginatorbar div.first {background:url(page-first.gif) no-repeat top center;}
  .dmweb-paginatorbar div.last {background:url(page-last.gif) no-repeat top center;}
  .dmweb-paginatorbar div.back {background:url(page-prev.gif) no-repeat top center;}
  .dmweb-paginatorbar div.forward {background:url(page-next.gif) no-repeat top center;}
  .dmweb-paginatorbar div.inactive {cursor:default;opacity:0.25;filter:alpha(opacity=25);}
  .dmweb-paginatorbar div.text {text-align:center;width:140px;color:#4b34c5;font-size:10pt;}
  .dmweb-paginatorbar span.dmweb-btn-container {display:block;margin-right:4px;}
  
  /* grid table */
  .dmweb-grid {width:100%;}
  .dmweb-grid th.grid-header {
    text-align:center;
    padding:2px;
    font-size:75%;
    color: #183E6C;
    background-color: #D0D6ED;
    border:1px solid #6F82A5;
  }
  .dmweb-grid td {font-size:75%;color:#183E6C;}
  .dmweb-grid .grid-marker {width:15px;background-color: #D0D6ED;border:1px solid #6F82A5;}
  .dmweb-grid tr.liste_highlight td.grid-marker {
    background: #D0D6ED url(selector.gif) no-repeat center center;
  }
  .dmweb-grid tr.liste_highlight td.grid-cell {background-color: #6F82A5 !important;color:#f5f5f5 !important;}
  .dmweb-grid td.grid-cell {padding:2px !important;border:1px solid #e8e8e8;}
  .dmweb-grid td.grid-cell.index_1 {background-color:#EFEFEF;}
  .dmweb-grid td.grid-cell.center {text-align:center;float:none;}
  .dmweb-grid td.grid-cell.right {text-align:right;float:none;}
  .dmweb-grid td.grid-cell.red {color:red;}</pre>



( run in 0.732 second using v1.01-cache-2.11-cpan-119454b85a5 )