jeudi 16 mai 2019

Forming a request for API call from checkbox using jquery

I have html output in this i have to form a string that is used to for my api request as parameter.Below I have Given my html output:

<div class="right-filter-inner p-2">
<div class="right-inner-PROCESSING_TIME">
    <h4>PROCESSING_TIME</h4>
        <div class="top-checks rgt-report-sector" data-simplebar="init">
            <div class="simplebar-track vertical" style="visibility: visible;">
                <div class="simplebar-scrollbar" style="top: 2px; height: 25px;"></div>
            </div>
            <div class="simplebar-track horizontal" style="visibility: hidden;">
                <div class="simplebar-scrollbar"></div>
            </div>
            <div class="simplebar-scroll-content" style="padding-right: 17px; margin-bottom: -34px;">
                  <div class="simplebar-content" style="padding-bottom: 17px; margin-right: -17px;">
                            <div class="filter-metrics">
                                <label class="custom-control">
                                    <input type="search" class="material-control-input filter-search" id="top-filter-search-PROCESSING_TIME">
                                </label>
                                <label class="custom-control material-checkbox filter-label">
                                    <input type="checkbox" class="material-control-input top-filter-all" value="all" checked="">
                                    <span class="material-control-indicator"></span>
                                    <span class="material-control-description">All</span>
                                </label>
                                <label class="custom-control material-checkbox filter-label">
                                    <input type="checkbox" name="PROCESSING_TIME" class="material-control-input filter-option top-filter-20181001" value="2018-10-01" id="top-filter-20181001" checked="">
                                    <span class="material-control-indicator"></span>
                                    <span class="material-control-description">2018-10-01</span>
                                </label>
                                <label class="custom-control material-checkbox filter-label">
                                    <input type="checkbox" name="PROCESSING_TIME" class="material-control-input filter-option top-filter-20181002" value="2018-10-02" id="top-filter-20181002" checked="">
                                    <span class="material-control-indicator"></span>
                                    <span class="material-control-description">2018-10-02</span>
                                </label>
                                <label class="custom-control material-checkbox filter-label">
                                    <input type="checkbox" name="PROCESSING_TIME" class="material-control-input filter-option top-filter-20180918" value="2018-09-18" id="top-filter-20180918" checked="">
                                    <span class="material-control-indicator"></span>
                                    <span class="material-control-description">2018-09-18</span>
                                </label>
                                <label class="custom-control material-checkbox filter-label">
                                    <input type="checkbox" name="PROCESSING_TIME" class="material-control-input filter-option top-filter-20180830" value="2018-08-30" id="top-filter-20180830" checked="">
                                    <span class="material-control-indicator"></span>
                                    <span class="material-control-description">2018-08-30</span>
                                </label>
                            </div>
                     </div>
                </div>
            </div>
        </div>
        <div class="right-inner-DSPID">
            <h4>DSPID</h4>
                <div class="top-checks rgt-report-sector" data-simplebar="init">
                        <div class="simplebar-track vertical" style="visibility: visible;">
                            <div class="simplebar-scrollbar" style="top: 2px; height: 25px;"></div>
                        </div>
                        <div class="simplebar-track horizontal" style="visibility: hidden;">
                            <div class="simplebar-scrollbar"></div>
                        </div>
                        <div class="simplebar-scroll-content" style="padding-right: 17px; margin-bottom: -34px;">
                            <div class="simplebar-content" style="padding-bottom: 17px; margin-right: -17px;">
                                    <div class="filter-metrics">
                                        <label class="custom-control material-checkbox filter-label">
                                            <input type="checkbox" name="DSPID" class="material-control-input filter-option top-filter-1" value="-1" id="top-filter-1" checked="">
                                            <span class="material-control-indicator"></span>
                                            <span class="material-control-description">-1</span>
                                        </label>
                                    </div>
                            </div>
                        </div>
                </div>
        </div>
</div>

with this html I have to form A request as ,

PROCESSING_TIME in ('checkedval1','checkedval2','checkedval3'),DSPID in ('checedval1')

My fiddle

I have tried in my end but i am struck in a point to form request from checked values.Anyone help me out.




Aucun commentaire:

Enregistrer un commentaire