bootstrap accordion-menu

bootstrap accordion-menu  架構

參考網站：http://kkbruce.tw/Bootstrap/JavaScript#collapse

<div class="accordion" id="menu_block_1">
 <div class="accordion-group">
  <div class="accordion-heading">
    <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#menu_block_1" href="#menu_sn_1">伸縮選單1</a>
  </div>
  <div id="menu_sn_1" class="accordion-body in collapse">
   <div class="accordion-inner">
            <ul>
                <li>第一層21</li>
                <li>第一層22</li>
                <li>第一層2</li>
            </ul>
   </div>
  </div>
 </div>
 <div class="accordion-group">
  <div class="accordion-heading">
    <a class="accordion-toggle" data-toggle="collapse" data-parent="#menu_block_1" href="#menu_sn_2">伸縮選單2</a>
  </div>
  <div id="menu_sn_2" class="accordion-body in collapse">
   <div class="accordion-inner">
            <ul>
                <li>第一層21</li>
                <li>第一層22</li>
                <li>第一層2</li>
            </ul>
   </div>
  </div>
 </div>
</div>

AJAX JQUERY

範例網址：http://www.tad0616.net/modules/tad_book3/page.php?tbdsn=746

ajax_utility.php

<?php
include_once "header.php";
$market_sn=$_REQUEST['market_sn'];
echo get_market_fill($market_sn);
?>

這裡直返回「填發人員」
js

  <script>
    //開啟表單時
    $(document).ready(function(){
   //由市場決定填發人員
   $.post('ajax_utility.php' , {market_sn:$('#market_sn').val()}, 
        function(data){
          $('#fill').val(data); 
      });
      //市場改變，填發人員改變
      $('#market_sn').change(function(){
        $.post('ajax_utility.php' , {market_sn: $('#market_sn').val()}, 
            function(data){
              $('#fill').val(data); //排序             
         });    
      });
      //自動抓取年度
      $('#limit_year').val($('#year').val()); //年度 
      $('#year').change(function(){
        $('#limit_year').val($('#year').val()); //年度       
      });
      //自動抓取月份
      $('#limit_month').val($('#month').val()); //月份 
      $('#month').change(function(){
        $('#limit_month').val($('#month').val()); //月份       
      });
    });
  </script>

取得值：

$('#market_sn').val()

寫入值：

$('#fill').val(data);

 jQuery的.val ()方法

1. $('#menu1').val()可以取得id="menu1"的網頁元件的值。
2. $('#menu1').val('xxx')可以設定id="menu1"的網頁元件的值。

html

<select name='market_sn' size=1 id='market_sn'>{$market_select_option}</select>

<input type='text' name='fill' size='5' value='' id='fill' >

保留修改報名表單的網址

1.報名完成後，按「修改回覆內容」

2.請將「網址」，反白->複製->保存。若有需要修改時，則把網址貼至「網址列」即可修改

模組開發物件

按鈕

$add_button="<a href='{$_SERVER['PHP_SELF']}?op=ugm_market_hire_form'  class='Button'><span>按鈕</span></a>";

固定表格

<table border='0' cellspacing='3' cellpadding='3' id='ugm_tb' style='word-wrap:break-word; word-break:break-all;table-layout:fixed;'>

 表單

<td><input type='text' name='hier[{$sn}][userfees]'  value='{$userfees}' id='userfees_{$sn}' class='validate[required,custom[integer]]' style='width:60px'></td>

<td><input type='text' name='hier[{$sn}][cleaningfees]'  value='{$cleaningfees}' id='cleaningfees_{$sn}' class='validate[required,custom[integer]]' style='width:60px'></td>

<td><input type='text' name='hier[{$sn}][delayfees]'  value='{$delayfees}' id='delayfees_{$sn}' class='validate[custom[integer]]' style='width:60px'></td>

<td><input type='text' name='hier[{$sn}][ps]'  value='{$ps}' id='ps_{$sn}'  style='width:140px'></td>

接收

foreach ($_REQUEST['hier']  as $sn => $data){
    foreach ($data  as $k => $v){
      //以下會產生這些變數：  $userfees, $cleaningfees,$delayfees,$ps
      $$k=$v;
    }
    echo $sn."<br>";
    echo $userfees."<br>";
    echo $cleaningfees."<br>";
    echo $delayfees."<br>";
    echo $ps."<br>";
    die();
 }

2.

$last_button="上一步";