Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html xmlns:th="http://www.thymeleaf.org">
- <head>
- <div th:replace="includes/htmlhead :: htmlhead"></div>
- <div th:replace="fileUpload :: fileUploadIncludeStyle"></div>
- </head>
- <body class="page-container-bg-solid">
- <div class="page-wrapper">
- <div th:replace="includes/header :: header(${menu})">...</div>
- <div class="page-wrapper-row full-height">
- <div class="page-wrapper-middle">
- <div class="page-container">
- <div class="page-content-wrapper">
- <div class="page-body">
- <div class="container">
- <div class="row">
- <div class="col-md-12">
- <div class="main-box-div">
- <div class="title-div" th:text="#{grievance.submission.form}"> </div>
- <div class="portlet light bordered" id="formWizard">
- <div class="portlet-title">
- <div class="caption">
- <i class=" icon-layers "></i>
- <span class="caption-subject bold uppercase" th:text="#{record.complaint}"></span>
- <span class="step-title"> </span>
- </div>
- </div>
- <div class="portlet-body form">
- <form class="form-horizontal" id="registerAndGrieveForm" action="api/file/upload" method="POST" enctype="multipart/form-data">
- <div class="form-wizard">
- <div class="form-body">
- <ul class="nav nav-pills nav-justified steps">
- <li>
- <a href="#tab1" data-toggle="tab" class="step">
- <span class="number" th:text ="#{number.one}"></span>
- <span class="desc" th:text ="#{mandatory.info}">
- <i class="fa fa-check"></i>
- </span>
- </a>
- </li>
- <li>
- <a href="#tab2" data-toggle="tab"
- class="step active">
- <span class="number" th:text="#{number.two}"></span>
- <span class="desc" th:text="#{description.of.complaint}">
- <i class="fa fa-check"></i>
- </span>
- </a>
- </li>
- <li>
- <a href="#tab3" data-toggle="tab" class="step">
- <span class="number" th:text="#{number.three}"> </span>
- <span class="desc" th:text ="#{verification}">
- <i class="fa fa-check"></i>
- </span>
- </a>
- </li>
- </ul>
- <div id="bar" class="progress progress-striped" role="progressbar">
- <div class="progress-bar progress-bar-success"></div>
- </div>
- <div class="tab-content">
- <div class="alert alert-danger display-none">
- <button class="close" data-dismiss="alert" th:text="#{enter.missing.info}"></button>
- </div>
- <div class="alert alert-success display-none">
- <button class="close" data-dismiss="alert" th:text="#{correct.info}"></button>
- </div>
- <div class="tab-pane active" id="tab1">
- <h3 class="block" th:text="#{fill.info}"></h3>
- <div class="form-group">
- <label class="control-label col-md-4" id="phoneNumberLabel"> <span th:text="#{mobile.number}"></span><span class="required">*</span></label>
- <div class="col-md-4">
- <input type="text" class="form-control" id="phoneNumber" name="phoneNumber" onblur="getUser();"/>
- </div>
- </div>
- <div style="display : none;" id="divPinNumber">
- <div class="form-group">
- <label class="control-label col-md-4" th:text="#{pin}"><span class="required">*</span></label>
- <div class="col-md-4">
- <input type="password" class="form-control" id="pinNumber" name="pinNumber"/>
- </div>
- </div>
- <div class="form-actions">
- <div class="col-md-offset-4 col-md-8">
- <a class="btn green" onclick="doLogIn();" th:text="#{login}"> </a>
- </div>
- </div>
- </div>
- <div id="divRest">
- <div class="form-group">
- <label class="control-label col-md-4" id="nameLabel"> <span th:text="#{full.name}"></span><span class="required">*</span></label>
- <div class="col-md-4">
- <input type="text" class="form-control" id="name" name="name"/>
- <!--<span class="help-block" th:text="#{provide.full.name}"> </span>-->
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label"><span th:text="#{nationality.label}" th:remove="tag"></span></label>
- <div class="col-md-8">
- <div class="mt-radio-inline">
- <label class="mt-radio">
- <input name="nationality" value="BANGLADESHI" type="radio">
- <span th:text="#{nationality.bangladeshi}" th:remove="tag"></span>
- <span ></span>
- </label>
- <label class="mt-radio">
- <input name="nationality" value="OTHER" type="radio">
- <span th:text="#{nationality.other}" th:remove="tag"></span>
- <span ></span>
- </label>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4" id="nidOrBcnLabel"> <span th:text="#{nid}"></span><span class="required">*</span></label>
- <div class="col-md-4">
- <input type="text" class="form-control" name="nidOrBcn" id="nidOrBcn"/>
- <!--<span class="help-block" th:text="#{provide.nid}"> </span>-->
- <!--<span class="help-block" th:text="#{provide.nid}"> </span>-->
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4" id="emailLabel"> <span th:text="#{email}"></span><span class="required">*</span></label>
- <div class="col-md-4">
- <input name="email" id="email" class="form-control" type="text">
- <!--<span class="help-block" th:text="#{provide.email}"> </span>-->
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4" id="birthdateLabel" th:text="#{birth.date}"></label>
- <div class="col-md-4">
- <div class="input-group date" id='birthdate'>
- <input type="text" class="form-control" name="birthDate" data-date-end-date="0d">
- <span class="input-group-addon">
- <i class="glyphicon glyphicon-calendar"></i>
- </span>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4" id="occupationLabel" th:text="#{occupation}"></label>
- <div class="col-md-4">
- <select id="occupation" id="occupation" class="select2 form-control input-inline">
- <option value="" selected style="display: none;" th:text="#{choose.occupation.type}"></option>
- <option th:value="#{occupation.type.business}" th:text="#{occupation.type.business}"></option>
- <option th:value="#{occupation.type.govt.service}" th:text="#{occupation.type.govt.service}"></option>
- <option th:value="#{occupation.type.private.service}" th:text="#{occupation.type.private.service}"></option>
- <option th:value="#{occupation.type.reporter}" th:text="#{occupation.type.reporter}"></option>
- <option th:value="#{occupation.type.retired}" th:text="#{occupation.type.retired}"></option>
- <option th:value="#{occupation.type.housewife}" th:text="#{occupation.type.housewife}"></option>
- <option th:value="#{occupation.type.student}" th:text="#{occupation.type.student}"></option>
- <option th:value="#{occupation.type.others}" th:text="#{occupation.type.others}"></option>
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4" id="educationLabel" th:text="#{education}"></label>
- <div class="col-md-4">
- <select id="education" id="education" class="select2 form-control input-inline">
- <option value="" selected style="display: none;" th:text="#{choose.occupation.type}"></option>
- <option value="#{education.type.illiterate}" th:text="#{education.type.illiterate}"></option>
- <option value="#{education.type.literate}" th:text="#{education.type.literate}"></option>
- <option value="#{education.type.pec}" th:text="#{education.type.pec}"></option>
- <option value="#{education.type.jsc}" th:text="#{education.type.jsc}"></option>
- <option value="#{education.type.ssc}" th:text="#{education.type.ssc}"></option>
- <option value="#{education.type.hsc}" th:text="#{education.type.hsc}"></option>
- <option value="#{education.type.degree}" th:text="#{education.type.degree}"></option>
- <option value="#{education.type.technical}" th:text="#{education.type.technical}"></option>
- <option value="#{education.type.honors}" th:text="#{education.type.honors}"></option>
- <option value="#{education.type.masters}" th:text="#{education.type.masters}"></option>
- <option value="#{education.type.phd}" th:text="#{education.type.phd}"></option>
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4" id="genderLabel" th:text="#{gender}"></label>
- <div class="col-md-4">
- <div class="mt-radio-inline">
- <label class="mt-radio">
- <input name="gender" value="FEMALE" type="radio">
- <span th:text="#{female}" th:remove="tag"></span>
- <span></span>
- </label>
- <label class="mt-radio" >
- <input name="gender" value="MALE" type="radio">
- <span th:text="#{male}" th:remove="tag"></span>
- <span></span>
- </label>
- <label class="mt-radio">
- <input name="gender" value="OTHERS" type="radio"> <span th:text="#{other}" th:remove="tag"></span>
- <span></span>
- </label>
- </div>
- </div>
- </div>
- <h3 class="block" id="permanentAddressLabel" th:text="#{permanent.address}"></h3>
- <div class="form-group">
- <label class="col-md-4 control-label"></label>
- <div class="col-md-8">
- <div class="mt-radio-inline">
- <label class="mt-radio" >
- <input value="UPAZILA" type="radio" name="permanentAddressTypeValue">
- <span th:text="#{upazilla}" th:remove="tag"></span>
- <span ></span>
- </label>
- <label class="mt-radio" >
- <input value="CITY_CORPORATION" type="radio" name="permanentAddressTypeValue">
- <span th:text="#{city.corporation}" th:remove="tag"></span>
- <span ></span>
- </label>
- </div>
- <div id="permanentAddressTypeValueDiv"></div>
- </div>
- <span class="help-inline" style="color: red;"></span>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label" id="permanentAddressHouseLabel"> <span th:text="#{address.details}" th:remove="tag"></span><span class="required">*</span></label>
- <div class="col-md-8">
- <input id="permanentAddressHouse" name="permanentAddressHouse" class="form-control" type="text">
- </div>
- <span style="color: red;"></span>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label " id="permanentAddressStreetLabel"><span th:text="#{address.details.local}" th:remove="tag"></span><span class="required">*</span></label>
- <div class="col-md-8">
- <input id="permanentAddressStreet" name="permanentAddressStreet" class="form-control" type="text">
- </div>
- <span style="color: red;"></span>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label" id="divisionLabel"><span th:text="#{division}" th:remove="tag"></span><span class="required">*</span>
- </label>
- <div class="col-md-4">
- <select class="select2 form-control" id="permanentAddressDivision" name="permanentAddressDivision">
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label" id="districtLabel"><span th:text="#{district}" th:remove="tag"></span><span class="required">*</span>
- </label>
- <div class="col-md-4">
- <select id="permanentAddressDistrict" name="permanentAddressDistrict" class="select2 form-control">
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label"> </label>
- <div class="col-md-4">
- <select id="permanentAddressTypeId" name="permanentAddressTypeId" class="select2 form-control">
- </select>
- </div>
- </div>
- <h3 class="block" id="presentAddressLabel">
- <span th:text="#{present.address}"></span> <input id="sameAsPermanent" type="checkbox"> <span class="small" th:text="#{permanent.present.same}"></span>
- </h3>
- <div class="form-group">
- <label class="col-md-4 control-label"></label>
- <div class="col-md-8">
- <div class="mt-radio-inline">
- <label class="mt-radio">
- <input name="presentAddressTypeValue" value="UPAZILA" type="radio">
- <span th:text="#{upazilla}" th:remove="tag"></span>
- <span ></span>
- </label>
- <label class="mt-radio">
- <input name="presentAddressTypeValue" value="CITY_CORPORATION" type="radio">
- <span th:text="#{city.corporation}" th:remove="tag"></span>
- <span ></span>
- </label>
- </div>
- <div id="presentAddressTypeValueDiv"></div>
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label" > <span th:text="#{address.details}" th:remove="tag"></span><span class="required">*</span></label>
- <div class="col-md-8">
- <input id="presentAddressHouse" name="presentAddressHouse" class="form-control" type="text">
- </div>
- <span style="color: red;"></span>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label " id="presentAddressStreetLabel"><span th:text="#{address.details.local}" th:remove="tag"></span> <span class="required">*</span></label>
- <div class="col-md-8">
- <input id="presentAddressStreet" name="presentAddressStreet" class="form-control" type="text">
- </div>
- <span style="color: red;"></span>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4"><span th:text="#{division}" th:remove="tag"></span> <span class="required">*</span></label>
- <div class="col-md-4">
- <select name="presentAddressDivision" id="presentAddressDivision" class="select2 form-control">
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-4"><span th:text="#{district}" th:remove="tag"></span> <span class="required">*</span></label>
- <div class="col-md-4">
- <select name="presentAddressDistrict" id="presentAddressDistrict" class="select2 form-control">
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label"> </label>
- <div class="col-md-4">
- <select name="presentAddressTypeId" id="presentAddressTypeId" class="select2 form-control">
- </select>
- </div>
- </div>
- </div>
- </div>
- <div class="tab-pane" id="tab2">
- <h3 class="block" th:text="#{description.of.complaint}"></h3>
- <div class="well">
- <div class="form-group">
- <label class="control-label col-md-3" id="serviceTrackingNumberLabel" th:text="#{tracking.number}"></label>
- <div class="col-md-6">
- <input id="serviceTrackingNumber" name="serviceTrackingNumber" class="form-control" type="text">
- <span class="help-block" th:text="#{provide.tracking.number.from.form}"> </span>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-3" th:text="#{choose.office.from.list}"></label>
- </div>
- <div class="form-group">
- <div class="col-md-offset-1 col-md-11">
- <select id="officeLayers" class="select2 form-control input-inline">
- <option value="" selected style="display: none;" th:text="#{choose.office.type}"></option>
- <option value="1" th:text="#{ministry}"></option>
- <option value="2" th:text="#{department}"></option>
- <option value="3" th:text="#{division}"></option>
- <option value="4" th:text="#{district}"></option>
- <option value="5" th:text="#{upazilla}"></option>
- <option value="6" th:text="#{other}"></option>
- </select>
- <select id="firstSelection" class=" form-control input-inline" style="display: none;"></select>
- <select id="secondSelection" class=" form-control input-inline" style="display: none;"></select>
- <select id="thirdSelection" class=" form-control input-inline" style="display: none;"></select>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-2" id="serviceIdLabel" th:text="#{service}"></label>
- <div class="col-md-10">
- <select id="serviceDropDown" name="serviceId" class="select2 form-control"></select>
- <div class="clearfix"> </div>
- <input id="serviceOthers" name="serviceOthers" class="form-control hide" type="text" th:placeholder="#{service.others}">
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-2" id='serviceReceiverLabel' th:text="#{service.receiver.label}"></label>
- <div class="col-md-10">
- <input id="serviceReceiver" name="serviceReceiver" class="form-control" type="text">
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-2" id='relationLabel' th:text="#{service.receiver.relation}"></label>
- <div class="col-md-8">
- <div class="mt-radio-inline">
- <label class="mt-radio">
- <input checked="" name="relation" value="SELF" type="radio"><span th:text="#{service.receiver.relation.self}" th:remove="tag"></span><span></span>
- </label>
- <label class="mt-radio">
- <input name="relation" value="REPRESENTATIVE" type="radio"><span th:text="#{service.receiver.relation.represent}" th:remove="tag"></span><span></span>
- </label>
- <label class="mt-radio"> <input name="relation" value="RELATIVE" type="radio"><span th:text="#{service.receiver.relation.relative}" th:remove="tag"></span><span></span></label>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-2" id='submissionDateLabel' th:text="#{application.date}"></label>
- <div class="col-md-4">
- <div class='input-group date' id='applicationDate'>
- <input type='text' class="form-control" name="submissionDate" data-date-end-date="0d" />
- <span class="input-group-addon">
- <span class="glyphicon glyphicon-calendar"></span>
- </span>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-2" id='subjectLabel' th:text="#{complaint.subject}"></label>
- <div class="col-md-10">
- <input id="subject" name="subject" class="form-control" type="text">
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-2" id='bodyLabel' th:text="#{description.of.complaint}"></label>
- <div class="col-md-10">
- <div id="body" class="summernote"></div>
- </div>
- </div>
- <div th:replace="fileUpload :: fileUpload" id="fileupload"></div>
- <div class="well hide">
- <div class="form-group">
- <div class="col-md-12">
- <div class="mt-checkbox-list">
- <label class="mt-checkbox" >
- <input id="anonymous" type="checkbox">
- <span th:text="#{annonymous}" th:remove="tag"></span>
- <span></span>
- </label>
- </div>
- <span class="help-block" th:text="#{warning.about.annonymous}"> </span>
- </div>
- </div>
- </div>
- </div>
- <div class="tab-pane" id="tab3">
- <div class="well">
- <div id="trackingNumberBlock">
- <h3 class="block" th:text="#{confirm.message}"></h3>
- <div id="confirmationDiv">
- </div>
- </div>
- </div>
- </div>
- <div class="tab-pane" id="tab4">
- </div>
- </div>
- </div>
- <div class="form-actions">
- <div class="row">
- <div class="col-md-12">
- <div class="pull-right">
- <a href="javascript:;" class="btn default button-previous"th:text="#{go.to.prev.step}">
- <i class="fa fa-angle-left"></i>
- </a>
- <a href="javascript:;" class="btn btn-outline green button-next" th:text="#{go.to.next.step}">
- <i class="fa fa-angle-right"></i>
- </a>
- <a href="javascript:;" class="btn green button-submit" th:text="#{send.complaint}">
- <i class="fa fa-check"></i>
- </a>
- </div>
- </div>
- </div>
- </div>
- </div>
- </form>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="modal fade" id="ajaxProcessingModal" tabindex="-1" data-backdrop="static" data-keyboard="false">
- <div class="modal-dialog">
- <div class="modal-content">
- <div class="modal-body">
- <img src="../assets/global/img/loading-spinner-grey.gif" alt="" class="loading">
- <span th:text="#{processing}"> </span>
- </div>
- </div>
- </div>
- </div>
- <div class="modal fade" id="pinNumberModal" tabindex="-1" role="basic" aria-hidden="true" data-backdrop="static" data-keyboard="false">
- <div class="modal-dialog">
- <div class="modal-content">
- <div class="modal-header">
- <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
- <h4 class="modal-title" th:text="#{pin.number}"><i class="icon-action-redo"></i> </h4>
- </div>
- <div class="modal-body">
- <!--<form class="horizontal-form">-->
- <div class="form-body">
- <div class="row">
- <div class="form-group">
- <label class="control-label col-md-4"> <span th:text="#{pin}"></span><span class="required">*</span></label>
- <div class="col-md-4">
- <input type="text" class="form-control" id="pinNumberForNewUser" name="pinNumberForNewUser"/>
- </div>
- </div>
- <div class="form-group">
- <label class="control-label col-md-8"><span class="required">*</span><span th:text="#{pin.user.ask}"></span></label>
- </div>
- </div>
- </div>
- <!--</form>-->
- </div>
- <div class="modal-footer">
- <button type="button" class="btn dark btn-outline btn-primary" data-dismiss="modal" onclick="javascript:loginForPinNumberModal()">প্রেরণ করুন</button>
- <button type="button" class="btn dark btn-outline" data-dismiss="modal" th:text="#{cancel}"></button>
- </div>
- </div>
- <!-- /.modal-content -->
- </div>
- <!-- /.modal-dialog -->
- </div>
- <!--<div class="modal fade" id="fileUploadModal" tabindex="0" data-backdrop="static" data-keyboard="false">
- <div class="modal-dialog">
- <div class="modal-content">
- <div class="modal-body" id="fileUploadDiv">
- <div th:replace="fileUpload :: fileUpload"></div>
- </div>
- </div>
- </div>
- </div>-->
- <div th:replace="includes/footer :: footer">...</div>
- </div>
- <div th:replace="includes/footer_includes :: footer">...</div>
- <script src="/assets/global/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script>
- <script src="/assets/global/plugins/jquery-validation/js/additional-methods.min.js" type="text/javascript"></script>
- <script src="/assets/global/plugins/bootstrap-wizard/jquery.bootstrap.wizard.min.js" type="text/javascript"></script>
- <script src="/assets/global/plugins/bootstrap-summernote/summernote.min.js" type="text/javascript"></script>
- <div th:replace="fileUpload :: fileUploadIncludeScript"></div>
- <script>
- $(document).ready(function() {
- $("#applicationDate").datepicker({
- format: 'dd/mm/yyyy',
- autoclose: true,
- language: jsLangCodeForLibs
- }); /* format: "dd-mm-yyyy" */
- $("#birthdate").datepicker({
- format: "dd/mm/yyyy",
- startView: 2,
- autoclose: true,
- language: jsLangCodeForLibs
- });
- /*$('.summernote').summernote({
- height: 300
- });*/
- $('.summernote').summernote({
- height: 100,
- toolbar: [
- // [groupName, [list of button]]
- ['style', ['bold', 'italic', 'underline', 'clear', 'fontname']],
- ['font', ['strikethrough', 'superscript', 'subscript']],
- ['fontsize', ['fontsize']],
- ['color', ['color']],
- ['para', ['ul', 'ol', 'paragraph']],
- ['Insert', ['table', 'hr']],
- ['Misc', ['undo', 'redo']]
- ]
- });
- $('.select2').select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- /*$('#firstSelection').select2();
- $('#secondSelection').select2();
- $('#thirdSelection').select2();*/
- });
- </script>
- <script>
- function getDivision() {
- $.ajax({
- url: "/api/geo/division",
- dataType: "text",
- success: function(result) {
- var json = JSON.parse(result);
- for (var i = 0; i < json.length; ++i) {
- if (languageCode == "en") {
- $("#permanentAddressDivision").append(new Option(json[i].nameEnglish, json[i].id));
- $("#presentAddressDivision").append(new Option(json[i].nameEnglish, json[i].id));
- } else {
- $("#permanentAddressDivision").append(new Option(json[i].nameBangla, json[i].id));
- $("#presentAddressDivision").append(new Option(json[i].nameBangla, json[i].id));
- }
- }
- $("#permanentAddressDivision").change();
- $("#presentAddressDivision").change();
- }
- });
- };
- async function getDistrict(parent, child, grandChild) {
- await $.ajax({
- url: "/api/geo/district/" + parent.val(),
- dataType: "text",
- success: function(result) {
- var json = JSON.parse(result);
- child.empty();
- grandChild.empty();
- for (var i = 0; i < json.length; ++i) {
- if (languageCode == "en") {
- child.append(new Option(json[i].nameEnglish, json[i].id));
- } else {
- child.append(new Option(json[i].nameBangla, json[i].id));
- }
- }
- //child.select2();
- }
- });
- };
- function setPlaceholder(parent, text) {
- parent.append(new Option("-- select " + text + " --", ""));
- parent.prop('selectedIndex', 0);
- };
- async function getThana(divId, disId, parent) {
- await $.ajax({
- url: "/api/geo/thana/" + divId + "/" + disId,
- dataType: "text",
- success: function(result) {
- var json = JSON.parse(result);
- parent.empty();
- for (var i = 0; i < json.length; ++i) {
- if (languageCode == "en") {
- parent.append(new Option(json[i].nameEnglish, json[i].id));
- } else {
- parent.append(new Option(json[i].nameBangla, json[i].id));
- }
- }
- //parent.select2();
- }
- });
- };
- async function getUpazila(divId, disId, parent) {
- await $.ajax({
- url: "/api/geo/upazila/" + divId + "/" + disId,
- dataType: "text",
- success: function(result) {
- var json = JSON.parse(result);
- parent.empty();
- for (var i = 0; i < json.length; ++i) {
- if (languageCode == "en") {
- parent.append(new Option(json[i].nameEnglish, json[i].id));
- } else {
- parent.append(new Option(json[i].nameBangla, json[i].id));
- }
- }
- //parent.select2();
- }
- });
- };
- async function getCitycorporation(divId, disId, parent) {
- await $.ajax({
- url: "/api/geo/citycorporation/" + divId + "/" + disId,
- dataType: "text",
- success: function(result) {
- var json = JSON.parse(result);
- parent.empty();
- for (var i = 0; i < json.length; ++i) {
- if (languageCode == "en") {
- parent.append(new Option(json[i].nameEnglish, json[i].id));
- } else {
- parent.append(new Option(json[i].nameBangla, json[i].id));
- }
- }
- //parent.select2();
- }
- });
- };
- async function getMunicipality(divId, disId, parent) {
- await $.ajax({
- url: "/api/geo/municipality/" + divId + "/" + disId,
- dataType: "text",
- success: function(result) {
- var json = JSON.parse(result);
- parent.empty();
- for (var i = 0; i < json.length; ++i) {
- if (languageCode == "en") {
- parent.append(new Option(json[i].nameEnglish, json[i].id));
- } else {
- parent.append(new Option(json[i].nameBangla, json[i].id));
- }
- }
- //parent.select2();
- }
- });
- };
- async function getAddressTypeList(parent, val, divId, disId) {
- switch (val) {
- case "THANA":
- await getThana(divId, disId, parent);
- break;
- case "UPAZILA":
- await getUpazila(divId, disId, parent);
- break;
- case "CITY_CORPORATION":
- await getCitycorporation(divId, disId, parent);
- break;
- case "MUNICIPALITY":
- await getMunicipality(divId, disId, parent);
- break;
- }
- }
- function doProcess() {
- $("#permanentAddressDivision").change(function() {
- getDistrict($("#permanentAddressDivision"), $("#permanentAddressDistrict"), $("#permanentAddressTypeId"));
- });
- $("#presentAddressDivision").change(function() {
- getDistrict($("#presentAddressDivision"), $("#presentAddressDistrict"), $("#presentAddressTypeId"));
- });
- $("#permanentAddressDistrict").change(function() {
- $('input[type=radio][name=permanentAddressTypeValue]:checked').prop('checked', false);
- $("#permanentAddressTypeId").empty();
- });
- $("#presentAddressDistrict").change(function() {
- $('input[type=radio][name=presentAddressTypeValue]:checked').prop('checked', false);
- $("#presentAddressTypeId").empty();
- });
- $('input[type=radio][name=permanentAddressTypeValue]').change(function() {
- var typeValue = $('input[type=radio][name=permanentAddressTypeValue]:checked').val();
- getAddressTypeList($("#permanentAddressTypeId"), typeValue, $("#permanentAddressDivision").val(), $("#permanentAddressDistrict").val());
- });
- $('input[type=radio][name=presentAddressTypeValue]').change(function() {
- var typeValue = $('input[type=radio][name=presentAddressTypeValue]:checked').val();
- getAddressTypeList($("#presentAddressTypeId"), typeValue, $("#presentAddressDivision").val(), $("#presentAddressDistrict").val()).then(function() {
- if ($("#sameAsPermanent").is(":checked")) {
- $("#presentAddressTypeId").val($("#permanentAddressTypeId").val());
- $("#presentAddressTypeId").change();
- }
- });
- });
- $("#sameAsPermanent").change(function() {
- if (this.checked) {
- $("#presentAddressHouse").val($("#permanentAddressHouse").val());
- $("#presentAddressHouse").change();
- $("#presentAddressStreet").val($("#permanentAddressStreet").val());
- $("#presentAddressStreet").change();
- $("#presentAddressDivision").val($("#permanentAddressDivision").val());
- $("#presentAddressDivision").change();
- getDistrict($("#presentAddressDivision"), $("#presentAddressDistrict"), $("#presentAddressTypeId")).then(function(result) {
- $("#presentAddressDistrict").val($("#permanentAddressDistrict").val());
- $("#presentAddressDistrict").change();
- var typeValue = $('input[type=radio][name=permanentAddressTypeValue]:checked').val();
- $('input[type=radio][name=presentAddressTypeValue]').val([typeValue]);
- $('input[type=radio][name=presentAddressTypeValue]:checked').change();
- $("#presentAddressTypeId").val($("#permanentAddressTypeId").val());
- });
- } else {
- $("#presentAddressDivision").prop('selectedIndex', 0);
- $("#presentAddressDivision").trigger("change");
- $("#presentAddressDistrict").trigger("change");
- }
- });
- getDivision();
- };
- $(document).ready(function() {
- doProcess();
- });
- </script>
- <script>
- function getFirstLayers(id) {
- $.getJSON("/api/officelayers/" + id, function(result) {
- $("#firstSelection").empty();
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select office--", "");
- } else {
- opt = new Option("--অফিস বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#firstSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#firstSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#firstSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#firstSelection").css("display", "inline-block");
- })
- .done(function() {
- })
- .fail(function() {
- }).always(function() {
- });
- }
- function getZilas() {
- $.getJSON("/api/geo/districts", function(result) {
- $("#firstSelection").empty();
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select district--", "");
- } else {
- opt = new Option("--জেলা বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#firstSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#firstSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#firstSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#firstSelection").css("display", "inline-block");
- })
- .done(function() {
- })
- .fail(function() {
- }).always(function() {
- });
- }
- function onGetUpazilaZilaSelectionChange() {
- $.getJSON("/api/geo/upazilas/" + $("#firstSelection").val(), function(result) {
- $("#secondSelection").empty();
- $("#thirdSelection").empty();
- $("#secondSelection").css("display", "none");
- $("#thirdSelection").css("display", "none");
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select upazila--", "");
- } else {
- opt = new Option("--উপজেলা বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#secondSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#secondSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#secondSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#secondSelection").css("display", "inline-block");
- })
- .done(function() {
- })
- .fail(function() {
- }).always(function() {
- });
- }
- function GetOfficesByZila() {
- $.getJSON("/api/officelayers/" + $('#officeLayers').val() + "/" + $("#firstSelection").val(), function(result) {
- $("#secondSelection").empty();
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select office--", "");
- } else {
- opt = new Option("--অফিস বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#secondSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#secondSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#secondSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#secondSelection").css("display", "inline-block");
- })
- .done(function() {
- })
- .fail(function() {
- }).always(function() {
- });
- }
- function GetOfficesByUpazila() {
- $.getJSON("/api/officelayers/" + $('#officeLayers').val() + "/" + $("#firstSelection").val() + "/" + $("#secondSelection").val(), function(result) {
- $("#thirdSelection").empty();
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select Office--", "");
- } else {
- opt = new Option("--অফিস বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#thirdSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#thirdSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#thirdSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#thirdSelection").css("display", "inline-block");
- })
- .done(function() {
- })
- .fail(function() {
- }).always(function() {
- });
- }
- function getDivisions() {
- $.getJSON("/api/geo/division", function(result) {
- $("#firstSelection").empty();
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select division--", "");
- } else {
- opt = new Option("--বিভাগ বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#firstSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#firstSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#firstSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#firstSelection").css("display", "inline-block");
- }).done(function() {})
- .fail(function() {})
- .always(function() {});
- }
- function GetOfficesByDivision() {
- $.getJSON("/api/officelayers/division/" + $("#officeLayers").val() + "/" + $("#firstSelection").val(), function(result) {
- $("#secondSelection").empty();
- var opt;
- if (languageCode == "en") {
- opt = new Option("--Select office--", "");
- } else {
- opt = new Option("--অফিস বাছাই করুন--", "");
- }
- opt.setAttribute("style", "display: none;");
- $("#secondSelection").append(opt);
- $.each(result, function(i, field) {
- if (languageCode == "en") {
- $("#secondSelection").append(new Option(field.nameEnglish, field.id));
- } else {
- $("#secondSelection").append(new Option(field.nameBangla, field.id));
- }
- });
- $("#secondSelection").css("display", "inline-block");
- })
- .done(function() {})
- .fail(function() {})
- .always(function() {});
- }
- </script>
- <script>
- function ajaxPost(url, accept, send, postData, onSuccess) {
- $.ajax({
- type: "POST",
- url: url,
- dataType: accept,
- contentType: send,
- data: postData,
- success: onSuccess
- });
- }
- function onLoginSuccessPostGrievance(data) {
- $.post("/login?username=" + $("#phoneNumber").val() + "&password=" + "123qwe", postGrievance);
- }
- function getGrievance() {
- var grievance = {};
- var array = $("#tab3 :input").serializeArray();
- $.each(array, function() {
- grievance[this.name] = this.value || '';
- });
- var bodyContent = $("#body").summernote("code");
- grievance['body'] = bodyContent;
- var isAnonymous = false;
- if ($("#anonymous").is(":checked")) {
- isAnonymous = true;
- }
- grievance["isAnonymous"] = isAnonymous;
- grievance["serviceType"] = "NAGORIK";
- var officeId = getOfficeId();
- grievance["officeId"] = officeId || '';
- var files = [];
- $("tr.template-download.fade.in").find("p.name").find("a").each(function(){
- files.push($(this).attr("href"))
- })
- grievance["files"] = files;
- var grievance = JSON.stringify(grievance);
- return grievance;
- }
- function postGrievance(data) {
- var grievance = getGrievance();
- ajaxPost("/api/grievance", "json", "application/json; charset=utf-8", grievance, showMsgForGrievanceSubmission);
- }
- function showMsgForGrievanceSubmission(data) {
- var isEmpty = jQuery.isEmptyObject(data);
- closeLoading();
- if (data.trackingNumber) {
- if (languageCode == "en") {
- $("#trackingNumberBlock").html("Your complaint has been successfully submitted. Complaint's tracking number: <span class='trackingNumber'>" + data.trackingNumber + "</span>. <br />Please preserve this number to check the status of your complaint. <br /><br /> <a href='/dashboard.do' class='btn btn-primary btn-sm'>Go to my dashboard</a>");
- } else {
- $("#trackingNumberBlock").html("আপনার অভিযোগটি স্বার্থকভাবে জমা হয়েছে। অভিযোগটির ট্র্যাকিং নম্বর: <span class='trackingNumber'>" + data.trackingNumber + "</span>। <br />এই নম্বরটি সংরক্ষণ করুন যা ব্যবহার করে পরবর্তীতে আপনি আপনার অভিযোগটির অবস্থা জানতে পারবেন।<br /><br /> <a href='/dashboard.do' class='btn btn-primary btn-sm'>আপনার ড্যাশবোর্ডে যান</a>");
- }
- $('#formWizard').find('.button-submit').remove();
- } else {
- if (languageCode == "en") {
- $("#trackingNumberBlock").html("Sorry! Your complaint could not be submitted, please try again");
- } else {
- $("#trackingNumberBlock").html("দুঃখিত! আপনার অভিযোগটি জমা হয়নি, আরেকবার চেষ্টা করুন");
- }
- }
- }
- function registerComplainant(){
- var user = getComplainantDTO();
- ajaxPost("/register", "json", "application/json", user, null);
- }
- function doLogIn() {
- $.post("/login?username=" + $("#phoneNumber").val() + "&password=" + $("#pinNumber").val(), function(data) {
- var auth = getCookie('Authorization');
- if (auth != "") {
- $("#divPinNumber").css('display', 'none');
- $("#divRest").css('display', 'block');
- getJson("/api/complainant/" + $("#phoneNumber").val(), doAutopopulate);
- } else {
- }
- });
- }
- function loginForPinNumberModal(){
- $.post("/login?username=" + $("#phoneNumber").val() + "&password=" + $("#pinNumberForNewUser").val(), function(data) {
- var auth = getCookie('Authorization');
- if (auth != "") {
- $("#pinNumberModal").modal('hide');
- } else {
- }
- });
- }
- async function submitGrievance() {
- var auth = getCookie('Authorization');
- var userExist = await hasUser();
- if (!userExist) {
- var user = getComplainantDTO();
- ajaxPost("/register", "application/json", "application/json", user, null);
- } else {
- postGrievance();
- }
- }
- function getComplainantDTO() {
- var array = $('#tab1 :input, #tab2 :input').serializeArray();
- var user = {};
- $.each(array, function() {
- user[this.name] = this.value || '';
- });
- var user = JSON.stringify(user);
- return user;
- }
- function doRegister() {
- var user = getComplainantDTO();
- ajaxPost("/register", "application/json", "application/json", user, null);
- }
- function getJson(url, onGettingJson) {
- $.getJSON(url, onGettingJson);
- }
- function getUser() {
- getJson("/api/complainant/" + $("#phoneNumber").val(), checkIfUserExist);
- }
- async function hasUser() {
- var hasUSER, user;
- await $.getJSON("/api/complainant/" + $("#phoneNumber").val(), function(data) {
- hasUSER = data.success;
- });
- return hasUSER;
- }
- function checkIfUserExist(data) {
- if (data.success == true) {
- $("#divPinNumber").css('display', 'block');
- $("#divRest").css('display', 'none');
- } else {
- $("#divPinNumber").css('display', 'none');
- $("#divRest").css('display', 'block');
- }
- }
- function getCookie(cname) {
- var name = cname + "=";
- var decodedCookie = decodeURIComponent(document.cookie);
- var ca = decodedCookie.split(';');
- for (var i = 0; i < ca.length; i++) {
- var c = ca[i];
- while (c.charAt(0) == ' ') {
- c = c.substring(1);
- }
- if (c.indexOf(name) == 0) {
- return c.substring(name.length, c.length);
- }
- }
- return "";
- }
- function addressPopulate(type, divisionId, districtId, addressTypeValue, addressTypeId) {
- $("#" + type + "AddressDivision").val(divisionId);
- getDistrict($("#" + type + "AddressDivision"), $("#" + type + "AddressDistrict"), $("#" + type + "AddressTypeId")).then(function(result) {
- $("#" + type + "AddressDistrict").val(districtId);
- $('input[type=radio][name=' + type + 'AddressTypeValue]').val([addressTypeValue]);
- getAddressTypeList($("#" + type + "AddressTypeId"), addressTypeValue, divisionId, districtId).then(function() {
- $("#" + type + "AddressTypeId").val(addressTypeId);
- });
- });
- }
- function doAutopopulate(data) {
- var presentDivision, presentDistrict, presentTypeValue, presentTypeId;
- var permanentDivision, permanentDistrict, permanentTypeValue, permanentTypeId;
- $.each(data, function(name, value) {
- $('input[type=text][name=' + name + ']').val(value);
- });
- $("input[name=gender][value=" + data['gender'] + "]").prop('checked', true);
- $('select[name="+maleGuardianType+"]').val(data['maleGuardianType']);
- addressPopulate("present", data['presentAddressDivision'], data['presentAddressDistrict'], data['presentAddressTypeValue'], data['presentAddressTypeId']);
- addressPopulate("permanent", data['permanentAddressDivision'], data['permanentAddressDistrict'], data['permanentAddressTypeValue'], data['permanentAddressTypeId']);
- }
- function doLogIn() {
- $.post("/login?username=" + $("#phoneNumber").val() + "&password=" + $("#pinNumber").val(), function(data) {
- var auth = getCookie('Authorization');
- if (auth != "") {
- $("#divPinNumber").css('display', 'none');
- $("#divRest").css('display', 'block');
- getJson("/api/complainant/" + $("#phoneNumber").val(), doAutopopulate);
- } else {
- }
- });
- }
- function populateServiceDropdown(data) {
- if ($('#serviceDropDown').data('select2')) {
- $('#serviceDropDown').select2('destroy');
- }
- $select = $('#serviceDropDown');
- $select.html('');
- if (languageCode == "en") {
- $select.append('<option value="" disabled selected hidden>***Select Service***</option>');
- } else {
- $select.append('<option value="" disabled selected hidden>***সেবা বাছাই করুন***</option>');
- }
- var i = 0;
- $.each(data.services, function(key, val) {
- $select.append('<option value="' + val.id + '">' + val.name + '</option>');
- });
- var strOthers = 'অন্যান্য';
- if (languageCode == "en") {
- strOthers = 'Others';
- }
- $select.append('<option value="0">' + strOthers + '</option>');
- localStorage.setItem('services', JSON.stringify(data));
- $('#serviceDropDown').select2();
- $('#serviceDropDown').trigger('change');
- }
- function populateEmployeeDropDown(data) {
- $('#employeeDropDown').html('');
- $select = $('#employeeDropDown');
- $select.html('');
- //$select.append('<tbody>');
- $select.append('<option value="" disabled selected hidden>***Select Employee***</option>');
- $.each(data.objects, function(key, val) {
- $select.append('<option value="' + val.id + '">' + val.name + '</option>');
- })
- //$select.append('</tbody>');
- }
- function getOfficeId() {
- var officeId = 0;
- /*if ($("#thirdSelection").css('display') == 'inline-block') {
- officeId = $("#thirdSelection").val();
- } else if ($("#secondSelection").css('display') == 'inline-block') {
- officeId = $("#secondSelection").val();
- } else if ($("#firstSelection").css('display') == 'inline-block') {
- officeId = $("#firstSelection").val();
- }*/
- if ($("#thirdSelection").data('select2')) {
- officeId = $("#thirdSelection").val();
- } else if ($("#secondSelection").data('select2')) {
- officeId = $("#secondSelection").val();
- } else if ($("#firstSelection").data('select2')) {
- officeId = $("#firstSelection").val();
- }
- return officeId;
- }
- function officeChangeEventHandler() {
- var officeId = getOfficeId();
- var url = '/api/office/service/' + officeId;
- getJson(url, populateServiceDropdown);
- /*var url = '/api/office/employee/' + officeId;
- getJson(url, populateEmployeeDropDown);*/
- }
- function clearAllSelection() {
- $("#firstSelection").empty();
- $("#secondSelection").empty();
- $("#thirdSelection").empty();
- $("#serviceDropDown").empty();
- $("#firstSelection").css("display", "none");
- $("#secondSelection").css("display", "none");
- $("#thirdSelection").css("display", "none");
- }
- function clearServiceAndEmployeeDropdown() {
- $('#serviceDropDown').empty();
- //$('#employeeDropDown').empty();
- }
- function showSuccess(msg) {
- toastr.success(msg);
- }
- function showError(msg) {
- toastr.error(msg);
- }
- function showLoading() {
- $("#ajaxProcessingModal").modal('show');
- }
- function closeFileUploadModal() {
- //$("#fileUploadModal").modal('hide');
- }
- function closeLoading() {
- $("#ajaxProcessingModal").modal('hide');
- }
- function loadConfirmationTab(){
- var array = $('#tab1 :input, #tab2 :input,#tab3 :input').serializeArray();
- var files = new Array();
- $("#divFileUpload").contents().find("td p.name a").each(function() {
- var name = $(this).attr("href");
- files.push(name);
- });
- var userAndComplaint = {}
- var i = 0;
- $.each(array, function() {
- userAndComplaint[this.name] = this.value || '';
- });
- userAndComplaint["files"] = files;
- console.log(userAndComplaint);
- $("#confirmationDiv").html('');
- label = $("#nameLabel").text();
- label = label.substring(0,label.length-1);
- value = $("#name").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#nidOrBcnLabel").text();
- label = label.substring(0,label.length-1);
- value = $("#nidOrBcn").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#genderLabel").text();
- value = $("input[name='gender']:checked").parent('label').text().replace(/\s/g, '');
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- var label = $("#phoneNumberLabel").text();
- label = label.substring(0,label.length-1);
- var value = $("#phoneNumber").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#emailLabel").text().substring(0,label.length-1);
- value = $("#email").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- //$("#confirmationDiv").append("<h3>"+$("#permanentAddressLabel").text()+"</h3>");
- var strPermanentAddress = $("#permanentAddressHouse").val() + "<br />";
- strPermanentAddress += $("#permanentAddressStreet").val() + "<br />";
- strPermanentAddress += $("#permanentAddressTypeId option:selected").text() + ", ";
- strPermanentAddress += $("#permanentAddressDistrict option:selected").text() + ", ";
- strPermanentAddress += $("#permanentAddressDivision option:selected").text();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+$("#permanentAddressLabel").text()+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ strPermanentAddress+"</p></div></div>");
- var strPresentAddress = $("#presentAddressHouse").val() + "<br />";
- strPresentAddress += $("#presentAddressStreet").val() + "<br />";
- strPresentAddress += $("#presentAddressTypeId option:selected").text() + ", ";
- strPresentAddress += $("#presentAddressDistrict option:selected").text() + ", ";
- strPresentAddress += $("#presentAddressDivision option:selected").text();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+$("#presentAddressLabel").text()+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ strPresentAddress+"</p></div></div>");
- label = $("#birthdateLabel").text();
- value = $("input[name=birthDate]").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#occupationLabel").text();
- value = $("#occupation").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#serviceTrackingNumberLabel").text();
- value = $("#serviceTrackingNumber").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#serviceIdLabel").text();
- value = $("#serviceDropDown").val();
- if (value == "others") {
- value = $("#serviceOthers").val();
- }
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#submissionDateLabel").text();
- value = $("input[name=submissionDate]").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#relationLabel").text();
- value = $("input[name='relation']:checked").parent('label').text();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#subjectLabel").text();
- value = $("#subject").val();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'><p class=\"form-control-static\">"+ value+"</p></div></div>");
- label = $("#bodyLabel").text();
- value = $("#body").summernote("code");
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'>"+ value+"</div></div>");
- $("#confirmationDiv").append("</div>");
- /*
- label = $("#fileUploadLabel").text();
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+label+"</label><div class='col-md-8'>"+"</div></div>");
- $.each(files, function( index, value ) {
- $("#confirmationDiv").append("<div class=\"form-group\"><label class=\"control-label col-md-4\">"+value+"</label></div>");
- });*/
- }
- $(document).ready(function() {
- /*var iframeBody = $("#fileUploadFrame").contents().find("body");
- var iframeHeader = $("#fileUploadFrame").contents().find("head");
- var styleTag = iframeBody.append($('#fileUploadDiv'));
- $('#fileUploadDiv').html('');*/
- $('#officeLayers').on("change", function() {
- /* Following code checks if select2 exists with the dropdowns, if found, resets */
- if ($("#firstSelection").data('select2')) {
- $("#firstSelection").select2('destroy');
- }
- if ($("#secondSelection").data('select2')) {
- $("#secondSelection").select2('destroy');
- }
- if ($("#thirdSelection").data('select2')) {
- $("#thirdSelection").select2('destroy');
- }
- clearAllSelection();
- clearServiceAndEmployeeDropdown();
- switch (this.value) {
- case "":
- break;
- case "1":
- getFirstLayers("1");
- $("#firstSelection").off("change");
- $("#firstSelection").on("change", officeChangeEventHandler);
- $("#firstSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- break;
- case "2":
- getFirstLayers("2");
- $("#firstSelection").off("change");
- $("#firstSelection").on("change", officeChangeEventHandler);
- $("#firstSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- break;
- case "3":
- getDivisions("3");
- $("#firstSelection").off("change");
- $("#secondSelection").off("change");
- $("#firstSelection").on("change", GetOfficesByDivision);
- $("#secondSelection").on("change", officeChangeEventHandler);
- $("#firstSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- $("#secondSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- break;
- case "4":
- getZilas();
- $("#firstSelection").off("change");
- $("#secondSelection").off("change");
- $("#firstSelection").on("change", GetOfficesByZila);
- $("#secondSelection").on("change", officeChangeEventHandler);
- $("#firstSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- $("#secondSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- break;
- case "5":
- getZilas();
- $("#firstSelection").off("change");
- $("#firstSelection").on("change", onGetUpazilaZilaSelectionChange);
- $("#secondSelection").off("change");
- $("#secondSelection").on("change", GetOfficesByUpazila);
- $("#thirdSelection").off("change");
- $("#thirdSelection").on("change", officeChangeEventHandler);
- $("#firstSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- $("#secondSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- $("#thirdSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- break;
- case "6":
- getFirstLayers("6");
- $("#firstSelection").off("change");
- $("#firstSelection").on("change", officeChangeEventHandler);
- $("#firstSelection").select2({
- width: '220px',
- language: jsLangCodeForLibs
- });
- break;
- }
- });
- $("a[href='#tab3']").on('click', loadConfirmationTab);
- $("a.btn.btn-outline.green.button-next").on('click', function(){
- if ($("#tab2").hasClass("active")){
- loadConfirmationTab();
- }
- });
- $('#serviceDropDown').on('change', function(e){
- if ($(this).val() == "others") {
- $('#serviceOthers').removeClass('hide');
- } else {
- $('#serviceOthers').val('');
- $('#serviceOthers').addClass('hide');
- }
- });
- });
- </script>
- <script type="text/javascript">
- $(function() {
- if (!jQuery().bootstrapWizard) {
- return;
- }
- var form = $('#registerAndGrieveForm');
- var error = $('.alert-danger', form);
- var success = $('.alert-success', form);
- var requiredText = "";
- if (languageCode == "en") {
- requiredText = "This field is required";
- } else {
- requiredText = "এই তথ্যটি প্রদান করা আবশ্যক";
- }
- form.validate({
- doNotHideMessage: true,
- errorElement: 'span',
- errorClass: 'help-block help-block-error',
- focusInvalid: false,
- rules: {
- phoneNumber: {
- minlength: 11,
- maxlength: 11,
- required: true
- },
- pinNumber: {
- minlength: 6,
- required: true
- },
- name: {
- minlength: 3,
- required: true
- },
- nidOrBcn: {
- required: true
- },
- permanentAddressStreet: {
- required: true
- },
- permanentAddressDivision: {
- required: true
- },
- permanentAddressDistrict: {
- required: true
- },
- permanentAddressTypeValue: {
- required: true
- },
- permanentAddressTypeId: {
- required: true
- },
- email: {
- required: true,
- email: true
- }
- },
- messages: {
- phoneNumber: {
- required: requiredText
- },
- pinNumber: {
- required: requiredText
- },
- name: {
- required: requiredText
- },
- nidOrBcn: {
- required: requiredText
- },
- permanentAddressStreet: {
- required: requiredText
- },
- permanentAddressDivision: {
- required: requiredText
- },
- permanentAddressDistrict: {
- required: requiredText
- },
- permanentAddressTypeValue: {
- required: requiredText
- },
- permanentAddressTypeId: {
- required: requiredText
- },
- email: {
- required: requiredText
- }
- },
- errorPlacement: function(error, element) {
- if (element.attr("name") == "permanentAddressTypeValue") {
- error.insertAfter("#permanentAddressTypeValueDiv");
- } else if (element.attr("name") == "presentAddressTypeValue") {
- error.insertAfter("#presentAddressTypeValueDiv");
- } else {
- error.insertAfter(element);
- }
- },
- invalidHandler: function(event, validator) {
- success.hide();
- error.show();
- App.scrollTo(error, -200);
- },
- highlight: function(element) {
- $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
- },
- unhighlight: function(element) {
- $(element).closest('.form-group').removeClass('has-error');
- },
- success: function(label) {
- label.addClass('valid').closest('.form-group').removeClass('has-error').addClass('has-success');
- },
- submitHandler: function(form) {
- success.show();
- error.hide();
- }
- });
- var handleTitle = function(tab, navigation, index) {
- var total = navigation.find('li').length;
- var current = index + 1;
- var stepText = "";
- if (current == 1) {
- if (languageCode==null || languageCode=="fr") {
- stepText = "প্রথম ধাপ";
- } else if (languageCode=="en") {
- stepText = "Step 1";
- }
- } else if (current == 2) {
- if (languageCode==null || languageCode=="fr") {
- stepText = "দ্বিতীয় ধাপ";
- } else if (languageCode=="en") {
- stepText = "Step 2";
- }
- } else if (current == 3) {
- if (languageCode==null || languageCode=="fr") {
- stepText = "তৃতীয় ধাপ";
- } else if (languageCode=="en") {
- stepText = "Step 3";
- }
- }
- $('.step-title', $('#formWizard')).text(stepText);
- jQuery('li', $('#formWizard')).removeClass("done");
- var li_list = navigation.find('li');
- for (var i = 0; i < index; i++) {
- jQuery(li_list[i]).addClass("done");
- }
- if (current == 1) {
- $('#formWizard').find('.button-previous').hide();
- } else {
- $('#formWizard').find('.button-previous').show();
- }
- if (current >= total) {
- $('#formWizard').find('.button-next').hide();
- $('#formWizard').find('.button-submit').show();
- } else {
- $('#formWizard').find('.button-next').show();
- $('#formWizard').find('.button-submit').hide();
- }
- App.scrollTo($('.page-title'));
- }
- $('#formWizard').bootstrapWizard({
- 'nextSelector': '.button-next',
- 'previousSelector': '.button-previous',
- onTabClick: function(tab, navigation, index, clickedIndex) {
- success.hide();
- error.hide();
- if (form.valid() == false) {
- return false;
- }
- handleTitle(tab, navigation, clickedIndex);
- },
- onNext: function(tab, navigation, index) {
- success.hide();
- error.hide();
- if (form.valid() == false) {
- return false;
- }
- handleTitle(tab, navigation, index);
- if (index == 1){
- var auth = getCookie('Authorization');
- if (auth=="") {
- registerComplainant()
- $("#pinNumberModal").modal('show');
- return false;
- }
- }
- },
- onPrevious: function(tab, navigation, index) {
- success.hide();
- error.hide();
- handleTitle(tab, navigation, index);
- },
- onTabShow: function(tab, navigation, index) {
- var total = navigation.find('li').length;
- var current = index + 1;
- var $percent = (current / total) * 100;
- $('#formWizard').find('.progress-bar').css({
- width: $percent + '%'
- });
- handleTitle(tab, navigation, index);
- }
- });
- $('#formWizard').find('.button-previous').hide();
- $('#formWizard .button-submit').click(function() {
- showLoading();
- submitGrievance();
- }).hide();
- });
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement