Whenever I type something in a text box, it displays the text value based on its ID. This code works perfectly when running it on my laptop at http://localhost:8080/.
If I open the same website on my phone at http://xxx.xxx.x.xxx:8080/, it shows the same page.
However, when I type an ID into the text box on my phone and try to view the value that is on my laptop, it does not display that value.
https://i.sstatic.net/GfUvs.jpg
template:
<input id="1" type="text" placeholder="i am id1, show my value" />
<input id="2" type="text" placeholder="i am id2, show my value" />
<input v-model="searchidinput" type="text" placeholder="which ids data you want, 1 or 2 " />
<button @click="getvalue">RECEIVE</button>
<div>show value of id {{ searchid ? searchid : "<none>" }} here:
{{ value ? value : "none selected"}}
</div>
</template>
VUEJS:
<script>
import { defineComponent,ref } from 'vue'
export default defineComponent({
setup() {
const value = ref("");
const searchid = ref("");
const searchidinput = ref("");
function getvalue() {
this.value=null
this.searchid = this.searchidinput
const el = document.getElementById(this.searchid);
if (el) {
this.value = el.value
console.log(value);
}
}
return {
value,
searchid,
getvalue,
searchidinput,
};
}
})
</script>
How can I transfer text values without using a database across browsers on the same domain/website?