How to Connect HTML Code to my Database and Form.

Ask the community
,
1

I want to create a QR Code (Quick Response Code) for the client who singed up the form. I copy some code in the internet. i want it connect to my form and database.

Code:

  <label class="control-label col-sm-2" for="content">Content:</label> 
  
  <div class="col-sm-10"> 
    <input type="text" class="form-control" id="content" placeholder="Enter content"> 
  </div> 
  
  <label class="control-label col-sm-2" for="content">Content:</label> 
  
  <div class="col-sm-10"> 
    <input type="text" class="form-control" id="content2" placeholder="Enter content"> 
  </div> 
</div> 
<div class="form-group">  
  <div class="col-sm-offset-2 col-sm-10"> 
    <button type="button" class="btn btn-default" id="generate">Generate</button> 
  </div> 
</div>
1 Like
2

hey geovel,
iā€™m not sure what is your goal,
can you explain ?

3

sorry Roi, I want to create a QR Code from my Formsā€¦

4

I want to make sure I understand correctly,
do you mean creating an image (in QR Code format) that contains data for each client from the database collection ?

Here is an example.
const userName = ā€˜geovelā€™;
$w(ā€˜#yourImageā€™).src = ā€˜https://api.qrserver.com/v1/create-qr-code/?data=ā€™ + userName;
Good luck!
Roi

5

Thank you Roi,
Yes, thatā€™s right, I want to create an QR Code that contains data for each client from the my database collection, but Iā€™m struggling doing it. could you please lend me some of your knowledge how to achieve it?
I badly need it. Iā€™m not really that good in coding. I hope you could help me. Thank you again :slight_smile:

6

Where did you stuck ?
Did you try the example above ?

7

Iā€™m stuck in how to add the code you send above. Iā€™m not really good at it, but I badly need it.

8

Hi Geovel,
Please paste your editor address here and we will look into it further

9

Here it is Roi ā†’ https://editor.wix.com/html/editor/web/renderer/edit/0f2a2a2e-c0ef-4f72-98b3-679302cef3fb?metaSiteId=a6fdb801-9819-4822-8a0c-9d8fd99355b4&editorSessionId=EF97BFFC-3CA8-4798-98F2-3E5BC3665CAD

Thank you in advance Roi, Merry Christmas

10

Ok, few more questions:

  1. Which Database collection is relevant ?
  2. Which fields or data do you want the QR Code to contain ?
  3. How or where do you want to use the QR Code image ?
11

Good day Roi, I hope youā€™re having a great day.

Which Database collection is relevant ?
-Database Name: regdog

Which fields or data do you want the QR Code to contain ?

  • All the fields, cause Iā€™m gonna print it.

How or where do you want to use the QR Code image ?

  • Iā€™m gonna print it and distribute it to clients who fill out my fields/registration

and the QR Code places on the regdog/profile (dynamic page). Thank you Roi

12

Hi,
Replace the HTML element with an image element.
Paste this code in ā€œregdog Profile (ID)ā€

$w.onReady(function () {
	$w('#dynamicDataset').onReady(()=> {
		const thisUser = $w('#dynamicDataset').getCurrentItem(); 
		const {title, service, handlername,email,street,city,state,zip,trainingStatus,dogname,breed,number,code} = thisUser;
		const dataOfUser = `${title} ${service} ${handlername} ${email} ${street} ${city} ${state} ${zip} ${trainingStatus} ${dogname} ${breed} ${number} ${code}`;
/*change to your image ID*/ $w('#yourImage').src = `https://api.qrserver.com/v1/create-qr-code/?size=500x500&data=${dataOfUser})`;
	});
});

Let me know how it goes

13

Hi Roi, Itā€™s PERFECTLY work! Thank you! Happy New Year Roi.

14

one last question, sorry. change text to html, so I can add some CSS so I can arrange and design. Thank you very much Roi. youā€™re a savior!

15

Hi Gevoel,
Iā€™m glad to hear that it worked out!
Here is an example of what you need:

<div>
    <span style="color:blue;margin-left:30px;">Hello World
    </span>
</div>

Good luck!

16

Hi Roi-

I was wondering if I could get some further in depth explanation here please as I am attempting a similar end goal and donā€™t understand what you meant when you said ā€œReplace the HTML element with an image element. Paste this code in ā€œregdog Profile (ID)ā€ā€ I have a html code that shows the sporting fixtures relevant to specific teams in my database and I need it to change depending on the selected team. Your advice regarding replacing the html element with an image element- is this within the database table or on the dynamic page?

This is an example of the html code I have for one division (I have different codes for the different team divisions:

This is my website:

Iā€™ve put the html code boxes in this page to demonstrate what I would love it to show but as they arenā€™t able to be ā€œconnected to dataā€ I donā€™t know how to link it up!

Please help me! Iā€™m desperate!

17

Hi Imogen ,
ā€œReplace the HTML element with an image element. Paste this code in ā€œregdog Profile (ID)ā€ā€ refers to a specific API that returns QR Code image.
If you need to pass information to your HTML component you need some this else.
There are two relevant methods for you. postMessage and onMessage .
Here is a great example of how to communicate with an iFrame.
In a Dynamic page you probably need to use getCurrentItem method .
Here is a sample example from the Dynamic page:

$w.onReady(() => {
    $w('#yourDataset').onReady(() => {
        let itemObj = $w("#yourDataset").getCurrentItem();
        $w("#html1").postMessage(itemObj.urlYouNeed);
    });
});

Feel free to paste your code here,
Good luck!
Roi

18

Hi Roi Bendet

I have a HTML code as

I have a dynamic page which consists of 5 names (text boxes) and 5 html elements. Each html element differs to the other at data-identifier=ā€œxxxxxā€ only (Please see in the code above). Now I want that the data-identifier of each html element to be connected to their respective text box. so that whatever values comes in the textbox1 (say Pepper) from my database is copied to data-identifier=ā€œPepperā€ of html1.

Let say text box with id = #text1 and the html element with id = #html1 . The text box is connected to some field called #Name 1 in my database called #Celebrities . Now I want my data identifier in my html element as posted above to be connected to the text box with id #text1 . So that whatever value comes in my textbox from the database when the dynamic page loads is copied to the data-identifier in html element.

Any help from you will be really very meaningful to me.

19

Hello, im Thiago
I working on a dynamic page but i cant link my html/website ā€œcontainerā€ with my database. Does any one knows what to do?