簡體   English   中英

使用二維碼掃描器掃描值后打開引導模式

[英]OPEN BOOTSTRAP MODAL AFTER SCANNING THE VALUE USING QRCODE SCANNER

我有一個表格,當用戶將他們的二維碼掃描到掃描儀中時,會彈出一個帶有他們詳細信息的模式。

上次我使用這個解決方案成功地做到了。 通過條形碼掃描儀提交表單后如何打開引導模式框

但現在,它不再起作用了。

這是我的代碼

<form name = "auto_barcode" id="auto_barcode" action="" method="post"> 
    <div class="form-group center">
        <label class="label-material active" style="font-color: #4b0082; ">ID number</label>
        <input id="employee_qrcode" type="password" name="employee_qrcode" required="" class="form-control center" autofocus placeholder="Type your employee ID number here">
    </div>
</form>

我的模態:

<div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" aria-hidden="true" class="modal fade text-left">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header primary-bg">
                <h4 id="exampleModalLabel" class="modal-title" style="color: white;">online health declaration form </h4>
            </div>
            <div class="modal-body">
                <div class="form-group row"> 
                    <input id="employee_qrcode1" type="text" class="form-control form-control-success " value="" disabled hidden="true" >
                    <label  class="col-md-12 form-control-label" style="font-size: 30px; font-weight: bold; margin-left: 20px; " id="info_employee_name" type="text" ></label> 
                    <label class="col-md-12 form-control-label" id="info_employee_address" type="text" style="font-weight: bold; font-size: 15px; margin-left: 20px; ">Km. 38 B, Balasing Road, Pulong Buhangin, Santa Maria, Bulacan</label>
                    <label class="col-md-12 form-control-label" id="info_employee_contactNo" style="font-weight: bold; font-size: 15px; margin-left: 20px; " type="text" >0915-333-5984</label>
                    <label class="col-md-12 form-control-label" id="info_employee_section" style="font-weight: bold; font-size: 15px;margin-left: 20px; " type="text" >RICTMS</label>
                </div>  
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card-body">
                            <div class="form-group row">
                                <label class="col-md-8 form-control-label"  style="font-weight: bold;">Body Temperature:</label>
                                <div class="col-md-10">
                                    <input id="body_temperature" type="text" class="form-control form-control-success" style="resize: none; color: blue; text-transform: uppercase;" name="body_temperature"/>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label class="col-md-8 form-control-label"  style="font-weight: bold;">Places visted and transited within the last 14 days:</label>
                                <div class="col-md-10">
                                    <input id="place_visited14" type="text" class="form-control form-control-success" style="resize: none; color: blue; text-transform: uppercase;" name="place_visited14"/>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label class="col-md-8 form-control-label"  style="font-weight: bold;">Have you been hospitalized for the past 14 days?</label>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" name="is_hospitalized" value="YES" /> YES <br>
                                        Please describe condition.<br>
                                        <input id="employee_condition_hospitalized" type="text" class="form-control form-control-success" style="resize: none; color: blue; text-transform: uppercase;" name="employee_condition_hospitalized"><br>
                                    </div>
                                </div>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" checked="true" name="is_hospitalized" value="NO"/> No 
                                    </div>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-md-8 form-control-label"  style="font-weight: bold;">In the last 14 days, did you have any of the following : Fever, Colds, Cough, Sore Throat or Difficulty in Breathing?</label>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" name="is_symptoms" value="YES"/> YES <br>
                                        Please specify.<br>
                                        <input id="employee_condition_symptoms" type="text" class="form-control form-control-success" style="resize: none; color: blue; text-transform: uppercase;" name="employee_condition_symptoms"><br>
                                    </div>
                                </div>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" checked="true" name="is_symptoms" value="NO"/> No 
                                    </div>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-md-8 form-control-label"  style="font-weight: bold;">Have you been identified as PUM/PUI?</label>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" name="is_pui" value="YES"/> YES
                                    </div>
                                </div>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" checked="true" name="is_pui" value="NO"/> No 
                                    </div>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-md-8 form-control-label"  style="font-weight: bold;">Have you been in direct contact with or within the immediate vicinity of any person known to be a PUM/PUI?</label>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" name="is_contact" value="YES"/> YES
                                    </div>
                                </div>
                                <div class="col-md-10">
                                    <div class="custom-control custom-radio">
                                        <input type="radio" checked="true" name="is_contact" value="NO"/> No 
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> 
            </div>
            <div class="modal-footer">
            <div class="form-group row">       
                <div class="col-md-12">
                    <label><u>DECLARATION AND DATA PRIVACY CONSENT FORM:</u><br><br>
                    The information I have given is true, correct and complete. I understand that failure to answer any question or giving false answer can be penalized in accordance with law. I voluntarily and freely consent the collection and sharing of the above personal information only in the relation to the office safety protocols.</label>
                    <!-- <input type="submit" style="float:right" class="btn btn-primary" value="Save" id="btnSave"> -->
                    <button type="submit" id="btnSave" class="btn btn-success float-right btnSave" >Submit</button>
                    <button type="button" style="float:right; margin-right:10px;" class="btn btn-dark cancelBtn" data-dismiss="modal" aria-label="Close">Close</button>
                </div>
            </div>
        </div>
        </div>
    </div>
</div>

我的 javascript:

$('#auto_barcode').submit(function () {
    event.preventDefault();
    var employee_qrcode = document.getElementById("employee_qrcode").value;
    // var employee_qrcode = $(this).data('value');
    $.ajax({
        type: 'post',
        url: base_url+'Main_scan/ohdf_employee_details',
        data: {'employee_qrcode': employee_qrcode},
        success: function(data){
            var res1 = data.result1;
            if(data.success==1){
                document.getElementById('info_employee_name').innerHTML= res1[0].employee_fname+" "+res1[0].employee_mname+" "+res1[0].employee_lname;
                document.getElementById('info_employee_contactNo').innerHTML= "Contact Number:  "+res1[0].employee_contact_nop;
                document.getElementById('info_employee_address').innerHTML= "Address: "+res1[0].employee_address;
                document.getElementById('info_employee_section').innerHTML = "Division/Section/Unit:  "+res1[0].employee_section;
                $('#myModal').modal();
            } // add else toast here....
        }
    });
});

模態僅在我按下回車按鈕時才有效,但特別是我需要在掃描 ng QRcode 后顯示它。

我已經為我的問題找到了解決方案。 我只是將我的二維碼掃描儀恢復為出廠默認設置。 我的代碼沒有問題::)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM