I am getting jquery error while adding custom field in payment method in magento 2?

Question

I am trying to add custom fields in magento 2 but it is not working. I am getting

JQMIGRATE: jQuery.browser is deprecated jquery-migrate.js:41:4 console.trace() jquery-migrate.js:43:5 migrateWarn http://localhost/magento221100/pub/static/version1546515844/frontend/Magento/luma/en_US/jquery/jquery-migrate.js:43:5 get http://localhost/magento221100/pub/static/version1546515844/frontend/Magento/luma/en_US/jquery/jquery-migrate.js:58:6 f< http://localhost/magento221100/pub/static/version1546515844/frontend/Magento/luma/en_US/jquery/jquery.ba-hashchange.min.js:9:677 http://localhost/magento221100/pub/static/version1546515844/frontend/Magento/luma/en_US/jquery/jquery.ba-hashchange.min.js:9:389 http://localhost/magento221100/pub/static/version1546515844/frontend/Magento/luma/en_US/jquery/jquery.ba-hashchange.min.js:9:2 TypeError: this.test1 is not a function

Here is my code,

method-renderer.js

define(
 [
 'uiComponent',
 'Magento_Checkout/js/model/payment/renderer-list'
 ],
 function (
 Component,
 rendererList
 ) {
 'use strict';
 rendererList.push(
 {
 type: 'testpayment',
 component: 'Test_Testpayment/js/view/payment/method-renderer/testpayment'
 }
 );
 return Component.extend({
 getData: function() {
 return {
 'method': this.item.method,
 'additional_data': {
 'test1': $('#' +this.getCode() +'_test1').val(),
 'test': $('#' +this.getCode() +'_test').val()
 }
 };
 }
 });
 }
 );

method-renderer/tetpayment.js

define(
 [
 'Magento_Checkout/js/view/payment/default'
 ],
 function (Component) {
 'use strict';
 return Component.extend({
 defaults: {
 template: 'Test_Testpayment/payment/testpayment'
 },
 getCode: function() {
 return 'testing';
 },
 isActive: function() {
 return true;
 },
 validate: function() {
 var $form = $('#' + this.getCode() + '-form');
 return $form.validation() && $form.validation('isValid');
 },
 getData: function() 
 {
 return {
 'method': this.item.method,
 'additional_data': {
 'test1': this.test1(),
 'test': this.test()
 }
 };
 }
 });
 }
);

testpayment.html

<div class="payment-method" data-bind="css: {'_active': (getCode() == isChecked())}">
 <div class="payment-method-title field choice">
 <input type="radio"
 name="payment[method]"
 class="radio"
 data-bind="attr: {'id': getCode()}, value: getCode(), checked: isChecked, click: selectPaymentMethod, visible: isRadioButtonVisible()"/>
 <label data-bind="attr: {'for': getCode()}" class="label"><span data-bind="text: getTitle()"></span></label>
 </div>
 <div class="payment-method-content">
 <!-- -->
 <div class="actions-toolbar">
 <form class="form" data-bind="attr: {'id': getCode() + '-form'}">
 <fieldset data-bind="attr: {class: 'fieldset payment items ccard ' + getCode(), id: 'payment_form_' + getCode()}">
 <input type="text" name="payment[test]" data-bind="attr: {'id': getCode()+'_test'}">
 <input type="text" name="payment[test1]" data-bind="attr: {'id': getCode()+'_test1'}">
 <div id="payfortCardDetails">
 </div> 
 </fieldset>
 </form>
 <div class="primary">
 <button class="action primary checkout"
 type="submit"
 data-bind="
 click: placeOrder,
 attr: {title: $t('Place Order')},
 css: {disabled: !isPlaceOrderActionAllowed()},
 enable: (getCode() == isChecked())
 "
 disabled>
 <span data-bind="i18n: 'Place Order'"></span>
 </button>
 </div>
 </div>
 </div>
</div>

Main problem is in js file. Could you please help me.

• sky: Please refer this link magento.stackexchange.com/questions/181546/….