# Formulario HTML / Script JS Newsletter

## Cómo enviar contactos a Woowup desde el popup de registro en tu web mediante un script

Si tienes un popup o landing en el cual pides datos a tus usuarios para que se registren al newsletter o a alguna promocion, es posible enviar este usuario a Woowup mediante un llamado simple de AJAX.&#x20;

{% hint style="warning" %}
Es necesario tener la **Clave Pública** de tu programa en Woowup. La puedes conseguir con rol de **Super-Admin** en la parte de configuración.
{% endhint %}

### Ejemplo jQuery

```markup
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>My Ecommerce</title>
	<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
	<script>
		var settings = {
			"async": true,
			"crossDomain": true,
			"url": "https://events.woowup.com/events/users",
			"type": "POST",
			"headers": {
				"cache-control": "no-cache",
				"content-type": "application/json"
			},
			"data": JSON.stringify({
				"app": "CLAVE_PUBLICA_WOOWUP",
				"service_uid": "9988776655",
				"document": "1122334455",
				"email": "john@doe.com",
				"tags": "ecommerce,newsletter",
				"birthdate": "1989-06-22",
				"telephone": "+549116655443322",
				"gender": "M",
				"first_name": "John",
				"last_name": "Doe",
				"custom_attributes": {
	                "one_attribute": "one value",
		            "other_attribute": "other value",
	            }
			})
		}

		$.ajax(settings).done(function (response) {
			console.log(response);
		}).fail(function (error){ 
		        console.log(JSON.stringify(error)) 
		});
	</script>
</head>
<body>
</body>
</html>
```

{% hint style="warning" %}
En el caso de los Custom\_attributes tipo **FECHA** deben ir en formato AAAA-MM-DD
{% endhint %}

### Parámetros disponibles para enviar

| Parameter                | Required |                                                                      |
| ------------------------ | -------- | -------------------------------------------------------------------- |
| app                      | yes      | Account identificator                                                |
| service\_uid             | No       | Customer's identificator                                             |
| email                    | No       | Customer's email                                                     |
| telephone                | No       | Customer's telephone                                                 |
| tags                     | No       | Comma separated tags                                                 |
| birthdate                | No       | Customer's birthday Format: YYYY-MM-DD                               |
| gender                   | No       | Customer's gender. Must be "F" or "M"                                |
| first\_name              | No       | Customer's first name                                                |
| last\_name               | No       | Customer's last name                                                 |
| mailing\_enabled         | No       | The user can or can't receive emails. Values: "enabled", "disabled". |
| mailing\_enabled\_reason | No       | Reason why the user can't receive emails.                            |
| sms\_enabled             | No       | The user can or can't receive SMS. Values: "enabled", "disabled".    |
| sms\_enabled\_reason     | No       | Reason why the user can't receive SMS.                               |

<mark style="color:green;">`POST`</mark> `https://api.woowup.com/apiv3/users`

#### Request Body

| Name             | Type   | Description                                                                     |
| ---------------- | ------ | ------------------------------------------------------------------------------- |
| mailing\_enabled | string | <p>The user can or can't receive emails. <br>Values: "enabled", "disabled".</p> |

{% tabs %}
{% tab title="200 " %}

```
```

{% endtab %}
{% endtabs %}

<mark style="color:green;">`POST`</mark> `https://api.woowup.com/apiv3/users`

#### Request Body

| Name             | Type   | Description                                                                     |
| ---------------- | ------ | ------------------------------------------------------------------------------- |
| mailing\_enabled | string | <p>The user can or can't receive emails. <br>Values: "enabled", "disabled".</p> |

{% tabs %}
{% tab title="200 " %}

```
```

{% endtab %}
{% endtabs %}

### HTTP Response Codes

| HTTP Code | Name        | Description           |
| --------- | ----------- | --------------------- |
| 200       | Ok          | Everything is ok      |
| 400       | Bad Request | Invalid parameters    |
| 403       | forbidden   | Account doesn't exist |

### Ejemplo funcional jQuery 2.2.4

{% hint style="info" %}
El código  "app": "XXXXXX" lo conseguís dentro de Configuración > Claves para desarrolladores. Es necesario tener permiso de super admin para ver las claves.
{% endhint %}

```markup
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  crossorigin="anonymous"></script>
</head>
<body>
  <form action="">
    <table>
      <tr>
        <td>Email:</td>
        <td><input type="text" name="email"/></td>
      </tr>
      <tr>
        <td>Nombre:</td>
        <td><input type="text" name="first_name"/></td>
      </tr>
      <tr>
        <td>Apellido:</td>
        <td><input type="text" name="last_name"/></td>
      </tr>
      <tr>
        <td>Como nos encontraste?:</td>
        <td>
          <select name="source">
              <option value="recomendacion">Recomendación</option>
              <option value="via_publica">Publicidad vía pública</option>
              <option value="internet">Publicidad Internet</option>
          </select>
        </td>
      </tr>
      <tr><td colspan=2><button type="button" id="sent">Enviar</button></td></tr>
    </table>
  </form>
  <script>
    $(document).ready(function(){
      $("#sent").click(function(){
        var settings = {
              "async": true,
              "crossDomain": true,
              "url": "https://events.woowup.com/events/users",
              "type": "POST",
              "headers": {
                "cache-control": "no-cache",
                "content-type": "application/json"
              },
              "data": JSON.stringify({
              "app": "CLAVE_PUBLICA_WOOWUP",
              "email": $('input[name=email]').val(),
              "tags": "ecommerce,facebook,pantalon,popup",
              "first_name": $('input[name=first_name]').val(),
              "last_name": $('input[name=last_name]').val(),
              "custom_attributes": {
	                "source": $( "select[name=source]" ).val()
	            }
            })
        }

        $.ajax(settings).done(function (response) {
          console.log(response);
        });
      });

    });
  </script>
</body>
</html>
```
