Я пытаюсь опубликовать данные с помощью метода http.post с некоторыми данными, как показано ниже:
Вот данные публикации:
service.ts:
component.ts:
HTML:
Я сталкиваюсь со следующей ошибкой:
{
"oid": "110000000hWGF",
"retURL": "http://",
"company": "",
"city": "",
"state": "",
"campaign_name": "Test",
"first_name": "test",
"last_name": "Vejani",
"email": "[email protected]",
"phone": "9090990088",
"": true
}
private api = 'https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8&orgId=';
postFromData(data: any, id): Observable<any> {
return this.http.post(this.api + id, data);
}
formdata = {
fname: '',
lname: '',
email: '',
phone: '',
acceptTerms: false,
oid: '00DG0000000hWJV',
company: '',
city: '',
state: '',
retURL: 'http://',
campaign_name: 'Test'
};
@ViewChild('f') f!: NgForm;
const allValues = {
"oid": "110000000hWGF",
"retURL": "http://",
"company": "",
"city": "",
"state": "",
"campaign_name": "Test",
"first_name": "test",
"last_name": "Vejani",
"email": "[email protected]",
"phone": "9090990088",
"": true
}
public submit() {
this.httpAPI.postFromData(allValues, '110000000hWGF').subscribe((response) => {
console.log("response:", response)
})
}
<form
*ngIf="!isSubmitted"
class="salesforce-form"
name="form"
#f="ngForm"
(ngSubmit)="f.form.valid && submit(f)"
novalidate
>
<input
type="hidden"
name="oid"
value="{{ this.salesforceId }}"
[(ngModel)]="formdata.oid"
#oid="ngModel"
/>
<input
type="hidden"
name="retURL"
value="{{ formdata.retURL }}"
[(ngModel)]="formdata.retURL"
#retURL="ngModel"
/>
<input
id="company"
maxlength="40"
name="company"
size="20"
type="hidden"
[(ngModel)]="formdata.company"
#company="ngModel"
/>
<input
id="city"
maxlength="40"
name="city"
size="20"
type="hidden"
[(ngModel)]="formdata.city"
#city="ngModel"
/>
<input
id="state"
maxlength="20"
name="state"
size="20"
type="hidden"
[(ngModel)]="formdata.state"
#state="ngModel"
/>
<input
type="hidden"
id="{{ this.salesforceId }}"
maxlength="255"
name="campaign_name"
size="20"
[(ngModel)]="formdata.campaign_name"
#campaign_name="ngModel"
/>
<h2
*ngIf="this.form.formTitle"
id="{{ this.formtitleid }}"
class="section-title"
>
{{ this.form.formTitle }}
</h2>
<div class="salesforce-page-inputs">
<div class="sf-container">
<div class="field">
<label
><span class="field-name"
>First name <span class="asteric">*</span></span
><input
class="form-field"
id="first_name"
maxlength="40"
name="first_name"
size="20"
type="text"
[(ngModel)]="formdata.fname"
required
#fname="ngModel"
[ngClass]="{ 'is-invalid': f.submitted && fname.errors }"
/></label>
<div *ngIf="f.submitted && fname.errors" class="invalid-msg">
<div *ngIf="fname.errors['required']">
First name field is required
</div>
</div>
</div>
<div class="field">
<label class="lname-lbl"
><span class="field-name"
>Last name <span class="asteric">*</span></span
><input
class="form-field"
id="last_name"
maxlength="80"
name="last_name"
size="20"
type="text"
[(ngModel)]="formdata.lname"
required
#lname="ngModel"
[ngClass]="{ 'is-invalid': f.submitted && lname.errors }"
/></label>
<div *ngIf="f.submitted && lname.errors" class="invalid-msg">
<div *ngIf="lname.errors['required']">
Last name field is required
</div>
</div>
</div>
<div class="field">
<label class="email-lbl"
><span class="field-name"
>Email address <span class="asteric">*</span></span
><input
class="form-field"
id="email"
maxlength="80"
name="email"
size="20"
type="email"
[(ngModel)]="formdata.email"
required
email
#email="ngModel"
[ngClass]="{ 'is-invalid': f.submitted && email.errors }"
/></label>
<div *ngIf="f.submitted && email.errors" class="invalid-msg">
<div *ngIf="email.errors['required']">
Email address field is required
</div>
<div *ngIf="email.errors['email']">
Please use a valid email address
</div>
</div>
</div>
<div class="field">
<label class="phone-lbl"
><span class="field-name">Phone number</span
><input
maxlength="10"
type="text"
class="form-field"
id="tel-phone"
name="phone"
[(ngModel)]="formdata.phone"
pattern="^[0-9]*$"
#phone="ngModel"
[ngClass]="{
'is-invalid': f.submitted && phone.errors?.pattern
}"
/></label>
<div *ngIf="phone.dirty && phone.invalid" class="invalid-msg">
<div *ngIf="phone.errors?.pattern">
Phone number must only contain numbers
</div>
</div>
</div>
</div>
</div>
<div class="optional-checkbox" *ngIf="this.form.hasCheckbox">
<label
>
<input
type="checkbox"
id="{{ this.salesforceId }}"
value="1"
required
#acceptTerms="ngModel"
[(ngModel)]="formdata.acceptTerms"
[ngClass]="{ 'is-invalid': f.submitted && acceptTerms.errors }"
/><span
>{{ this.form.checkboxLabel }} <span class="asteric">*</span></span
>
<div
*ngIf="f.submitted && acceptTerms.errors"
class="invalid-msg text-center"
>
This checkbox is required
</div>
</label>
</div>
<div class="submit">
<button class="primary-btn">Submit</button>
</div>
</form>
Полина
Вопрос задан14 февраля 2024 г.