AppML စာရင်းများ


ဤအခန်းတွင်၊ ကျွန်ုပ်တို့သည် ဒေတာဘေ့စ်တစ်ခုမှ မှတ်တမ်းများကို စာရင်းပြုစုပါမည်။


ဤစာမျက်နှာရှိ နမူနာများသည် ဒေသတွင်း SQL ဒေတာဘေ့စ်ကို အသုံးပြုသည်။
Local SQL databases များသည် IE သို့မဟုတ် Firefox တွင် အလုပ်မလုပ်ပါ။ Chrome သို့မဟုတ် Safari ကိုသုံးပါ။

မော်ဒယ်အသစ်ဖန်တီးပါ။

ယခင်အခန်းတွင်၊ သင်သည် ဒေတာဘေ့စ်တစ်ခုဖန်တီးရန် မော်ဒယ်တစ်ခုကို အသုံးပြုခဲ့သည်။

ယခု စစ်ထုတ်ခြင်းနှင့် အမျိုးအစားခွဲခြင်း အဓိပ္ပါယ်ဖွင့်ဆိုချက်များ အပါအဝင် မော်ဒယ်အသစ်တစ်ခုကို ဖန်တီးပါ-

model_customerslist.js

{
"rowsperpage" : 10,
"database" : {
    "connection" : "localmysql",
    "sql" : "SELECT * FROM Customers",
    "orderby" : "CustomerName"
},
"filteritems" : [
    {"item" : "CustomerName", "label" : "Customer"},
    {"item" : "City"},
    {"item" : "Country"}
],
"sortitems" : [
    {"item" : "CustomerName", "label" : "Customer"},
    {"item" : "City"},
    {"item" : "Country"}
]
}

သင့်လျှောက်လွှာတွင် မော်ဒယ်ကို အသုံးပြုပါ

ဥပမာ

<div appml-data="local?model=model_customerslist">
<h1>Customers</h1>
<div appml-include-html="inc_listcommands.htm"></div>
<table class="w3-table-all">
  <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
  </tr>
  <tr appml-repeat="records">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
  </tr>
</table>
</div>

HTML Filter Template တစ်ခုဖန်တီးပါ။

သင့် filter များအတွက် HTML ကိုဖန်တီးပါ

inc_filter.htm

<div id="appml_filtercontainer" class="w3-container w3-light-grey w3-section w3-padding-large" style="display:none;">
  <span id="appmlbtn_queryClose" onclick="this.parentNode.style.display='none';" class="w3-button w3-large w3-right">&times;</span>
  <h2>Filter</h2>
  <div id="appml_filter">
    <div appml-repeat="filteritems">
      <div class="w3-row">
        <div class="w3-col m4">
          <label>{{label||item}}:</label>
        </div>
        <div class="w3-col m2">
          <input id="appml_datatype_{{item}}" type='hidden'>
          <select id="appml_operator_{{item}}" class="w3-select w3-border">
            <option value="0">=</option>
            <option value="1">&lt;&gt;</option>
            <option value="2">&lt;</option>
            <option value="3">&gt;</option>
            <option value="4">&lt;=</option>
            <option value="5">&gt;=</option>
            <option value="6">%</option>
          </select>
        </div>
        <div class="w3-col m6">
          <input id="appml_query_{{item}}" class="w3-input w3-border">
        </div>
      </div>
    </div>
  </div>
  <div id="appml_orderby">
    <h2>Order By</h2>
    <div class="w3-row">
      <div class="w3-col m5">
        <select id='appml_orderselect' class="w3-select w3-border">
          <option value=''></option>
          <option appml-repeat="sortitems" value="{{item}}">{{label || item}}</option>
        </select>
      </div>
      <div class="w3-col m7">
        ASC <input type='radio' id="appml_orderdirection_asc" name='appml_orderdirection' value='asc' class="w3-radio">
        DESC <input type='radio' id="appml_orderdirection_desc" name='appml_orderdirection' value='desc' class="w3-radio">
      </div>
    </div>
  </div>
  <br>
  <button id="appmlbtn_queryOK" type="button" class="w3-btn w3-green">OK</button>
</div>

"inc_filter.htm" ကဲ့သို့သော သင့်လျော်သော အမည်ဖြင့် ဖိုင်တစ်ခုတွင် စစ်ထုတ် HTML ကို သိမ်းဆည်းပါ။

appml-include-html ဖြင့် သင့်ရှေ့ပြေးပုံစံတွင် filter HTML ကို ထည့်သွင်း ပါ

ဥပမာ

<div appml-data="local?model=model_customerslist">
<h1>Customers</h1>
<div appml-include-html="inc_listcommands.htm"></div>
<div appml-include-html="inc_filter.htm"></div>
<table class="w3-table-all">
  <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
  </tr>
  <tr appml-repeat="records">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
  </tr>
</table>
</div>