# \[Solved\] How to open in new tab with wix location

**URL:** <https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122>\
**Category:** Ask the community\
**Tags:** question, code\
**Created:** [February 18, 2021, 6:38pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122 "2021-02-18T18:38:25Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![sktvinc](https://avatars.discourse-cdn.com/v4/letter/s/e56c9b/32.png) [@sktvinc](https://forum.wixstudio.com/u/sktvinc)\
**Post date:** [February 18, 2021, 6:38pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/1 "2021-02-18T18:38:25Z")

</div>

Hello, How do I get this to open in a new tab on button click?

I don’t know anything about coding, this code was created for me, please don’t direct me to an article. I need someone to put the necessary code into mine. I understand I need a “target blank” code but, I do not know where it goes and I can’t find any help online, I have searched for hours.  
Thank you

import wixLocation from ‘wix-location’ ;

$w.onReady( function () {

$w( ‘#button1’ ).onClick((event, $w) =\> {  
checkValues();  
});

$w( ‘#input1’ ).onKeyPress((event, $w) =\> {

setTimeout(() =\> {

if (event.key === “Enter” ) {

checkValues();

}  
}, 10 );  
});

});

function checkValues() {  
if ($w( ‘#input1’ ).value === ‘5’ ) {  
wixLocation.to( “[google.com](http://google.com)” )  
} **else if** ($w( ‘#input1’ ).value === ‘6’ ) {  
wixLocation.to( “google.com” )  
}  
}

---

<div class="post-metadata">

**Author:** ![J.D](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/j.d/32/7312_2.png) [@J.D](https://forum.wixstudio.com/u/J.D)\
**Post date:** [February 18, 2021, 7:11pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/2 "2021-02-18T19:11:34Z")

</div>

You cannot open a new tab with wixLocation.  
Only clickable links can be set to open a new tab via Velo.  
There’s a way to open a new tab automatically using custom element (for premium accounts) but it’s more complicated and even then some browsers won’t let you open a link in new tab without a direct click.

---

<div class="post-metadata">

**Author:** ![sktvinc](https://avatars.discourse-cdn.com/v4/letter/s/e56c9b/32.png) [@sktvinc](https://forum.wixstudio.com/u/sktvinc)\
**Post date:** [February 18, 2021, 7:14pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/3 "2021-02-18T19:14:22Z")

</div>

Thank you so much!! - Okay this was the information I was finding. Is there a different way to write my code so that I can use a new-tab function? Essentially what I have is an input box where it recognizes specific numbers and redirects to specific links based on the inputted number.

---

<div class="post-metadata">

**Author:** ![J.D](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/j.d/32/7312_2.png) [@J.D](https://forum.wixstudio.com/u/J.D)\
**Post date:** [February 18, 2021, 7:22pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/4 "2021-02-18T19:22:15Z")

</div>

@sktvinc You can use a “Go” button (instead of “Enter” key).  
And write some code like:

```javascript
$w.onReady(() => {
$w("#goButton").target = "_blank";
$w("#input1").onInput(event => {
if($w("#input1").value === "5" || $w("#input1").value === "6"){
	$w("#goButton"). link = "https://some-link.com";
} else if($w("#input1").value === "7"){
	$w("#goButton"). link = "https://another-link.com";
} else {
	$w("#goButton"). link = "https://different-link.com";
}
})
})

```

Then once the users click the Go button they will be redirected to the link on a different tab.

---

<div class="post-metadata">

**Author:** ![sktvinc](https://avatars.discourse-cdn.com/v4/letter/s/e56c9b/32.png) [@sktvinc](https://forum.wixstudio.com/u/sktvinc)\
**Post date:** [February 19, 2021, 1:09am UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/5 "2021-02-19T01:09:46Z")

</div>

@jonatandor35 Thank you so much, this is exactly what I needed! I appreciate the clear help!!

---

<div class="post-metadata">

**Author:** ![CODE-NINJA](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/code-ninja/32/110588_2.png) [@CODE-NINJA](https://forum.wixstudio.com/u/CODE-NINJA)\
**Post date:** [February 23, 2021, 3:51am UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/6 "2021-02-23T03:51:32Z")

</div>

@jonatandor35 Useful.  
Seems as if i ran into a similar problem. 😅

---

<div class="post-metadata">

**Author:** ![gamesplaylot](https://avatars.discourse-cdn.com/v4/letter/g/a587f6/32.png) [@gamesplaylot](https://forum.wixstudio.com/u/gamesplaylot)\
**Post date:** [April 12, 2024, 7:11pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/7 "2024-04-12T19:11:38Z")

</div>

This might also be helpful to someone

export function image7\_click(event) { // in case of image  
$w(“#image7”).target = “\_blank”;  
const currentItem = $w(‘#dynamicDataset’).getCurrentItem();  
const url1 = currentItem.urlField;  
if (url1) {  
$w(“#image7”).link = url1;  
}  
}

---

<div class="post-metadata">

**Author:** ![Ahmet\_Guney](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/ahmet_guney/32/100047_2.png) [@Ahmet\_Guney](https://forum.wixstudio.com/u/Ahmet_Guney)\
**Post date:** [November 24, 2024, 3:35pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/8 "2024-11-24T15:35:58Z")

</div>

Hello, I have added a hotel reservation bar to my site, I redirect to an external site with dynamic data. I used the code below, but I can’t open it in a new tab. Is there a way to do this?

// Wix Velo sayfa kodu  
import wixLocation from ‘wix-location’;

$w.onReady(function () {  
// Bugünün tarihini al  
let today = new Date();  
let tomorrow = new Date();  
tomorrow.setDate(today.getDate() + 1); // Bir gün sonrasını ayarla

```
// DatePicker'lara varsayılan değerleri ata
$w('#datePickerIn').value = today;
$w('#datePickerOut').value = tomorrow;

// Tarih biçimlendirme fonksiyonu
function formatDate(date) {
    let month = (date.getMonth() + 1).toString().padStart(2, '0'); // Ay 0-11 arası olduğundan 1 ekliyoruz
    let day = date.getDate().toString().padStart(2, '0');
    let year = date.getFullYear();
    return `${month}/${day}/${year}`;
}

$w('#submitButton').onClick(() => {
    // DatePicker'lardan tarihleri al
    let selectedDateIn = $w('#datePickerIn').value;
    let selectedDateOut = $w('#datePickerOut').value;

    // Eğer tarih seçilmemişse hata döndür
    if (!selectedDateIn || !selectedDateOut) {
        console.log('Lütfen hem giriş hem de çıkış tarihi seçiniz.');
        return;
    }

    // Tarihleri MM/DD/YYYY formatına dönüştür
    let formattedDateIn = formatDate(selectedDateIn);
    let formattedDateOut = formatDate(selectedDateOut);

    // Dropdown'lardan değerleri al
    let adults = $w('#adultsDropdown').value;
    //let children = $w('#childrenDropdown').value;
    let hotelID = $w('#hotelDropdown').value;
    let languageID = 19;
    let rooms = 1;

    // Linki oluştur
    let bookingLink = `https://bookings.travelclick.com/${hotelID}?Adults=${adults}&DateIn=${formattedDateIn}&DateOut=${formattedDateOut}&LanguageID=${languageID}&Rooms=${rooms}#/guestsandrooms`;

    console.log(bookingLink); // Linki kontrol edebilir veya yönlendirme yapabilirsiniz.

    // Kullanıcıyı linke yönlendir
    wixLocation.to(bookingLink);
});

```

});

---

<div class="post-metadata">

**Author:** ![Pratham](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/pratham/32/119586_2.png) [@Pratham](https://forum.wixstudio.com/u/Pratham)\
**Post date:** [November 24, 2024, 6:19pm UTC](https://forum.wixstudio.com/t/solved-how-to-open-in-new-tab-with-wix-location/9122/9 "2024-11-24T18:19:13Z")

</div>

Just add this line above wixlocation.to

```javascript
$w('#submitButton').target = "_blank";

```

I’d also recommend that you switch to the new **wix-location-frontend**.
