{% extends "conferenceapp/layout.html" %}
{% block style %}
{% endblock %}
{% block content %}

                        <div class="col-md-8">
                            <h4>VIEW MEMBER LIST>
                            </h4>
                        </div>

        <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne" aria-expanded="true" style="">
            <div class="panel-body" id="panel-body">
                <form id="steps_form">
                    <input type="hidden" name="user_id" id="user_id" value="{{user_id or 0 }}" />
                    <input type="hidden" name="html_data" id="html_data" value="{{html_data}}" />
                  
                        <div class="card">
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-4">
                                                <label for="society"> Society<span style="color: red;">*</span></label>
                                            </div>
                                            <div class="col-md-8">
                                                <select class="form-control society_intial" id="society_intial" name="society_intial">
                                                        <option value="" id="select" disabled selected>--SELECT--</option>
                                                        {% if society : %}
                                                            {% if society_intial %} 
                                                                    {% for row in society_intial %}
                                                                         {% if row.society_id == society.society_id %}
                                                                             <option value="{{society.society_id}}" selected>{{society.society_intial}} </option>
                                                                         {% else %}
                                                                               <option value="{{row.society_id}}">{{row.society_intial}} </option>
                                                                         {% endif %}                                                        
                                                                    {% endfor %} 
                                                                {% endif %}
                                                             {% else %}
                                                                {% if society_intial %} 
                                                                   {% for row in society_intial %}
                                                                        <option value="{{row.society_id}}"> {{row.society_intial}} </option>
                                                                    {% endfor %}
                                                                {% endif %}
                                                         {% endif %}
                                                    </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-6"></div>
                                </div><br>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-4">
                                                <label> Name:</label>
                                            </div>
                                            <div class="col-md-8">
                                                <input class="form-control rounded inputs" type="text" name="full_name" id="full_name"/><!-- oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');"
                                                    value=""
                                                    maxlength="11"
                                                    required -->
                                            </div>
                                        </div>
                                        <br />
                                    </div>
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-4">
                                                <label>Email</label>
                                            </div>
                                            <div class="col-md-8">
                                                <div class="row">
                                                    <div class="col-md-3">
                                                        <input type="email" class="form-control" name="email" id="email" value="email" />
                                                </div>
                                            </div>
                                        </div>
                                        <br />
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-4">
                                                <label>Mobile</label>
                                            </div>
                                            <div class="col-md-8">
                                                <input type="text" name="mobile" id="mobile" class="form-control" placeholder="Mobile" />
                                            </div>
                                        </div>
                                        <br />
                                    </div>
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-4">
                                                <label>DOB</label>
                                            </div>
                                            <div class="col-md-8">
                                                <input type="datetime-local" name="dob" id="dob" class="form-control" placeholder="dob" />
                                            </div>
                                        </div>
                                        <br />
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-12 text-center">
                                        <input type="button" class="btn btn-success" name="save_btn" id="save_btn" value="Save" title="Save" />
                                        <input type="button" class="btn btn-success" style="display: none;" name="update_btn" id="update_btn" value="Update" title="Update" />
                                        <input type="button" class="btn btn-danger" name="cancel_btn" id="cancel_btn" value="Cancel" title="Cancel" />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <div id="Members_List_Table" class="mobile-responsive">
            <table class="table table-bordered">
                <thead>
                    <tr>
                         <th scope="col"></th>
                        <th scope="col">User Id</th>
                        <th scope="col">Society Name</th>
                        <th scope="col">Full Name</th>
                        <th scope="col">Email</th>
                        <th scope="col">Mobile</th>
                    </tr>
                </thead>
                <tbody id="Member_List_Content"></tbody>
            </table>
        </div>
     <div class="modal" id="view">
    <div class="modal-dialog">
      <div class="modal-content">
      
        <div class="modal-header">
          <h4 class="modal-title">View Member List</h4>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
       
        <div class="modal-body">

        <div class="row">
         <div class="col-md-3">
            <label>Society:</label>
            </div>
            <div class="col-md-9">
                <input class="form-control"  type="text" name="model_society" id="model_society" ><br>
            </div>
         </div>

         <div class="row">
            <div class="col-md-3">
                <label>Full Name:</label>
            </div>
            <div class="col-md-9">
                <input class="form-control"  type="text" name="model_name" id="model_name" ><br>
            </div>
         </div>

         <div class="row">
            <div class="col-md-3">
                <label>Email:</label>
            </div>
            <div class="col-md-9">
                <input class="form-control"  type="text" name="model_email" id="model_email" ><br>
            </div>
         </div>

         <div class="row">
            <div class="col-md-3">
                <label>Mobile:</label>
            </div>
            <div class="col-md-9">
                <input class="form-control"  type="text" name="model_mobile" id="model_mobile" ><br>
            </div>
         </div>
       
         <!-- <input class="form-control"  type="hidden" name="model_m_steps_id" id="model_m_steps_id" ><br> -->
         
        </div>
      
        <div class="modal-footer">
          <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>
{% endblock %}