View Tagihan NOP

<div class="row">
  <div class="col-md-12 col-sm-12 col-xs-12">
    <div class="x_panel">
      <div class="x_title">
        <h2><i class="fa fa-edit"></i> PEMBAYARAN TAGIHAN</h2>
        <div class="clearfix"></div>
      </div>
      <div class="x_content">
        <tr>
          <form>
            <div class="form-group row">
              <div class="col-md-3 col-sm-9 col-xs-12"></div>
              <div class="col-md-4 col-sm-9 col-xs-12">
                <label class="control-label">NOP</label>
                <input type="text" name="nop_wp" id="nop_wp" class="form-control" autocomplete="off"/>
              </div>
              <div class="col-md-2 col-sm-9 col-xs-12">
                <label class="control-label">Tahun</label>
                <input type="text" name="thn_wp" id="thn_wp" class="form-control" autocomplete="off"/>
              </div>
              <div class="col-md-3 col-sm-9 col-xs-12"></div>
            </div>
            <div class="form-group row">
              <div class="col-md-3 col-sm-9 col-xs-12"></div>
              <div class="col-md-3 col-sm-9 col-xs-12">
                <label class="control-label"></label>
                <input type="button" name="inquiry" id="inquiry" value="INQUIRY" class="form-control btn btn-info" />
              </div>
            </div>
          </form>
        </tr>
      </div>
    </div>

<div class="row">
  <div class="col-md-12 col-sm-12 col-xs-12">
    <div class="x_panel">
      <div class="x_title">

        <div class="modal-body">
          <form role="form" method="POST" enctype="multipart/form-data">

           <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" ><strong>HASIL PENCARIAN :</strong></label>
              <div class="ln_solid"></div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Kode Transaksi</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                  <input type="text" name="kdtrx" class="form-control col-md-7 col-xs-12" value="JOG<?php echo $tgljam ?>" readonly/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >NOP</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                  <input type="text" name="nop_wp" id="nop_wp" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Tahun Pajak</label>
               <div class="col-sm-3 col-xs-12">
                <input type="text" name="thn_wp" id="thn_wp" autocomplete="off" class="form-control col-md-7 col-xs-12" readonly required onkeyup="this.value = this.value.toUpperCase()"/>
               </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Nama Kecamatan</label>
               <div class="col-sm-6 col-xs-6">
                <input type="text" name="nm_kec" id="nm_kec" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
               </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Nama Kelurahan</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                  <input type="text" name="nm_kel" id="nm_kel" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Nama Wajib Pajak</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                  <input type="text" name="nm_wp" id="nm_wp" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Tanggal Jatuh Tempo</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                  <input type="text" name="tgl_jt" id="tgl_jt" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Tagihan</label>
                <div class="col-md-3 col-sm-6 col-xs-12">
                  <input type="text" name="tagihan" id="tagihan" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Denda</label>
                <div class="col-md-3 col-sm-6 col-xs-12">
                  <input type="text" name="denda" id="denda" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

            <div class="form-group row">
              <label class="control-label col-md-3 col-sm-3 col-xs-12" >Jumlah</label>
                <div class="col-md-3 col-sm-6 col-xs-12">
                  <input type="text" name="jml" id="jml" autocomplete="off" readonly class="form-control col-md-7 col-xs-12" required onkeyup="this.value = this.value.toUpperCase()"/>
                </div>
            </div>

        </div>
<!--             <div class="modal-footer" style="padding-right:45px; " >
                <button type="button" class="btn btn-default reset" data-dismiss="modal" >Cancel</button>
                <button type="submit" name="simpandata" class="btn btn-primary">Simpan Data</button>
            </div> -->
          </form>
      </div>
    </div>
  </div>
</div>


  </div>


<script type="text/javascript">
$(document).ready(function() {
  $('#inquiry').click(function(){
  $('.hasil').show();
    PROSES.CEK_NOP();
  });
  PROSES= {
    init : function(){
    },
    CEK_NOP : function(){
      data = {
        nop : $('#nop_wp').val(),
        thn : $('#thn_wp').val(),
        token :"xxxxxxxx",
        kdbank: "xxxxxx"
      };
      $.post("inquiry_tagihan.php",data,function(obj){

        var json = JSON.parse(obj);
        console.log(json.responseData['NO_KK']);

        $('#nop').val(json.responseData['NOP']);
        $('#thn').val(json.responseData['THN_PAJAK_SPPT']);
        $('#nm_kec').val(json.responseData['NM_KECAMATAN']);
        $('#nm_kel').val(json.responseData['NM_KELURAHAN']);
        $('#nm_wp').val(json.responseData['NM_WP_SPPT']);
        $('#tgl_jt').val(json.responseData['TGL_JATUH_TEMPO_SPPT']);
        $('#tagihan').val(json.responseData['TAGIHAN']);
        $('#denda').val(json.responseData['DENDA']);
        $('#jml').val(json.responseData['JML']);

      }).fail(function(err){
        alert('Error: '+err.status+' '+err.statusText);
      });
    }
  }
});
</script>

<script type="text/javascript">
  $(document).ready(function() {
    $(".reset").click(function() {
      $("input").val("");
      $("textarea").val("");
      // $("select").val($("select").children().eq(0).val());
    });
  });
</script>

<script>
  $(function() {
      $('.hasil').hide();

  });
</script>