mirror/formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-01-24 18:59:22 -06:00
Code Issues Packages Projects Releases 119 Wiki Activity

update react example

Browse Source
This commit is contained in:
Matthias Nannt
2022-12-13 15:21:00 +01:00
parent 19bb1565f6
commit 237febf512
1 changed files with 31 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
apps/hq/src/components/forms/FormOverviewPage.tsx
View File

@@ -149,7 +149,7 @@ export default function FormOverviewPage() {
id="captureUrl"
type="text"
className="focus:border-brand focus:ring-brand block w-full rounded-r-md border-gray-300 bg-gray-100 shadow-sm sm:text-sm"
value={`${window.location.protocol}//${window.location.host}/capture/forms/${form.id}/submissions`}
value={`${window.location.protocol}//${window.location.host}/api/capture/forms/${form.id}/submissions`}
disabled
/>
</div>
@@ -220,7 +220,7 @@ export default function FormOverviewPage() {
id="captureUrl"
type="text"
className="focus:border-brand focus:ring-brand block w-full rounded-r-md border-gray-300 bg-gray-100 shadow-sm sm:text-sm"
value={`${window.location.protocol}//${window.location.host}/capture/forms/${form.id}/submissions`}
value={`${window.location.protocol}//${window.location.host}/api/capture/forms/${form.id}/submissions`}
disabled
/>
</div>
@@ -317,17 +317,35 @@ return (
<div className="col-span-3 rounded-md bg-black p-4 text-sm font-light text-gray-200">
<pre>
<code className="language-js whitespace-pre-wrap">
{`<form
onSubmit={({ data }) => {
fetch("${window.location.protocol}//${window.location.host}/capture/forms/${form.id}/submissions", {
method: "POST",
body: JSON.stringify({data}),
headers: {
Accept: "application/json",
},
});
}}>
{/* YOUR FORM */}
{`
<form
onSubmit={(e) => {
e.preventDefault();
fetch(
"${window.location.protocol}//${window.location.host}/api/capture/forms/${form.id}/submissions",
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
data: {
firstname: e.target.firstname.value,
email: e.target.email.value,
},
}),
}
);
console.log("submission sent!");
e.target.reset();
}}
>
<label htmlFor="firstname">First name</label>
<input type="text" name="firstname" id="firstname" />
<label htmlFor="email">Email</label>
<input type="email" name="email" id="email" placeholder="you@example.com" />
<button type="submit">Submit</button>
</form>`}
</code>
</pre>