Uncaught Error: You're trying to decode an invalid JSON String
<p>I have facing problems with EXT js code to store data using Java.
Below is my code. Can one please help me.</p>

<p>Below is my NewCustomersVerify.js code:</p>

<pre><code>var myHit = Ext.create('Ext.data.Store',{
    fields:['Id','Name'],
    data:[
        {Id:'0',Name:'No'},
        {Id:'1',Name:'Yes'}
    ]
});
var myRisk = Ext.create('Ext.data.Store',{
    fields:['Id','Name'],
    data:[
        {Id:'0',Name:'Low'},
        {Id:'1',Name:'High'}
    ]
});

Ext.define('Test.test.web.test.view.test.NewCustomersVerify', {
     "xtype": "newCustomersVerify",
     "items": [{
          "xtype": "panel",
          "items": [{
               "xtype": "panel",
               "items": [{
                   "xtype": "displayfield",
                   "fieldLabel": "Name :",
                   "margin": 5,
                   "value": "TEXT",
                   "name": "customerName",
                   "title": "Customer Name",
                   "itemId": "lnajnbi",     "bind": "{customerName}"
              },{
                  "xtype": "displayfield",
                  "fieldLabel": "Nationality :",
                  "margin": 5,
                  "value": "TEXT",
                  "name": "nationality",
                  "title": "Nationality",
                  "itemId": "lnbjnbi",     "bind": "{nationality}"
             },{
                 "xtype": "displayfield",
                 "fieldLabel": "UniqueId No :",
                 "margin": 5,
                 "value": "TEXT",
                 "name": "uniqueIdNo",
                 "title": "UniqueId No",
                 "itemId": "lncjnbi",     "bind": "{uniqueIdNo}"
            },{
                    "xtype": "hiddenfield",
                    "fieldLabel": "HiddenText",
                    "bindable": "contactId",
                    "margin": 5,
                    "name": "contactId",
                    "title": "HiddenText",
                    "itemId": "oidgafi",
                    "bind": "{contactId}"
               },{
                   "xtype": "hiddenfield",
                   "fieldLabel": "HiddenText",
                   "bindable": "screeningId",
                   "margin": 5,
                   "name": "screeningId",
                   "title": "HiddenText",
                   "itemId": "didgafi",
                   "bind": "{screeningId}"
              }],
               "layout": "vbox",
               "autoScroll": true,
               "margin": 5,
               "columnWidth": 0.5,
               "itemId": "cieadni",
               "dockedItems": []
          }, {
              "xtype": "panel",
              "items": [
              {
               "xtype": "combo",
               "fieldLabel": "Was there a verify hit?",
               "name": "screeningHit",
               "margin": 5,
               "bindable": "screeningHit",
               "title": "Was there a verify hit?",
               "columnWidth": 0.5,
               "width": "100",
               "labelAlign": "left",
               "itemId": "kbfmjgi",
               displayField:'Name',
               valueField:'Id',
               queryMode:'local',
               store: myHit,

          }, {
              "xtype": "combo",
              "fieldLabel": "Country Risk (Nationality)",
              "name": "countryRisk",
              "margin": 5,
              "bindable": "countryRisk",
              "title": "Country Risk (Nationality)",
              "columnWidth": 0.5,
              "width": "100",
              "labelAlign": "left",
              "itemId": "kbgajgi",
              displayField:'Name',
              valueField:'Id',
              queryMode:'local',
              store: myRisk
         }, {
             "xtype": "combo",
             "fieldLabel": "Occupation Risk",
             "name": "occupationRisk",
             "margin": 5,
             "bindable": "occupationRisk",
             "title": "Occupation Risk",
             "columnWidth": 0.5,
             "width": "100",
             "labelAlign": "left",
             "itemId": "kbaajgi",
             displayField:'Name',
             valueField:'Id',             
             queryMode:'local',
             store: myRisk
        }, {
                "xtype" : "filefield",
                "fieldLabel": "Upload evidence of verify (Screenshot from the verify portal)",
                "msgTarget" : "side",
                "allowBlank" : "false",
                "buttonOnly" : "true",
                "margin" : 5,
                "name" : "uploadFile",
                buttonConfig : {
                    "text" : "Upload",
                    "icon" : "images/cloud/upload.png",
                },
                listeners : {
                    change :"uploadFile"
                }
            }],
         "layout": "vbox",
         "autoScroll": true,
         "margin": 5,
         "columnWidth": 0.5,         
         "itemId": "nehbeki",
         "dockedItems": []
    }],
          "layout": "column",
          "autoScroll": true,
          "border": true,
          "margin": 5,
          "itemId": "gjihcpi",
          "dockedItems": [{
               "xtype": "toolbar",
               "dock": "bottom",
               "ui": "footer",
               "isToolBar": true,
               "isDockedItem": true,
               "items": [{
                    "xtype": "tbfill",
                    "itemId": "hajhegi"
               }, 
/*               {
                    "xtype": "button",
                    "name": "cancel",
                    "text": "Cancel",
                    "margin": 5,
                    "isResetButton": true,
                    "itemId": "bbkmkmi",
                    "listeners": {
                         "click": "oncancelclick"
                    }
               },*/ 
               {
                    "xtype": "button",
                    "name": "Confirm",
                    "text": "Confirm",
                    "margin": 5,
                    "itemId": "celbgji",
                    "listeners": {
                         "click": "onConfirmclick"
                    }
               }],
               "columnWidth": 0.5,
               "itemId": "lfmepni",
               "dockedItems": []
          }]
     }],
     "border": true,
     "autoScroll": false,
//     "title": "New Customer Verify",
     "margin": 5,
     "itemId": "dinfmki",
     "dockedItems": [],
     "extend": "Ext.form.Panel",
     "listeners": {
          "afterrender": "onafterrender",
          "scope": "controller"
     },
     "requires": ["Test.test.web.test.controller.test.NewCustomersVerifyController", "Test.test.shared.test.viewmodel.test.NewCustomersVerifyViewModel", "Test.test.shared.test.model.test.NewCustomersVerifyModel"],
     "viewModel": "NewCustomersVerifyViewModel",
     "controller": "NewCustomersVerifyController"
});
</code></pre>

<p>Below is my button onConfirmclick function call on NewCustomersVerifyContoller.js</p>

<pre><code>onConfirmclick: function(me, e, eOpts) {
      var jsonData = {};
      jsonData.contactId = this.view.down('#oidgafi').getValue();
      jsonData.screeningId = this.view.down('#didgafi').getValue();
      jsonData.screeningHit = this.view.down('#kbfmjgi').getValue();
      jsonData.countryHit = this.view.down('#kbgajgi').getValue();
      jsonData.occupationHit = this.view.down('#kbaajgi').getValue();
      var scope = this.getView();
        Ext.MessageBox.show({
            msg : 'Saving data...',
            progressText : 'Saving...',
            width : 300,
            wait : true,
            waitConfig : {
                interval : 200
            }
        });
      Ext.Ajax.request({              
           url: 'secure/NewCustomersVerifyServiceWS/respond',
           method: 'POST',
           sender: scope,
           jsonData: jsonData,
           me: me,
           success: function(response, scope) {
                Ext.MessageBox.hide();
                responseData = Ext.JSON.decode(response.responseText);
                Ext.Msg.alert('Server Response', responseData.response.message);
                win = scope.sender.up();
                win.reportViewController.queryCriteria.controller.filterData(win.searchButtonRef);
                win.close();
           },
           failure: function(response, scope) {
                Ext.MessageBox.hide();
                responseData = Ext.JSON.decode(response.responseText);
                Ext.Msg.alert('Server Response', responseData.response.message);
           }
      }, scope);
 }
</code></pre>

<p>Below is the error i was getting on the browser console.</p>

<blockquote>
  <p>[E] Ext.JSON.decode(): You're trying to decode an invalid JSON String:
  Apache Tomcat/8.0.21 - Error
  reportH1
  {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:22px;}
  H2
  {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:16px;}
  H3
  {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:14px;}
  BODY
  {font-family:Tahoma,Arial,sans-serif;color:black;background-color:white;}
  B
  {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;} P
  {font-family:Tahoma,Arial,sans-serif;background:white;color:black;font-size:12px;}A
  {color : black;}A.name {color : black;}.line {height: 1px;
  background-color: #525D76; border: none;}
  <h1>HTTP Status 400 - </h1><p><b>type</b> Status report</p><p><b>message</b>
  </p><p><b>description</b> The request sent by the client was
  syntactically incorrect.</p><h3>Apache
  Tomcat/8.0.21</h3></p>
</blockquote>