Sending WIX Form Data via API to CRM URL (SOLVED)

I’ve been given this URL:
https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=******&name=Jack%20test&email=test@gmail.com&phone=07874787878&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip= ******’
I need to send the data from my WIX form straight to this URL so it’s goes into their CRM.

I’ve used this code below so far but with no luck so far apart from a fetch error. (I’ve used **** to blank out sensitive info)

How can I make this work?

$w . onReady ( function (){
});

import { fetch } from ‘wix-fetch’ ;

export function submit_click ( event ) {
let crmApiURL = ‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=********&name=Jack%20test&email=test@gmail.com&phone=07874787878&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip=*******’ ;

let apiQuery = ‘’ ;
if ( $w ( “#fname” ). value !== null && $w ( “#fname” ). value . length > 0 ) { crmApiURL += ‘&name=[’ + $w ( “#fname” ). value + ‘]’ ;}
//if ($w(“#lname”).value !== null && $w(“#lname”).value.length > 0) {crmApiURL += ‘&name=[’+$w(“#fname”).value+‘]’;}
if ( $w ( “#phone” ). value !== null && $w ( “#phone” ). value . length > 0 ) { crmApiURL += ‘&phone=[’ + $w ( “#phone” ). value + ‘]’ ;}
if ( $w ( “#email” ). value !== null && $w ( “#email” ). value . length > 0 ) { crmApiURL += ‘&email=[’ + $w ( “#email” ). value + ‘]’ ;}

let fullurl = crmApiURL + apiQuery
fetch ( crmApiURL , { method : ‘get’ })
. then (( fetchResult ) => {
})
. catch (( error ) => {
console . log ( error );
});}

Gone to WIX Arena for my help

The url is been added on ecah testing.
Try:
let crmApiURL [=](=‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=********&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip=';
DD) ['https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=********&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip=*******'](='https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=********&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip=
’;
DD) [;](=‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=********&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip=*******’;
DD)

Add each query to apiQuer, not to URL
if ( $w ( " #fname " ). value !== null && $w ( " #fname " ). value . length > 0 ){apiQuery += ‘&name=[’ + $w ( " #fname " ). value + ‘]’ ;}

Double check if the fetch is POST or GET

Changed it to this, getting ‘TypeError: Failed to fetch’

$w . onReady ( function (){
});

import { fetch } from ‘wix-fetch’ ;

export function submit_click ( event ) {
let crmApiURL = ‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=*******&name=Jack%20test&email=test@gmail.com&phone=07874787878&debts=0-5000&emp_status=Employed&c_emp_status=Working&industries=Travel&country=Wales&ref_page=ukdebtaid.co.uk&my_ip=*******’ ;
let apiQuery = ‘’ ;
if ( $w ( “#fname” ). value !== null && $w ( “#fname” ). value . length > 0 ) { apiQuery += ‘&name=[’ + $w ( “#fname” ). value + ‘]’ ;}
//if ($w(“#lname”).value !== null && $w(“#lname”).value.length > 0) {crmApiURL += ‘&name=[’+$w(“#fname”).value+‘]’;}
if ( $w ( “#phone” ). value !== null && $w ( “#phone” ). value . length > 0 ) { apiQuery += ‘&phone=[’ + $w ( “#phone” ). value + ‘]’ ;}
if ( $w ( “#email” ). value !== null && $w ( “#email” ). value . length > 0 ) { apiQuery += ‘&email=[’ + $w ( “#email” ). value + ‘]’ ;}

let fullurl = crmApiURL + apiQuery
fetch ( crmApiURL , { method : ‘post’ })
. then (( fetchResult ) => {
})
. catch (( error ) => {
console . log ( error );
});}

1 Like

Copy and paste the url into the Browser address bar. If it works the url is ok. The browser will show the response from the server.

Yes I get this message… ‘{“title”:“Lead Add Successfully”,“msg”:“valid”}’

I guess your issue is CORS. The next step is to debug using Chrome Dev Tools => network. On fetching data, you can monitor HTTP code, Request headers, Response headers, response.

For anyone looking for a full answer to this question, this is the working code below with *'s to hide IP & password.

Only problem I now have is the data isn’t being saved to my database collection.

import { fetch } from ‘wix-fetch’ ;

export function submit_click ( event ) {
let crmApiURL = ‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=*********f
let apiend = ‘&c_emp_status=NIL&industries=NIL&ref_page=ukdebtaid.co.uk&my_ip=*********’ ;

let apiQuery = ‘’ ;
if ( $w ( “#fname” ). value !== null && $w ( “#fname” ). value . length > 0 ) { apiQuery += ‘&name=’ + $w ( “#fname” ). value + ‘%20’ + $w ( “#lname” ). value + ‘’ ;}
if ( $w ( “#phone” ). value !== null && $w ( “#phone” ). value . length > 0 ) { apiQuery += ‘&phone=’ + $w ( “#phone” ). value + ‘’ ;}
if ( $w ( “#email” ). value !== null && $w ( “#email” ). value . length > 0 ) { apiQuery += ‘&email=’ + $w ( “#email” ). value + ‘’ ;}
if ( $w ( “#radioGroup1” ). value !== null && $w ( “#radioGroup1” ). value ) { apiQuery += ‘&debts=’ + $w ( “#radioGroup1” ). value + ‘’ ;}
if ( $w ( “#radioGroup2” ). value !== null && $w ( “#radioGroup2” ). value ) { apiQuery += ‘&emp_status=’ + $w ( “#radioGroup2” ). value + ‘’ ;}
if ( $w ( “#radioGroup3” ). value !== null && $w ( “#radioGroup3” ). value ) { apiQuery += ‘&country=’ + $w ( “#radioGroup3” ). value + ‘’ ;}

let fullurl = ‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=’ + apiQuery + '&c_emp_status=NIL&industries=NIL&ref_page=ukdebtaid.co.uk&my_ip=’ ;

fetch ( fullurl , { method : ‘post’ })
. then (( fetchResult ) => {
})
. catch (( error ) => {
console . log ( error );
});}

I actually had to change this slightly as the data wasn’t being saved to my database collection, the fetch() function needed moving to the backend.

1st is in the page code & then 2nd part of this code is saved in the backend as aModule.jsw.

import { local } from ‘wix-storage’ ;

import { fetchMe } from “backend/aModule.jsw”
$w . onReady ( function () {});

import { fetch } from ‘wix-fetch’ ;

export function submit_click ( event ) {
let crmApiURL = ‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=1111111
let apiend = ‘&c_emp_status=NIL&industries=NIL&ref_page=ukdebtaid.co.uk&my_ip=1111111’ ;
let apiQuery = ‘’ ;
if ( $w ( “#fname” ). value !== null && $w ( “#fname” ). value . length > 0 ) { apiQuery += ‘&name=’ + $w ( “#fname” ). value + ‘%20’ + $w ( “#lname” ). value + ‘’ ; }
//if ($w(“#lname”).value !== null && $w(“#lname”).value.length > 0) {crmApiURL += ‘&name=[’+$w(“#fname”).value+‘]’;}
if ( $w ( “#phone” ). value !== null && $w ( “#phone” ). value . length > 0 ) { apiQuery += ‘&phone=’ + $w ( “#phone” ). value + ‘’ ; }
if ( $w ( “#email” ). value !== null && $w ( “#email” ). value . length > 0 ) { apiQuery += ‘&email=’ + $w ( “#email” ). value + ‘’ ; }
if ( $w ( “#radioGroup1” ). value !== null && $w ( “#radioGroup1” ). value ) { apiQuery += ‘&debts=’ + $w ( “#radioGroup1” ). value + ‘’ ; }
if ( $w ( “#radioGroup2” ). value !== null && $w ( “#radioGroup2” ). value ) { apiQuery += ‘&emp_status=’ + $w ( “#radioGroup2” ). value + ‘’ ; }
if ( $w ( “#radioGroup3” ). value !== null && $w ( “#radioGroup3” ). value ) { apiQuery += ‘&country=’ + $w ( “#radioGroup3” ). value + ‘’ ; }

console . log ( "1:"  +  crmApiURL ) 
console . log ( "2:"  +  apiQuery ) 

// etc. for each property
let fullurl = ‘https://www.nationaldebtassistance.org.uk/portal/ukdebtaid_api.php?user_id=UKDE0059&user_token=UKDEB0D4E&user_pass=1111111’ + apiQuery + ‘&c_emp_status=NIL&industries=NIL&ref_page=ukdebtaid.co.uk&my_ip=1111111’ ;

console . log ( "3:"  +  fullurl ) 
fetchMe ( fullurl ). then ( resp  => {  console . log ( "Response from fetch:" ,  resp ) }) 

}

/////Backend Code/////
import { fetch } from “wix-fetch” ;

export function fetchMe ( url ) {
return fetch ( url , { method : ‘post’ })
. then (( fetchResult ) => {
return fetchResult
})
. catch (( error ) => {
console . log ( error );
return error
})
}